@lvce-editor/test-with-playwright 0.0.0-dev

package/README.md

@@ -0,0 +1,21 @@
+# @lvce-editor/test-with-playwright
+
+## Usage
+
+```js
+import {
+  runWithExtension,
+  test,
+  expect,
+} from '@lvce-editor/test-with-playwright'
+
+test('sample.hello-world', async () => {
+  const page = await runWithExtension({})
+  const sideBar = page.locator('#SideBar')
+  await expect(sideBar).toBeVisible()
+})
+```
+
+## Gitpod
+
+[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/lvce-editor/test-with-playwright)

package/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@lvce-editor/test-with-playwright",
+  "version": "0.0.0-dev",
+  "description": "",
+  "main": "src/main.js",
+  "types": "src/main.d.ts",
+  "type": "module",
+  "files": [
+    "src"
+  ],
+  "scripts": {
+    "postinstall": "node ./scripts/postinstall.js",
+    "test": "node --unhandled-rejections=warn --experimental-vm-modules ./node_modules/jest/bin/jest.js --detectOpenHandles --forceExit"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git@github.com:lvce-editor/test-with-playwright.git"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "MIT",
+  "dependencies": {
+    "@playwright/test": "^1.23.0",
+    "get-port": "^6.1.2",
+    "read-pkg-up": "^9.1.0"
+  },
+  "prettier": {
+    "semi": false,
+    "singleQuote": true
+  },
+  "devDependencies": {
+    "@lvce-editor/server": "^0.0.22",
+    "@types/jest": "^28.1.3",
+    "@types/node": "^18.0.0",
+    "execa": "^6.1.0",
+    "jest": "^28.1.2",
+    "prettier": "^2.7.1",
+    "typescript": "^4.7.4"
+  },
+  "jest": {
+    "testTimeout": 15000
+  }
+}

package/src/all.js

@@ -0,0 +1,54 @@
+import { readdirSync } from 'node:fs'
+import { join } from 'node:path'
+import { performance } from 'node:perf_hooks'
+import { pathToFileURL } from 'node:url'
+import { closeAll, getRoot, runTest, startAll, state } from './main.js'
+
+const getTestFiles = async (root) => {
+  return readdirSync(root).map((x) => join(root, x))
+}
+
+const main = async () => {
+  try {
+    let skipped = 0
+    let passed = 0
+    const start = performance.now()
+    state.runImmediately = false
+    await startAll()
+    console.info('SETUP COMPLETE')
+    const root = await getRoot()
+    state.root = root
+    const testFiles = await getTestFiles(join(root, 'src'))
+    console.log({ testFiles })
+    for (const testFile of testFiles) {
+      state.tests = []
+      const testUri = pathToFileURL(testFile).toString()
+      await import(testUri)
+      for (const test of state.tests) {
+        if (test.status === 'skipped') {
+          skipped++
+        } else {
+          await runTest(test)
+          passed++
+        }
+      }
+    }
+    const end = performance.now()
+    const duration = end - start
+    if (skipped) {
+      console.info(
+        `${passed} tests passed, ${skipped} tests skipped in ${duration}ms`
+      )
+    } else {
+      console.info(`${passed} tests passed in ${duration}ms`)
+    }
+  } catch (error) {
+    console.info('tests failed')
+    console.error(error)
+    process.exit(1)
+  } finally {
+    await closeAll()
+  }
+}
+
+main()

package/src/main.d.ts

@@ -0,0 +1,18 @@
+import type { Page } from '@playwright/test'
+
+export const runWithExtension: ({
+  folder,
+  env,
+}: {
+  folder?: string
+  env?: any
+}) => Promise<Page>
+
+export const test: {
+  (name: string, fn: () => Promise<void>): void
+  skip: (name: string, fn: () => Promise<void>) => void
+}
+
+export { expect } from '@playwright/test'
+
+export const getTmpDir: (prefix = 'foo-') => Promise<string>

package/src/main.js

@@ -0,0 +1,183 @@
+import { chromium } from '@playwright/test'
+import assert from 'assert'
+import { fork } from 'child_process'
+import { mkdir, mkdtemp, writeFile } from 'fs/promises'
+import getPort from 'get-port'
+import { join } from 'node:path'
+import { performance } from 'node:perf_hooks'
+import { tmpdir } from 'os'
+import { dirname } from 'path'
+import { readPackageUp } from 'read-pkg-up'
+
+export const state = {
+  /**
+   * @type {import('@playwright/test').Page|undefined}
+   */
+  page: undefined,
+  /**
+   * @type {import('@playwright/test').Browser|undefined}
+   */
+  browser: undefined,
+  /**
+   * @type {import('child_process').ChildProcess|undefined}
+   */
+  childProcess: undefined,
+  /**
+   * @type{boolean}
+   */
+  runImmediately: true,
+  /**
+   * @type{any}
+   */
+  tests: [],
+  port: 0,
+  root: undefined,
+}
+
+export const getRoot = async () => {
+  const rootPackageJson = await readPackageUp()
+  if (!rootPackageJson) {
+    throw new Error('package json not found')
+  }
+  return dirname(rootPackageJson.path)
+}
+
+const getExtensionFolder = async () => {
+  const root = state.root || (await getRoot())
+  return join(root, '..', 'extension')
+}
+
+export const getTmpDir = (prefix='foo-') => {
+  return mkdtemp(join(tmpdir(), prefix))
+}
+
+const launchServer = async ({ port, folder, env }) => {
+  const { serverPath } = await import('@lvce-editor/server')
+  // TODO disable saving state between tests in settings
+  const configDir = await getTmpDir()
+  await mkdir(join(configDir, 'lvce-oss'), { recursive: true })
+  await writeFile(
+    join(configDir, 'lvce-oss', 'settings.json'),
+    JSON.stringify(
+      {
+        'workbench.saveStateOnVisibilityChange': false,
+      },
+      null,
+      2
+    )
+  )
+  const extensionFolder = await getExtensionFolder()
+  const childProcess = fork(serverPath, {
+    stdio: 'inherit',
+    env: {
+      ...process.env,
+      PORT: port,
+      FOLDER: folder,
+      ONLY_EXTENSION: extensionFolder,
+      XDG_CONFIG_HOME: configDir,
+      ...env,
+    },
+  })
+  state.childProcess = childProcess
+  return new Promise((resolve, reject) => {
+    const handleMessage = (message) => {
+      if (message === 'ready') {
+        resolve(undefined)
+      } else {
+        reject(new Error('expected ready message'))
+      }
+    }
+    childProcess.once('message', handleMessage)
+  })
+}
+
+const startBrowser = async ({ port, headless = false }) => {
+  assert(!state.browser, 'Browser should not be defined')
+  console.info('START BROWSER')
+  const browser = await chromium.launch({
+    headless,
+  })
+  state.browser = browser
+  const page = await browser.newPage({})
+  state.page = page
+  return page
+}
+
+export const runWithExtension = async ({ folder = '', env = {} }) => {
+  folder ||= await getTmpDir()
+  if (state.page && state.childProcess) {
+    console.info('recycle page')
+    state.childProcess.send({
+      jsonrpc: '2.0',
+      method: 'Platform.setEnvironmentVariables',
+      params: [
+        {
+          FOLDER: folder,
+          ...env,
+        },
+      ],
+      id: 999999999999,
+    })
+    await state.page.goto(`http://localhost:${state.port}`)
+    return state.page
+  }
+  const port = await getPort()
+  const server = await launchServer({ port, folder, env })
+  const page = await startBrowser({
+    headless: false,
+    port,
+  })
+  await page.goto(`http://localhost:${port}`)
+  return page
+}
+
+export const runTest = async ({ name, fn }) => {
+  const start = performance.now()
+  console.info(`[test] running ${name}`)
+  await fn()
+  const end = performance.now()
+  const duration = end - start
+  console.info(`[test] passed ${name} in ${duration}ms`)
+}
+
+export const test = async (name, fn) => {
+  if (state.runImmediately) {
+    await runTest({ name, fn })
+  } else {
+    state.tests.push({ name, fn })
+  }
+}
+
+test.skip = (name, fn) => {
+  state.tests.push({ name, fn, status: 'skipped' })
+}
+
+export const startAll = async () => {
+  const port = await getPort()
+  await launchServer({
+    port,
+    env: {},
+    folder: '',
+  })
+  state.port = port
+  const headless = process.argv.includes('--headless')
+  const page = await startBrowser({ port, headless })
+  return page
+}
+
+export const closeAll = async () => {
+  if (state.childProcess) {
+    state.childProcess.kill('SIGTERM')
+    state.childProcess = undefined
+  }
+  if (state.page) {
+    await state.page.close()
+    state.page = undefined
+  }
+  if (state.browser) {
+    await state.browser.close()
+    state.browser = undefined
+  }
+}
+
+export { expect } from '@playwright/test'