fix(browser): restrict served files from /__screenshot-error (#7340)

Author: hi-ogawa

packages/browser/src/node/plugin.ts

@@ -93,7 +93,15 @@ export default (parentServer: ParentBrowserProject, base = '/'): Plugin[] => {
             }
 
             const url = new URL(req.url, 'http://localhost')
-            const file = url.searchParams.get('file')
+            const id = url.searchParams.get('id')
+            if (!id) {
+              res.statusCode = 404
+              res.end()
+              return
+            }
+
+            const task = parentServer.vitest.state.idMap.get(id)
+            const file = task?.meta.failScreenshotPath
             if (!file) {
               res.statusCode = 404
               res.end()

packages/ui/client/components/views/ViewReport.vue

@@ -116,11 +116,11 @@ const showScreenshot = ref(false)
 const timestamp = ref(Date.now())
 const currentTask = ref<Task | undefined>()
 const currentScreenshotUrl = computed(() => {
-  const file = currentTask.value?.meta.failScreenshotPath
+  const id = currentTask.value?.id
   // force refresh
   const t = timestamp.value
   // browser plugin using /, change this if base can be modified
-  return file ? `/__screenshot-error?file=${encodeURIComponent(file)}&t=${t}` : undefined
+  return id ? `/__screenshot-error?id=${encodeURIComponent(id)}&t=${t}` : undefined
 })
 
 function showScreenshotModal(task: Task) {