Use fraggle rock API for conducting lighthouse tests

index.d.ts

@@ -1,8 +1,8 @@
 import { Page } from 'playwright-core';
 
 export interface playwrightLighthouseConfig {
-  page?: Page;
   url?: string;
+  page: Page;
   port: number;
   thresholds?: Record<string, number>;
   opts?: Record<string, any>;

package.json

@@ -25,7 +25,8 @@
   "license": "MIT",
   "dependencies": {
     "chalk": "^4.1.2",
-    "ua-parser-js": "^1.0.2"
+    "ua-parser-js": "^1.0.2",
+    "lighthouse": "^9.2.0"
   },
   "devDependencies": {
     "@types/mocha": "9.1.0",
@@ -34,7 +35,6 @@
     "eslint": "^8.12.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-prettier": "^4.0.0",
-    "lighthouse": "^9.5.0",
     "mocha": "9.2.2",
     "playwright-core": "1.19.2",
     "prettier": "^2.6.1"

src/audit.js

@@ -21,7 +21,11 @@ const defaultReports = {
 const VALID_BROWSERS = ['Chrome', 'Chromium', 'Canary'];
 
 let playAudit = async function (auditConfig = {}) {
-  if (!auditConfig.port || (!auditConfig.page && !auditConfig.url)) {
+  if (process.env.LH_BROWSERSTACK == 'true' && !auditConfig.page) {
+    throw new Error(
+      `Please pass in the page object for a Browserstack run.`
+    );
+  } else if (!auditConfig.port || (!auditConfig.page && !auditConfig.url)) {
     throw new Error(
       `port, page or url is not set in playwright lighthouse config. Refer to https://github.com/abhinaba-ghosh/playwright-lighthouse to have more information and set it by yourself :). `
     );
@@ -60,6 +64,7 @@ let playAudit = async function (auditConfig = {}) {
   };
 
   const { comparison, results } = await lighthouse({
+    page: auditConfig.page,
     url,
     thresholds: auditConfig.thresholds || defaultThresholds,
     opts: auditConfig.opts,

src/task.js

@@ -2,6 +2,8 @@ const fs = require('fs/promises');
 const lighthouseLib = require('lighthouse');
 const ReportGenerator = require('lighthouse/report/generator/report-generator');
 
+const BSTACK_EXECUTION_FAILED = 'Failed to execute Lighthouse on Browserstack';
+
 const compare = (thresholds, newValue) => {
   const errors = [];
   const results = [];
@@ -35,6 +37,7 @@ const getReport = async (lhr, dir, name, type) => {
 };
 
 exports.lighthouse = async ({
+  page,
   url,
   thresholds,
   opts = {},
@@ -48,15 +51,36 @@ exports.lighthouse = async ({
     opts.onlyCategories = Object.keys(thresholds);
   }
 
-  const results = await lighthouseLib(
-    url,
-    { disableStorageReset: true, ...opts },
-    config
-  );
-  const newValues = Object.keys(results.lhr.categories).reduce(
+  let results;
+  if (process.env.LH_BROWSERSTACK == 'true') {
+    console.log(`Starting Lighthouse run on Browserstack for url => ${url}`);
+    const BSTACK_PARAMS = {
+      action: 'lighthouse',
+      arguments: { url: url, lhFlags: opts, lhConfig: config },
+    };
+    const response = await page.evaluate((_) => {},
+    `browserstack_executor: ${JSON.stringify(BSTACK_PARAMS)}`);
+    try {
+      const { lhSuccess, data } = JSON.parse(response);
+      results = data;
+      if (lhSuccess == 'false') throw 'lhRun failed';
+    } catch (error) {
+      throw new Error(
+        BSTACK_EXECUTION_FAILED + ': ' + response
+      );
+    }
+  } else {
+    ({ lhr: results } = await lighthouseLib(
+      url,
+      { disableStorageReset: true, ...opts },
+      config
+    ));
+  }
+
+  const newValues = Object.keys(results.categories).reduce(
     (acc, curr) => ({
       ...acc,
-      [curr]: results.lhr.categories[curr].score * 100,
+      [curr]: results.categories[curr].score * 100,
     }),
     {}
   );
@@ -65,7 +89,7 @@ exports.lighthouse = async ({
     var value = reports['formats'][typeFromKey];
     if (value) {
       await getReport(
-        results.lhr,
+        results,
         reports['directory'],
         reports['name'],
         typeFromKey