browsertime 19.3.0 → 20.0.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # Browsertime changelog (we do [semantic versioning](https://semver.org))
 
+## 20.0.0 - 2023-12-22
+
+### Breaking
+* Changed `--userTimingWhitelist` to `--userTimingAllowList` in [#2023](https://github.com/sitespeedio/browsertime/pull/2023).
+* Reading pageCompleteCheck JavaScript from file now works as intended. It should be a plain JavaScript file named .js [#2034](https://github.com/sitespeedio/browsertime/pull/2034) see [#912](https://github.com/sitespeedio/browsertime/issues/912)
+
+### Fixed
+* Group page load parameters as PageLoad to make them easier to find using `--help` [#2035](https://github.com/sitespeedio/browsertime/pull/2035).
+* Fix starting Firefox 121 on Mac [#2043](https://github.com/sitespeedio/browsertime/pull/2043).
+
+### Added
+* Firefox 121 in the Docker container.g
+
+## 19.3.1 - 2023-12-18
+### Fixed 
+* Ensure that visual metrics python script is included in the release.
+
 ## 19.3.0 - 2023-12-18
 
 ### Added

package/README.md

@@ -168,13 +168,14 @@ To get the HAR from Firefox we use the [HAR Export Trigger](https://github.com/f
 
 We welcome contributions from the community! Whether you're fixing a bug, adding a feature, or improving documentation, your help is valuable. Here’s how you can contribute:
 
-1. **Fork and Clone**: Fork the repository and clone it locally.
-2. **Create a Branch**: Create a new branch for your feature or bug fix.
-3. **Develop**: Make your changes. Ensure you adhere to the coding standards and write tests if applicable.
-4. **Test**: Run tests to ensure everything works as expected.
-5. **Submit a Pull Request**: Push your changes to your fork and submit a pull request to the main repository.
+1. **Create an Issue**: Create an issue and discuss with us how to implement the issue.
+2. **Fork and Clone**: Fork the repository and clone it locally.
+3. **Create a Branch**: Create a new branch for your feature or bug fix.
+4. **Develop**: Make your changes. Ensure you adhere to the coding standards and write tests if applicable.
+5. **Test**: Run tests to ensure everything works as expected.
+6. **Submit a Pull Request**: Push your changes to your fork and submit a pull request to the main repository.
 
-Before contributing, please read our [CONTRIBUTING.md](CONTRIBUTING.md) for more detailed information on how to contribute.
+Before contributing, please read our [CONTRIBUTING.md](.github/CONTRIBUTING.md) for more detailed information on how to contribute.
 
 ### Reporting Issues
 Found a bug or have a feature request? Please use the [GitHub Issues](https://github.com/sitespeedio/browsertime/issues) to report them. Be sure to check existing issues to avoid duplicates.
@@ -185,6 +186,8 @@ Join our community! Whether you need help, want to share your experience, or dis
 
 - **Slack**: Connect with fellow users and the development team on [Slack](https://join.slack.com/t/sitespeedio/shared_invite/zt-296jzr7qs-d6DId2KpEnMPJSQ8_R~WFw).
 - **GitHub Issues**: For technical questions, feature requests, and bug reports, use our [GitHub issues](https://github.com/sitespeedio/browsertime/issues).
+- **RSS/Changelog**: Latest releases and information can always be found in our [RSS feed](https://github.com/sitespeedio/browsertime/releases.atom) and in our [changelog](https://github.com/sitespeedio/browsertime/blob/main/CHANGELOG.md).
+- **Mastodon**: Follow us on Mastodon [https://fosstodon.org/@sitespeedio](https://fosstodon.org/@sitespeedio).
 
 We're excited to have you in our community and look forward to your contributions and interactions!
 

package/lib/core/engine/command/measure.js

@@ -6,7 +6,7 @@ import { timestamp as _timestamp } from '../../../support/engineUtils.js';
 import { Video } from '../../../video/video.js';
 import { pathToFolder } from '../../../support/pathToFolder.js';
 import { setOrangeBackground } from '../../../video/screenRecording/setOrangeBackground.js';
-import { filterWhitelisted } from '../../../support/userTiming.js';
+import { filterAllowlisted } from '../../../support/userTiming.js';
 import { isAndroidConfigured, Android } from '../../../android/index.js';
 import { TCPDump } from '../../../support/tcpdump.js';
 import { lcpHighlightScript as highlightLargestContentfulPaint } from './util/lcpHighlightScript.js';
@@ -487,11 +487,11 @@ export class Measure {
 
     // Some sites has crazy amount of user timings:
     // strip them if you want
-    if (this.options.userTimingWhitelist) {
-      filterWhitelisted(
+    if (this.options.userTimingAllowList) {
+      filterAllowlisted(
         this.result[this.numberOfMeasuredPages].browserScripts.timings
           .userTimings,
-        this.options.userTimingWhitelist
+        this.options.userTimingAllowList
       );
     }
 

package/lib/core/engine/index.js

@@ -26,7 +26,11 @@ import { Android, isAndroidConfigured } from '../../android/index.js';
 import { RootedDevice } from '../../android/root.js';
 import { run } from './run.js';
 import { IOSRecorder } from '../../video/screenRecording/ios/iosRecorder.js';
-import { loadPrePostScripts, loadScript } from '../../support/engineUtils.js';
+import {
+  loadPrePostScripts,
+  loadScript,
+  loadPageCompleteScript
+} from '../../support/engineUtils.js';
 const log = intel.getLogger('browsertime');
 const defaults = {
   scripts: [],
@@ -260,7 +264,7 @@ export class Engine {
       postScripts = await loadPrePostScripts(options.postScript, options);
       postURLScripts = await loadPrePostScripts(options.postURLScript, options);
       pageCompleteCheck = options.pageCompleteCheck
-        ? await loadScript(options.pageCompleteCheck, options)
+        ? await loadPageCompleteScript(options.pageCompleteCheck)
         : undefined;
     } catch (error) {
       log.error(error.message);

package/lib/firefox/webdriver/builder.js

@@ -1,6 +1,7 @@
 import { resolve } from 'node:path';
 import { fileURLToPath } from 'node:url';
 import path from 'node:path';
+import { platform } from 'node:os';
 import {
   ServiceBuilder,
   Options,
@@ -168,9 +169,36 @@ export async function configureBuilder(builder, baseDir, options) {
   // https://bugzilla.mozilla.org/show_bug.cgi?id=1751196
 
   if (!isAndroidConfigured(options)) {
-    ffOptions.setBinary(
-      firefoxTypes.length > 0 ? firefoxTypes[0] : Channel.RELEASE
-    );
+    // Fix for https://github.com/sitespeedio/browsertime/issues/2041
+    if (platform() === 'darwin') {
+      if (
+        !firefoxConfig.binaryPath &&
+        !firefoxConfig.nightly &&
+        !firefoxConfig.beta &&
+        !firefoxConfig.developer
+      ) {
+        ffOptions.setBinary('/Applications/Firefox.app/Contents/MacOS/firefox');
+      } else if (firefoxConfig.nightly) {
+        ffOptions.setBinary(
+          '/Applications/Firefox Nightly.app/Contents/MacOS/firefox'
+        );
+      } else if (firefoxConfig.beta) {
+        ffOptions.setBinary(
+          '/Applications/Firefox Nightly.app/Contents/MacOS/firefox'
+        );
+      } else if (firefoxConfig.developer) {
+        ffOptions.setBinary(
+          '/Applications/FirefoxDeveloperEdition.app/Contents/MacOS/firefox'
+        );
+      } else if (firefoxConfig.binaryPath) {
+        ffOptions.setBinary(firefoxConfig.binaryPath);
+      }
+    } else {
+      // See https://github.com/sitespeedio/browsertime/issues/2041
+      ffOptions.setBinary(
+        firefoxTypes.length > 0 ? firefoxTypes[0] : Channel.RELEASE
+      );
+    }
   }
 
   ffOptions.addArguments('-no-remote');

package/lib/support/cli.js

@@ -905,43 +905,50 @@ export function parseCommandLine() {
     })
     .option('pageCompleteCheck', {
       describe:
-        'Supply a JavaScript (inline or JavaScript file) that decides when the browser is finished loading the page and can start to collect metrics. The JavaScript snippet is repeatedly queried to see if page has completed loading (indicated by the script returning true). Use it to fetch timings happening after the loadEventEnd. By default the tests ends 2 seconds after loadEventEnd. Also checkout --pageCompleteCheckInactivity and --pageCompleteCheckPollTimeout'
+        'Supply a JavaScript (inline or JavaScript file) that decides when the browser is finished loading the page and can start to collect metrics. The JavaScript snippet is repeatedly queried to see if page has completed loading (indicated by the script returning true). Use it to fetch timings happening after the loadEventEnd. By default the tests ends 2 seconds after loadEventEnd. Also checkout --pageCompleteCheckInactivity and --pageCompleteCheckPollTimeout',
+      group: 'PageLoad'
     })
     .option('pageCompleteWaitTime', {
       describe:
         'How long time you want to wait for your pageComplteteCheck to finish, after it is signaled to closed. Extra parameter passed on to your pageCompleteCheck.',
-      default: 8000
+      default: 8000,
+      group: 'PageLoad'
     })
     .option('pageCompleteCheckInactivity', {
       describe:
         'Alternative way to choose when to end your test. This will wait for 2 seconds of inactivity that happens after loadEventEnd.',
       type: 'boolean',
-      default: false
+      default: false,
+      group: 'PageLoad'
     })
     .option('pageCompleteCheckNetworkIdle', {
       describe:
         'Alternative way to choose when to end your test that works in Chrome and Firefox. Uses CDP or WebDriver Bidi to look at network traffic instead of running JavaScript in the browser to know when to end the test. By default this will wait 5 seconds of inactivity in the network log (no requets/responses in 5 seconds). Use --timeouts.networkIdle to change the 5 seconds. The test will end after 2 minutes if there is still activity on the network. You can change that timout using --timeouts.pageCompleteCheck ',
       type: 'boolean',
-      default: false
+      default: false,
+      group: 'PageLoad'
     })
     .option('pageCompleteCheckPollTimeout', {
       type: 'number',
       default: 1500,
       describe:
-        'The time in ms to wait for running the page complete check the next time.'
+        'The time in ms to wait for running the page complete check the next time.',
+      group: 'PageLoad'
     })
     .option('pageCompleteCheckStartWait', {
       type: 'number',
       default: 5000,
       describe:
-        'The time in ms to wait for running the page complete check for the first time. Use this when you have a pageLoadStrategy set to none'
+        'The time in ms to wait for running the page complete check for the first time. Use this when you have a pageLoadStrategy set to none',
+      group: 'PageLoad'
     })
     .option('pageLoadStrategy', {
       type: 'string',
       default: 'none',
       choices: ['eager', 'none', 'normal'],
       describe:
-        'Set the strategy to waiting for document readiness after a navigation event. After the strategy is ready, your pageCompleteCheck will start runninhg.'
+        'Set the strategy to waiting for document readiness after a navigation event. After the strategy is ready, your pageCompleteCheck will start running.',
+      group: 'PageLoad'
     })
     .option('iterations', {
       alias: 'n',
@@ -965,13 +972,15 @@ export function parseCommandLine() {
       type: 'number',
       default: 0,
       describe:
-        'Extra time added for the browser to settle before starting to test a URL. This delay happens after the browser was opened and before the navigation to the URL'
+        'Extra time added for the browser to settle before starting to test a URL. This delay happens after the browser was opened and before the navigation to the URL',
+      group: 'PageLoad'
     })
     .option('webdriverPageload', {
       type: 'boolean',
       describe:
         'Use webdriver.get to initialize the page load instead of window.location.',
-      default: false
+      default: false,
+      group: 'PageLoad'
     })
     .option('proxy.pac', {
       type: 'string',
@@ -1106,7 +1115,8 @@ export function parseCommandLine() {
       describe:
         'Use internal browser functionality to clear browser cache between runs instead of only using Selenium.',
       type: 'boolean',
-      default: false
+      default: false,
+      group: 'PageLoad'
     })
     .option('basicAuth', {
       describe:
@@ -1211,9 +1221,9 @@ export function parseCommandLine() {
       type: 'integer',
       default: 1500
     })
-    .option('userTimingWhitelist', {
+    .option('userTimingAllowList', {
       describe:
-        'All userTimings are captured by default this option takes a regex that will whitelist which userTimings to capture in the results.'
+        'All userTimings are captured by default this option takes a regex that will allow which userTimings to capture in the results.'
     })
     .option('headless', {
       type: 'boolean',
@@ -1233,7 +1243,8 @@ export function parseCommandLine() {
       type: 'boolean',
       default: false,
       describe:
-        'Flush DNS between runs, works on Mac OS and Linux. Your user needs sudo rights to be able to flush the DNS.'
+        'Flush DNS between runs, works on Mac OS and Linux. Your user needs sudo rights to be able to flush the DNS.',
+      group: 'PageLoad'
     })
     .option('extension', {
       describe:
@@ -1243,7 +1254,8 @@ export function parseCommandLine() {
       describe:
         'Convenient parameter to use if you test a SPA application: will automatically wait for X seconds after last network activity and use hash in file names. Read more: https://www.sitespeed.io/documentation/sitespeed.io/spa/',
       type: 'boolean',
-      default: false
+      default: false,
+      group: 'PageLoad'
     })
     .option('cjs', {
       describe:
@@ -1255,7 +1267,8 @@ export function parseCommandLine() {
       type: 'number',
       default: 3,
       describe:
-        'If the browser fails to start, you can retry to start it this amount of times.'
+        'If the browser fails to start, you can retry to start it this amount of times.',
+      group: 'PageLoad'
     })
     .option('preWarmServer', {
       type: 'boolean',

package/lib/support/engineUtils.js

@@ -1,12 +1,17 @@
 import { resolve, dirname, join } from 'node:path';
 import { promisify } from 'node:util';
-import { writeFile as _writeFile, unlink as _unlink } from 'node:fs';
+import {
+  writeFile as _writeFile,
+  unlink as _unlink,
+  readFile as _readFile
+} from 'node:fs';
 import { pathToFileURL } from 'node:url';
 import dayjs from 'dayjs';
 import intel from 'intel';
 import { toArray } from '../support/util.js';
 const log = intel.getLogger('browsertime');
 const writeFile = promisify(_writeFile);
+const readFile = promisify(_readFile);
 const unlink = promisify(_unlink);
 
 const AsyncFunction = Object.getPrototypeOf(async function () {}).constructor;
@@ -82,6 +87,13 @@ export async function loadPrePostScripts(scripts, options) {
   return readScripts;
 }
 
+export async function loadPageCompleteScript(script) {
+  if (script && script.endsWith('js')) {
+    return readFile(resolve(script), 'utf8');
+  }
+  return script;
+}
+
 export async function loadScript(script, options, throwError) {
   if (script) {
     return loadFile(script, options, throwError);

package/lib/support/userTiming.js

@@ -1,5 +1,5 @@
-export function filterWhitelisted(userTimings, whitelistRegex) {
-  const allowed = new RegExp(whitelistRegex);
+export function filterAllowlisted(userTimings, allowlistRegex) {
+  const allowed = new RegExp(allowlistRegex);
   userTimings.marks = userTimings.marks.filter(mark => allowed.test(mark.name));
   userTimings.measures = userTimings.measures.filter(measure =>
     allowed.test(measure.name)

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "browsertime",
   "description": "Get performance metrics from your web page using Browsertime.",
-  "version": "19.3.0",
+  "version": "20.0.0",
   "bin": "./bin/browsertime.js",
   "type": "module",
   "dependencies": {
@@ -56,9 +56,8 @@
     "bin",
     "browserscripts",
     "browsersupport",
-    "browsertime",
+    "visualmetrics",
     "browsertime.png",
-    "docs",
     "index.js",
     "lib",
     "package.json",

package/visualmetrics/__init__.py

@@ -0,0 +1 @@
+#

package/visualmetrics/test_visualmetrics.py

@@ -0,0 +1,34 @@
+import unittest
+import os
+
+from browsertime.visualmetrics import (
+    calculate_contentful_speed_index,
+    calculate_perceptual_speed_index,
+)
+
+HERE = os.path.dirname(__file__)
+
+
+class TestVisualMetrics(unittest.TestCase):
+    def setUp(self):
+        self.directory = "test_data"
+        images = os.listdir(os.path.join(HERE, self.directory))
+
+        def _p(image):
+            p = {}
+            p["time"] = int(image.split(".")[0].split("ms_")[-1])
+            return p
+
+        progress = [_p(image) for image in images if image.startswith("ms_")]
+        self.sorted_progress = sorted(progress,
+                                      key = lambda image: image['time'])
+
+    def test_calculate_contentful_speed_index(self):
+        res = calculate_contentful_speed_index(self.sorted_progress,
+                                               self.directory)
+        self.assertEqual(res[0], 1188)
+
+    def test_calculate_perceptual_speed_index(self):
+        res = calculate_perceptual_speed_index(self.sorted_progress,
+                                               self.directory)
+        self.assertEqual(res[0], 946)