GoogleChrome · connorjclark · Sep 7, 2021 · Aug 18, 2021 · Aug 18, 2021 · Aug 19, 2021
diff --git a/lighthouse-cli/test/fixtures/dobetterweb/dbw_tester.html b/lighthouse-cli/test/fixtures/dobetterweb/dbw_tester.html
@@ -116,6 +116,16 @@
 </head>
 <body>
 
+<div class="shifter">Shifter</div>
+<script>
+  setTimeout(() => {
+    document.querySelector('.shifter').style.fontSize = '50px';
+  }, 1000);
+  setTimeout(() => {
+    document.querySelector('.shifter').style.display = 'none';
+  }, 2000);
+</script>
+
 <!-- Various sites like to assign HTMLElements a custom `matches` property. See issue #5934 -->
 
 <!-- EmbeddedContent will process these elements -->
@@ -201,7 +211,8 @@ <h2>Do better web tester page</h2>
 <!-- FAIL(image-aspect-ratio): image is naturally 480x318 -->
 <img src="lighthouse-480x318.jpg?iar1" width="120" height="15">
 <!-- PASS(image-aspect-ratio) -->
-<img src="lighthouse-480x318.jpg?iar2" width="120" height="80">
+<!-- FAIL(lcp-lazy-loaded) -->
+<img loading="lazy" src="lighthouse-480x318.jpg?iar2" width="120" height="80">
 
 <!-- FAIL(image-size-responsive): image is naturally 480x318 -->
 <img src="lighthouse-480x318.jpg?isr1" width="360" height="240" style="position: absolute;">
@@ -473,5 +484,25 @@ <h2>Do better web tester page</h2>
   console.error('Error! Error!');
 </script>
 
+<style>
+  #animated-boi {
+    animation: 3s badanim;
+    border: 1px solid black;
+  }
+
+  @keyframes badanim {
+    from {
+      margin-left: 100%;
+      height: 50px;
+    }
+
+    to {
+      margin-left: 0%;
+      height: 200px;
+    }
+  }
+</style>
+<div id="animated-boi">hi</div>
+
 </body>
 </html>
diff --git a/lighthouse-cli/test/fixtures/dobetterweb/third_party/aggressive-promise-polyfill.js b/lighthouse-cli/test/fixtures/dobetterweb/third_party/aggressive-promise-polyfill.js
diff --git a/lighthouse-cli/test/smokehouse/test-definitions/dobetterweb/dbw-expectations.js b/lighthouse-cli/test/smokehouse/test-definitions/dobetterweb/dbw-expectations.js
@@ -377,10 +377,10 @@ const expectations = {
       },
       'dom-size': {
         score: 1,
-        numericValue: 149,
+        numericValue: 153,
         details: {
           items: [
-            {statistic: 'Total DOM Elements', value: 149},
+            {statistic: 'Total DOM Elements', value: 153},
             {statistic: 'Maximum DOM Depth', value: 4},
             {
               statistic: 'Maximum Child Elements',
@@ -411,7 +411,7 @@ const expectations = {
           screenshot: {
             width: 360,
             // Allow for differences in platforms.
-            height: '1350±20',
+            height: '1350±100',
             data: /^data:image\/jpeg;.{500,}/,
           },
           nodes: {

diff --git a/lighthouse-core/scripts/update-report-fixtures.js b/lighthouse-core/scripts/update-report-fixtures.js
@@ -5,16 +5,19 @@
  */
 'use strict';
 
+const fs = require('fs');
 const cli = require('../../lighthouse-cli/run.js');
 const cliFlags = require('../../lighthouse-cli/cli-flags.js');
 const assetSaver = require('../lib/asset-saver.js');
-const artifactPath = 'lighthouse-core/test/results/artifacts';
-
 const {server} = require('../../lighthouse-cli/test/fixtures/static-server.js');
 const budgetedConfig = require('../test/results/sample-config.js');
+const {LH_ROOT} = require('../../root.js');
 
-// All artifacts must have resources from a consistent port, to ensure reproducibility. https://github.com/GoogleChrome/lighthouse/issues/11776
+const artifactPath = 'lighthouse-core/test/results/artifacts';
+// All artifacts must have resources from a consistent port, to ensure reproducibility.
+// https://github.com/GoogleChrome/lighthouse/issues/11776
 const MAGIC_SERVER_PORT = 10200;
+
 /**
  * Update the report artifacts. If artifactName is set only that artifact will be updated.
  * @param {keyof LH.Artifacts=} artifactName
@@ -45,6 +48,20 @@ async function update(artifactName) {
     finalArtifacts[artifactName] = newArtifact;
     await assetSaver.saveArtifacts(finalArtifacts, artifactPath);
   }
+
+  // Normalize some data.
+  const artifactsFile = `${LH_ROOT}/${artifactPath}/artifacts.json`;
+  /** @type {LH.Artifacts} */
+  const artifacts = JSON.parse(fs.readFileSync(artifactsFile, 'utf-8'));
+
+  for (const timing of artifacts.Timing) {
+    // @ts-expect-error: Value actually is writeable at this point.
+    timing.startTime = 0;
+    // @ts-expect-error: Value actually is writeable at this point.
+    timing.duration = 1;
+  }
+
+  fs.writeFileSync(artifactsFile, JSON.stringify(artifacts, null, 2));
 }
 
 update(/** @type {keyof LH.Artifacts | undefined} */ (process.argv[2]));
diff --git a/lighthouse-core/test/lib/i18n/swap-locale-test.js b/lighthouse-core/test/lib/i18n/swap-locale-test.js
@@ -50,18 +50,20 @@ describe('swap-locale', () => {
     expect(lhrDe.audits.plugins.title).toEqual('Dokument verwendet keine Plug-ins');
 
     // With ICU string argument values
-    expect(lhrEn.audits['dom-size'].displayValue).toEqual('148 elements');
-    expect(lhrDe.audits['dom-size'].displayValue).toEqual('148 Elemente');
+    expect(lhrEn.audits['dom-size'].displayValue).toMatchInlineSnapshot(`"153 elements"`);
+    /* eslint-disable no-irregular-whitespace */
+    expect(lhrDe.audits['dom-size'].displayValue).toMatchInlineSnapshot(`"153 Elemente"`);
 
     // Renderer formatted strings
     expect(lhrEn.i18n.rendererFormattedStrings.labDataTitle).toEqual('Lab Data');
     expect(lhrDe.i18n.rendererFormattedStrings.labDataTitle).toEqual('Labdaten');
 
     // Formatted numbers in placeholders.
-    expect(lhrEn.audits['mainthread-work-breakdown'].displayValue)
-      .toEqual('1.5 s');
-    expect(lhrDe.audits['mainthread-work-breakdown'].displayValue)
-      .toEqual('1,5 s');
+    expect(lhrEn.audits['mainthread-work-breakdown'].displayValue).
+toMatchInlineSnapshot(`"2.2 s"`);
+    expect(lhrDe.audits['mainthread-work-breakdown'].displayValue).
+toMatchInlineSnapshot(`"2,2 s"`);
+    /* eslint-enable no-irregular-whitespace */
   });
 
   it('can roundtrip back to english correctly', () => {