browsertime 17.0.0-beta.3 → 17.0.0-beta.4

package/CHANGELOG.md

@@ -3,10 +3,36 @@
 ## 17.0.0 - UNRELEASED
 
 ### Breaking changes
-* We moved the project to be a [pure ESM package](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c) [#1859](https://github.com/sitespeedio/browsertime/pull/1859). That helps us keep up to date with dependencies that already did the move.
+* We moved the project to be a [pure ESM package](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c) [#1859](https://github.com/sitespeedio/browsertime/pull/1859). That helps us keep up to date with dependencies that already did the move and make sure we can always use the latest version of our dependencies.
 
-If you are a command line user, everything will work as before. If you import Browsertime in NodeJS 
-we changed how you do your import.
+#### CLI users
+If you are a command line user and use scripting, you will need to do a change to your scripts or add a extra configuration. 
+The new browsertime version treat all JavaScript files that ends with *.js* as ESM modules, that means your old script files will not work out of the box. There's a couple of fixes for that:
+
+**The best fix**:
+Change your code so your scripts also follows ESM package. If you have simple scripts you probably just need to change your exports. The old way looked like this:
+
+```
+module.exports = async function(context, commands) {
+...
+}
+```
+
+change that to:
+```
+export default async function (context, commands) {
+...
+}
+```
+
+If you have more complicated scripts, follow the [ESM package guide](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c).
+
+**The quick fix**: Rename your *.js* to *.cjs* that way NodeJS will treat your file as a common JS file and everthing will just work. For example if you have a file names `login.js` you can rename that to `login.cjs` and make sure you load that new file.
+
+**Another quick fix alternative**: Add `--cjs` as a parameter to your test. That way the scripting file will be treated as a commonjs file. This is a hack, so to make sure it works, the user that runs Browsertime need to have write privileges to the folder where you have your scripting files.
+
+#### Non cli users 
+If you import Browsertime in NodeJS we changed how you do your import.
 
 If you use ES modules you can import Browsertime like this:
 ```JavaScript

package/bin/browsertime.js

@@ -154,6 +154,7 @@ async function run(urls, options) {
 }
 
 let cliResult = parseCommandLine();
+logging(cliResult.options);
 
 /*
   Each url can be:
@@ -169,8 +170,7 @@ const tests = [];
 for (const url of cliResult.urls) {
   // for each url, we try to load it as a script, that may contain
   // export a single function or an object containing setUp/test/tearDown functions.
-  let testScript = await loadScript(url);
-
+  let testScript = await loadScript(url, cliResult.options);
   // if the value is an url or a not a single function,  we can return the original value
   if (typeof testScript == 'string' || testScript instanceof AsyncFunction) {
     tests.push(url);
@@ -192,7 +192,4 @@ for (const url of cliResult.urls) {
   // here, url is the filename containing the script, and test the callable.
   tests.push([url, testScript.test]);
 }
-
-logging(cliResult.options);
-
 await run(tests, cliResult.options);

package/lib/core/engine/index.js

@@ -25,8 +25,8 @@ import Collector from './collector.js';
 import { Android, isAndroidConfigured } from '../../android/index.js';
 import RootedDevice from '../../android/root.js';
 import run from './run.js';
-import { loadScript } from '../../support/engineUtils.js';
 import IOSRecorder from '../../video/screenRecording/ios/iosRecorder.js';
+import { loadPrePostScripts, loadScript } from '../../support/engineUtils.js';
 const log = intel.getLogger('browsertime');
 const defaults = {
   scripts: [],
@@ -252,11 +252,30 @@ export default class Engine {
         engineDelegate = new Safari(storageManager, options);
       }
     }
+
+    let preScripts, postScripts, postURLScripts, pageCompleteCheck;
+
+    try {
+      preScripts = await loadPrePostScripts(options.preScript, options);
+      postScripts = await loadPrePostScripts(options.postScript, options);
+      postURLScripts = await loadPrePostScripts(options.postURLScript, options);
+      pageCompleteCheck = options.pageCompleteCheck
+        ? await loadScript(options.pageCompleteCheck, options)
+        : undefined;
+    } catch (error) {
+      log.error(error.message);
+      throw error;
+    }
+
     const iteration = new Iteration(
       storageManager,
       engineDelegate,
       scriptsByCategory,
       asyncScriptsByCategory,
+      preScripts,
+      postScripts,
+      postURLScripts,
+      pageCompleteCheck,
       options
     );
 
@@ -425,8 +444,7 @@ export default class Engine {
         if (Array.isArray(urlOrFile)) {
           script = urlOrFile[1];
         }
-
-        script = await loadScript(script, true);
+        script = await loadScript(script, options, true);
 
         if (script.setUp) {
           if (!options.preScript) {

package/lib/core/engine/iteration.js

@@ -7,10 +7,6 @@ import preURL from '../../support/preURL.js';
 import setResourceTimingBufferSize from '../../support/setResourceTimingBufferSize.js';
 import ScreenshotManager from '../../screenshot/index.js';
 import ExtensionServer from '../../extensionserver/index.js';
-import {
-  loadPrePostScriptsSync,
-  loadScriptSync
-} from '../../support/engineUtils.js';
 import Video from '../../video/video.js';
 import stop from '../../support/stop.js';
 import AddText from './command/addText.js';
@@ -61,19 +57,16 @@ export default class Iteration {
     engineDelegate,
     scriptsByCategory,
     asyncScriptsByCategory,
+    preScripts,
+    postScripts,
+    postURLScripts,
+    pageCompleteCheck,
     options
   ) {
-    try {
-      this.preScripts = loadPrePostScriptsSync(options.preScript);
-      this.postScripts = loadPrePostScriptsSync(options.postScript);
-      this.postURLScripts = loadPrePostScriptsSync(options.postURLScript);
-      this.pageCompleteCheck = options.pageCompleteCheck
-        ? loadScriptSync(options.pageCompleteCheck)
-        : undefined;
-    } catch (error) {
-      log.error(error.message);
-      throw error;
-    }
+    this.preScripts = preScripts;
+    this.postScripts = postScripts;
+    this.postURLScripts = postURLScripts;
+    this.pageCompleteCheck = pageCompleteCheck;
     this.options = options;
     this.storageManager = storageManager;
     this.engineDelegate = engineDelegate;

package/lib/support/cli.js

@@ -1194,6 +1194,12 @@ export function parseCommandLine() {
       type: 'boolean',
       default: false
     })
+    .option('cjs', {
+      describe:
+        'Load scripting files that ends with .js as common js. Default (false) loads files as esmodules.',
+      type: 'boolean',
+      default: false
+    })
     .option('browserRestartTries', {
       type: 'number',
       default: 3,

package/lib/support/engineUtils.js

@@ -1,83 +1,70 @@
-import { resolve, join, sep } from 'node:path';
-import os from 'node:os';
-import { createRequire } from 'node:module';
+import { resolve, dirname, join } from 'node:path';
+import { promisify } from 'node:util';
+import { writeFile as _writeFile, access, unlink as _unlink } from 'node:fs';
+import { pathToFileURL } from 'node:url';
 import dayjs from 'dayjs';
 import intel from 'intel';
 import { toArray } from '../support/util.js';
-import { copyFile, copyFileSync } from './fileUtil.js';
-import { realpathSync, mkdtempSync, rmdirSync } from 'node:fs';
-const require = createRequire(import.meta.url);
 const log = intel.getLogger('browsertime');
+const writeFile = promisify(_writeFile);
+const unlink = promisify(_unlink);
 
 const AsyncFunction = Object.getPrototypeOf(async function () {}).constructor;
 
-function getTmp() {
-  return mkdtempSync(realpathSync(os.tmpdir()) + sep);
-}
-
-export function loadPrePostScriptsSync(scripts) {
-  return toArray(scripts).map(script => {
-    // if the script is an AsyncFunction, return it.
-    if (script instanceof AsyncFunction) {
-      return script;
-    }
-    try {
-      if (script.endsWith('.js')) {
-        const dir = getTmp();
-        const name = join(dir, 'tmp.cjs');
-        copyFileSync(script, name);
-        const data = require(resolve(name));
-        rmdirSync(dir, { recursive: true });
-        return data;
-      } else {
-        return require(resolve(script));
-      }
-    } catch (error) {
-      throw new Error(
-        "Couldn't run pre/post script file: " + resolve(script) + ' ' + error
-      );
-    }
-  });
+async function exists(path) {
+  try {
+    await access(path);
+    return true;
+  } catch {
+    return false;
+  }
 }
 
-export function loadScriptSync(script) {
+async function loadFile(script, options, throwError) {
+  // if the script is an AsyncFunction, return it.
   if (script instanceof AsyncFunction) {
     return script;
-  }
-  try {
-    if (script.endsWith('.js')) {
-      const dir = getTmp();
-      const name = join(dir, 'tmp.cjs');
-      copyFileSync(script, name);
-      const data = require(resolve(name));
-      rmdirSync(dir, { recursive: true });
-      return data;
-    } else {
-      return require(resolve(script));
-    }
-  } catch {
-    // assume the script is a valid inline script by default
+  } else if (!script.endsWith('js')) {
+    // This is an inline script
     return script;
   }
-}
-
-export async function loadScript(script, throwError) {
-  if (script) {
-    // if the script is an AsyncFunction, return it.
-    if (script instanceof AsyncFunction) {
-      return script;
-    }
+  // If we follow correct naming for modules (.mjs) or commonjs (.cjs)
+  // we just loads it. .js files is loaded as commonjs if you set
+  // --cjs true
+  if (
+    options.cjs === false ||
+    script.endsWith('.mjs') ||
+    script.endsWith('.cjs')
+  ) {
+    let myFunction = await import(pathToFileURL(resolve(script)));
+    return myFunction.default ?? myFunction;
+  } else {
+    // Hack a way! Try to add a package.json file in the same folder as the
+    // script file. That way, the .js file will be treated as commonjs =
+    // working as before we moved Browsertime to module
+    let createdPackageJson = false;
     try {
-      if (script.endsWith('.js')) {
-        const dir = getTmp();
-        const name = join(dir, 'tmp.cjs');
-        await copyFile(script, name);
-        const data = require(resolve(name));
-        rmdirSync(dir, { recursive: true });
-        return data;
+      const packageJson = join(dirname(resolve(script)), 'package.json');
+      if (!(await exists(packageJson))) {
+        await writeFile(packageJson, '{}');
+        createdPackageJson = true;
       } else {
-        return require(resolve(script));
+        log.error(
+          'Could not create package.json file, the %S file will be treated as a esmodule',
+          script
+        );
+      }
+      const myFunction = await import(resolve(script));
+
+      try {
+        if (createdPackageJson) {
+          await unlink(packageJson);
+        }
+      } catch (error) {
+        log.error(error);
       }
+
+      return myFunction.default ?? myFunction;
     } catch (error) {
       // assume the script is a valid inline script by default
       if (throwError) {
@@ -90,6 +77,21 @@ export async function loadScript(script, throwError) {
       }
     }
   }
+}
+
+export async function loadPrePostScripts(scripts, options) {
+  const readScripts = [];
+  for (let script of toArray(scripts)) {
+    const loadedScript = await loadFile(script, options, true);
+    readScripts.push(loadedScript);
+  }
+  return readScripts;
+}
+
+export async function loadScript(script, options, throwError) {
+  if (script) {
+    return loadFile(script, options, throwError);
+  }
   return script;
 }
 export function timestamp() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "description": "Browsertime",
-  "version": "17.0.0-beta.3",
+  "version": "17.0.0-beta.4",
   "bin": "./bin/browsertime.js",
   "type": "module",
   "dependencies": {