lighthouse 9.3.1-dev.20220207 → 9.3.1-dev.20220211

package/report/test/renderer/report-renderer-axe-test.js

@@ -53,23 +53,44 @@ describe('ReportRendererAxe', () => {
       // eslint-disable-next-line no-undef
       const axeResults = await page.evaluate(config => axe.run(config), config);
 
-      expect(axeResults.violations).toMatchObject([
-        // Color contrast failure only pops up if this pptr is run headfully.
-        // There are currently 27 problematic nodes, primarily audit display text and explanations.
-        // TODO: fix these failures, regardless.
-        // {
-        //   id: 'color-contrast',
-        // },
-        {
-          id: 'duplicate-id',
-          nodes: [
-            // We use these audits in multiple categories. Makes sense.
-            {html: '<div class="lh-audit lh-audit--binary lh-audit--pass" id="viewport">'},
-            {html: '<div class="lh-audit lh-audit--binary lh-audit--fail" id="image-alt">'},
-            {html: '<div class="lh-audit lh-audit--binary lh-audit--pass" id="document-title">'},
-          ],
-        },
-      ]);
+      // Color contrast failure only pops up if this pptr is run headfully.
+      // There are currently 27 problematic nodes, primarily audit display text and explanations.
+      // TODO: fix these failures, regardless.
+      // {
+      //   id: 'color-contrast',
+      // },
+
+      expect(axeResults.violations.find(v => v.id === 'duplicate-id')).toMatchObject({
+        id: 'duplicate-id',
+        nodes: [
+          // We use these audits in multiple categories. Makes sense.
+          {html: '<div class="lh-audit lh-audit--binary lh-audit--pass" id="viewport">'},
+          {html: '<div class="lh-audit lh-audit--binary lh-audit--fail" id="image-alt">'},
+          {html: '<div class="lh-audit lh-audit--binary lh-audit--pass" id="document-title">'},
+        ],
+      });
+
+      const axeSummary = axeResults.violations.map((v) => {
+        return {
+          id: v.id,
+          message: v.nodes.map((n) => n.failureSummary).join('\n'),
+        };
+      });
+      expect(axeSummary).toMatchInlineSnapshot(`
+Array [
+  Object {
+    "id": "duplicate-id",
+    "message": "Fix any of the following:
+  Document has multiple static elements with the same id attribute: viewport
+Fix any of the following:
+  Document has multiple static elements with the same id attribute: image-alt
+Fix any of the following:
+  Document has multiple static elements with the same id attribute: document-title",
+  },
+]
+`);
+
+      expect(axeResults.violations).toMatchSnapshot();
     },
     // This test takes 10s on fast hardware, but can take longer in CI.
     // https://github.com/dequelabs/axe-core/tree/b573b1c1/doc/examples/jest_react#timeout-issues

package/report/types/report-renderer.d.ts

@@ -5,6 +5,7 @@
  */
 
 import { Result as AuditResult } from "../../types/lhr/audit-result";
+import { ReportUIFeatures } from "../renderer/report-ui-features.js";
 
 declare module Renderer {
   function renderReport(lhr: AuditResult, options?: Options): HTMLElement;
@@ -26,6 +27,12 @@ declare module Renderer {
     onPageAnchorRendered?: (link: HTMLAnchorElement) => void;
     /** If defined, `Save as HTML` option is shown in dropdown menu. */
     getStandaloneReportHTML?: () => string;
+    /**
+     * If defined, adds a `View Trace` button to the report, and calls this callback when clicked.
+     * The callback should do something to present the user with a visualization of the trace
+     * data, which can be gotten from the artifacts.
+     */
+    onViewTrace?: () => void;
   }
 }
 

package/shared/localization/locales/en-US.json

@@ -2543,6 +2543,12 @@
   "report/renderer/util.js | varianceDisclaimer": {
     "message": "Values are estimated and may vary. The [performance score is calculated](https://web.dev/performance-scoring/) directly from these metrics."
   },
+  "report/renderer/util.js | viewOriginalTraceLabel": {
+    "message": "View Original Trace"
+  },
+  "report/renderer/util.js | viewTraceLabel": {
+    "message": "View Trace"
+  },
   "report/renderer/util.js | viewTreemapLabel": {
     "message": "View Treemap"
   },

package/shared/localization/locales/en-XL.json

@@ -2543,6 +2543,12 @@
   "report/renderer/util.js | varianceDisclaimer": {
     "message": "V̂ál̂úêś âŕê éŝt́îḿât́êd́ âńd̂ ḿâý v̂ár̂ý. T̂h́ê [ṕêŕf̂ór̂ḿâńĉé ŝćôŕê íŝ ćâĺĉúl̂át̂éd̂](https://web.dev/performance-scoring/) d́îŕêćt̂ĺŷ f́r̂óm̂ t́ĥéŝé m̂ét̂ŕîćŝ."
   },
+  "report/renderer/util.js | viewOriginalTraceLabel": {
+    "message": "V̂íêẃ Ôŕîǵîńâĺ T̂ŕâćê"
+  },
+  "report/renderer/util.js | viewTraceLabel": {
+    "message": "V̂íêẃ T̂ŕâćê"
+  },
   "report/renderer/util.js | viewTreemapLabel": {
     "message": "V̂íêẃ T̂ŕêém̂áp̂"
   },

package/types/global-lh.d.ts

@@ -26,6 +26,7 @@ import Treemap_ from './lhr/treemap';
 declare global {
   module LH {
     export type ArbitraryEqualityMap = ArbitraryEqualityMap_;
+    export type NavigationRequestor = string | (() => Promise<void> | void);
 
     // artifacts.d.ts
     export import Artifacts = Artifacts_.Artifacts;