add dev mode to playwright tests

local/playwright-tooling/src/expectSuccess.js

@@ -2,7 +2,8 @@ const { expect } = require('@playwright/test');
 
 const resultSelector = '#testResult';
 
-module.exports = async (page) => {
-  await page.locator(resultSelector).waitFor({ state: 'visible', timeout: 10 * 60 * 1000 }); // 10mins
-  await expect(page.locator(resultSelector)).toHaveClass('passed', { timeout: 500 });
-}
+// default timeout = // 10mins
+module.exports = async (page, timeout = 10 * 60 * 1000) => {
+  await page.locator(resultSelector).waitFor({ state: 'visible', timeout });
+  await expect(page.locator(resultSelector)).toHaveClass('passed', { timeout: 1000 });
+};

local/playwright-tooling/src/playwrightRollup.js

@@ -1,65 +1,73 @@
 const { dirname } = require('path');
-const { rollup, watch: rollupWatch } = require('rollup');
+const { watch: rollupWatch } = require('rollup');
 const { test } = require('@playwright/test');
 const createPlaywrightRollupConfig = require('@~local/rollup/playwright');
 const collectCoverage = require('./collectCoverage');
 
-const createRollupBundle = async (testDir, watch = false) => {
-  let server;
-  const onListening = (srv) => {
-    server = srv;
-  };
-  const config = await createPlaywrightRollupConfig(testDir, 'dev', onListening);
+const createRollupBundle = async (testDir, useEsbuild, dev) => {
+  const [config, getServer] = await createPlaywrightRollupConfig(testDir, useEsbuild, dev);
+  const watcher = rollupWatch(config);
 
-  if (watch) {
-    const watcher = rollupWatch(config);
-    let outputPath = '';
-    // eslint-disable-next-line no-await-in-loop
-    await new Promise((resolve) => {
-      watcher.on('event', ({ code, error, result, output }) => {
-        if (code === 'ERROR') {
-          console.log('Error:', error); // eslint-disable-line
+  const outputPath = await new Promise((resolve) => {
+    let bundleOutput;
+    if (dev) {
+      console.log(`Using: ${useEsbuild ? 'esbuild' : 'rollup'}`); // eslint-disable-line
+    }
+    watcher.on('event', (event) => {
+      const { code, error, result, output } = event;
+      if (code === 'ERROR') {
+        console.log('Error:', error); // eslint-disable-line
+      }
+      if (code === 'START') {
+        if (dev) {
+          // eslint-disable-next-line
+          console.log(`Building...`);
         }
-        if (code === 'BUNDLE_END') {
-          outputPath = output[0];
-          if (result && result.close) {
-            result.close();
-          }
+      }
+      if (code === 'BUNDLE_END') {
+        bundleOutput = output;
+        if (result) {
+          result.close();
         }
-        if (code === 'END') {
-          /*
-          console.log('Watching for changes, press ENTER to continue.'); // eslint-disable-line
+      }
+      if (code === 'END') {
+        if (dev) {
+          // eslint-disable-next-line
+          console.log(`Watching for changes...`);
           console.log(''); // eslint-disable-line
-          */
-          resolve();
+        } else {
+          resolve(bundleOutput);
         }
-      });
+      }
     });
+  });
 
-    const { address, port } = server.address();
-    return {
-      url: `${address}:${port}`,
-      output: outputPath,
-      close: () => {
-        server.close();
-        watcher.close();
-      },
-    };
-  }
-
-  const bundle = await rollup(config);
-  await bundle.write(config.output);
+  const { address, port } = getServer().address();
+  return {
+    url: `${address}:${port}`,
+    output: outputPath,
+    close: () => {
+      getServer().close();
+      watcher.close();
+    },
+  };
 };
 
-module.exports = () => {
+module.exports = (useEsbuild = true) => {
   const originalCwd = process.cwd();
   let url;
   let close;
   let output;
 
   // eslint-disable-next-line no-empty-pattern
-  test.beforeAll(async ({}, { file, config }) => {
-    ({ close, url, output } = await createRollupBundle(dirname(file), true, config.quiet));
+  test.beforeAll(async ({}, { file, config, timeout }) => {
+    const isDev = config.globalTimeout === 0 && timeout === 0 && config.workers === 1;
+
+    if (isDev) {
+      test.setTimeout(0);
+    }
+
+    ({ close, url, output } = await createRollupBundle(dirname(file), useEsbuild, isDev));
   });
 
   test.beforeEach(async ({ page, browserName }, { config }) => {