fix(browser): encode projectName in browser client URL (#9523)

Author: dkkim0122

packages/browser/src/client/client.ts

@@ -18,7 +18,7 @@ export const RPC_ID: string
 const METHOD = getBrowserState().method
 export const ENTRY_URL: string = `${
   location.protocol === 'https:' ? 'wss:' : 'ws:'
-}//${HOST}/__vitest_browser_api__?type=${PAGE_TYPE}&rpcId=${RPC_ID}&sessionId=${getBrowserState().sessionId}&projectName=${getBrowserState().config.name || ''}&method=${METHOD}&token=${(window as any).VITEST_API_TOKEN || '0'}`
+}//${HOST}/__vitest_browser_api__?type=${PAGE_TYPE}&rpcId=${RPC_ID}&sessionId=${getBrowserState().sessionId}&projectName=${encodeURIComponent(getBrowserState().config.name || '')}&method=${METHOD}&token=${(window as any).VITEST_API_TOKEN || '0'}`
 
 const onCancelCallbacks: ((reason: CancelReason) => void)[] = []
 

test/browser/fixtures/project-name-encoding/basic.test.ts

@@ -0,0 +1,5 @@
+import { expect, test } from 'vitest'
+
+test('basic test', () => {
+  expect(true).toBe(true)
+})

test/browser/fixtures/project-name-encoding/vitest.config.ts

@@ -0,0 +1,11 @@
+import { defineConfig } from 'vitest/config'
+
+export default defineConfig({
+  test: {
+    name: 'Components & Hooks',
+    browser: {
+      enabled: true,
+      headless: true,
+    },
+  },
+})

test/browser/specs/project-name-encoding.test.ts

@@ -0,0 +1,21 @@
+import { expect, test } from 'vitest'
+import { instances, provider, runBrowserTests } from './utils'
+
+test('runs tests correctly when project name contains special characters', async () => {
+  const { stderr, stdout, exitCode, ctx } = await runBrowserTests({
+    root: './fixtures/project-name-encoding',
+    browser: {
+      provider,
+      instances,
+    },
+  })
+
+  expect(stderr).toBe('')
+  expect(exitCode).toBe(0)
+
+  const projectName = ctx.config.name
+
+  instances.forEach(({ browser }) => {
+    expect(stdout).toReportPassedTest('basic.test.ts', `${projectName} (${browser})`)
+  })
+})