fix: force forward slash to backslash on Windows in spec search input

[astone123]

• Closes Updated specs list search in 10.6 is not working with forward slash #23426

User facing changelog

When users on Windows use the spec list search, if their search term contains any instances of /, they will be replaced with \ to match the Windows path.

Additional details

Users on Windows couldn't copy/paste paths from anywhere that used / for directories into the specs search because Windows uses \ for paths. This forces the text input to use \ on Windows so that search terms will match directories on Windows.

Steps to test

Windows

1. Open a project that has at least one spec in a directory that is not in the project root
2. Search for the spec by its directory (for example, if your spec is src\specs\MySpec.cy.tsx, search for src/specs/)
3. Verify that the directory names are highlighted in the specs list and your spec appears
4. Repeat these steps for the inline spec list (the spec list that shows in the side bar when a test is running

Unix

1. Follow the steps for Windows and verify that nothing has changed with the specs search

How has the user experience changed?

Windows users will see their / change to \ when they use the spec search

PR Tasks

• Have tests been added/updated?
• Has the original issue (or this PR, if no issue exists) been tagged with a release in ZenHub? (user-facing changes only)
• [na] Has a PR for user-facing changes been opened in cypress-documentation?
• [na] Have API changes been updated in the type definitions?

[cypress-bot]

Thanks for taking the time to open a PR!

• Create a Draft Pull Request if your PR is not ready for review. Mark the PR as Ready for Review when you're ready for a Cypress team member to review the PR.
• Become familiar with the Code Review Checklist for guidelines on coding standards and what needs to be done before a PR can be merged.

[cypress]

---

Test summary

40019 • 0 • 3346 • 0 • 2

---

Run details

Project	cypress
Status	Passed
Commit	31c97a8
Started	Sep 12, 2022 5:29 PM
Ended	Sep 12, 2022 5:48 PM
Duration	18:41 💡
OS	Linux Debian - 11.3
Browser	Multiple

View run in Cypress Dashboard ➡️

---

Flakiness

	angular.cy.ts		1
1	Working with angular-14 > should mount a passing test
	e2e/origin/commands/log.cy.ts		1
1	cy.origin log > logs in primary and secondary origins

---

This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard

[mike-plummer]

Works well for me, both main and inline specs search work as described on Linux & Windows. There's a tiny gap where a windows filepath pasted into Cypress running on unix won't resolve, but that's outside the scope of the original defect. I do have two nitpicks:

1. I would like to see a test for this. We have a few OS-specific tests floating around using a pattern like this:

if (os.platform() === 'win32') {
  ...
}

2. In Windows when typing into the search field, if I enter a single forward slash / it is changed to a backslash (expected) and the cursor jumps to the end of the line (unexpected). Dynamically altering a model value often causes this sort of behavior, so I wonder if it would be better to move the path conversion logic into the search algo rather than trying to mutate it within the UI element

[ZachJW34]

Let's get a test for this new functionality

[astone123]

so I wonder if it would be better to move the path conversion logic into the search algo rather than trying to mutate it within the UI element

@mike-plummer yeah I'm going to change this to replace the separators on the server side instead of messing with the UI elements, good call.

[astone123]

This will fail on develop for Windows right now because e2e/accounts won't yield any results on Windows. With my changes it passes

[ZachJW34]

Perfect!