[Bug]: UI client uses wrong path separator

[urugator]

Version

1.42.1

Steps to reproduce

Run playwright in UI mode in docker exposed on 8080 (eg. using mcr.microsoft.com/playwright:v1.46.1-jammy): npx playwright test --ui --ui-port=8080 --ui-host=0.0.0.0" Open http://localhost:8080 on Windows. Use web UI to run some test and notice failing requests in browser's dev tools.

Expected behavior

UI client should construct filenames using separator provided by the server or the server should somehow normalize filenames for it's platform.

Actual behavior

UI constructs file paths using: https://github.com/microsoft/playwright/blob/5acd2dbf4835de3a9c5293ede90437768661b66d/packages/trace-viewer/src/ui/uiModeView.tsx#L41 The problem is that these paths are send to the server and used to locate files there. If the server is running on different OS than the client, it fails to serve these files.

Additional context

We rely on expectScreenshot quite extensively, but it requires executing tests in the same environment. To allow local development on various machines, we spin up a docker container with playwright UI exposed on http://localhost:8080 and project directory mounted as volume. So tests are executed in the docker (unix), but developer uses browser on his own system (windows) tu run the UI client. Atm we workaround this by patching the code above to always use /, but it introduces an extra complexity and complicates updating playwright.

Environment

System:
    OS: Windows 10 10.0.19045
    CPU: (4) x64 Intel(R) Core(TM) i5-2500K CPU @ 3.30GHz
    Memory: 1.18 GB / 7.98 GB
  Binaries:
    Node: 20.13.1 - C:\Program Files\nodejs\node.EXE     
    npm: 10.5.2 - C:\Program Files\nodejs\npm.CMD        
    pnpm: 9.1.3 - C:\Program Files\nodejs\pnpm.CMD
  IDEs:
    VSCode: 1.92.2 - C:\Users\urug\AppData\Local\Programs\Microsoft VS Code\bin\code.CMD
  Languages:
    Bash: 5.0.17 - C:\WINDOWS\system32\bash.EXE
  npmPackages:
    @playwright/test: 1.42.1 => 1.42.1