data/playwright.extend.ts at main · mswjs/data · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
import fs from 'node:fs'
import path from 'node:path'
import { invariant } from 'outvariant'
import { test as testBase, expect, type Page } from '@playwright/test'
import { createServer, type ViteDevServer } from 'vite'

interface Fixtures {
  serve: <Context extends Record<string, unknown>>(
    fn: () => Promise<Context>,
  ) => Promise<{
    url: URL
    evaluate: <Callback extends (context: Context) => any>(
      callback: Callback,
      options?: { page: Page },
    ) => Promise<ReturnType<Callback>>
  }>
}

export { expect }

export const test = testBase.extend<Fixtures>({
  async serve({ page }, use) {
    let server: ViteDevServer | undefined

    const directory = path.join(
      process.cwd(),
      './tests/.tmp',
      test.info().testId,
    )
    const entryPath = path.join(directory, 'entry.ts')

    await use(async (fn) => {
      await fs.promises.mkdir(directory, { recursive: true })
      await fs.promises.writeFile(
        entryPath,
        `window.__vite_playwright_context__ = await (${fn.toString()})();`,
        'utf8',
      )

      await fs.promises.writeFile(
        path.join(directory, 'index.html'),
        `<!DOCTYPE html>
<html>
  <head><meta charset="utf-8"/></head>
  <body>
    <script type="module" src="/entry.ts"></script>
  </body>
</html>
      `,
        'utf8',
      )

      server = await createServer({
        root: directory,
        optimizeDeps: {
          entries: [entryPath],
        },
        build: {
          target: 'chrome139',
          rollupOptions: {
            external: /.+/,
          },
        },
        configFile: false,
        logLevel: 'error',
      })

      await server.listen()
      await page.waitForLoadState('networkidle')

      const url = server.resolvedUrls?.local[0]
      invariant(url, 'Failed to spawn Vite dev server')

      return {
        url: new URL(url),
        async evaluate(callback, options) {
          const targetPage = options?.page || page
          const context = await targetPage.evaluateHandle(
            () => window['__vite_playwright_context__' as keyof typeof window],
          )
          return await context.evaluate(callback)
        },
      }
    })

    await Promise.all([
      server?.close(),
      fs.promises.rm(directory, { recursive: true }),
    ])
  },
})