Update all of jest 29.7.0 → 30.0.0 (major)

package.json

@@ -54,7 +54,8 @@
     "test-coverage": "run-s test-build-coverage test-serve-coverage",
     "test-alex": "alex ./docs-* *.md",
     "test-lockfile": "lockfile-lint --path yarn.lock --allowed-hosts yarn --validate-https",
-    "test-debug": "node --inspect-brk node_modules/.bin/jest --runInBand"
+    "test-debug": "node --inspect-brk node_modules/.bin/jest --runInBand",
+    "postinstall": "patch-package"
   },
   "license": "MPL-2.0",
   "repository": {
@@ -123,7 +124,7 @@
     "@testing-library/react": "^16.3.0",
     "alex": "^11.0.1",
     "autoprefixer": "^10.4.21",
-    "babel-jest": "^29.7.0",
+    "babel-jest": "^30.0.0",
     "babel-loader": "^10.0.0",
     "babel-plugin-module-resolver": "^5.0.2",
     "browserslist": "^4.25.0",
@@ -152,17 +153,19 @@
     "glob": "^11.0.3",
     "html-webpack-plugin": "^5.6.3",
     "husky": "^4.3.8",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
+    "jest": "^30.0.0",
+    "jest-environment-jsdom": "^30.0.0",
     "jest-extended": "^6.0.0",
     "json-loader": "^0.5.7",
     "local-web-server": "^5.4.0",
     "lockfile-lint": "^4.14.1",
     "mkdirp": "^3.0.1",
     "npm-run-all2": "^8.0.4",
     "open": "^10.1.2",
+    "patch-package": "^8.0.0",
     "postcss": "^8.5.4",
     "postcss-loader": "^8.1.1",
+    "postinstall-postinstall": "^2.1.0",
     "prettier": "^3.5.3",
     "raw-loader": "^4.0.2",
     "rimraf": "^5.0.10",

patches/jsdom+26.1.0.patch

@@ -0,0 +1,13 @@
+diff --git a/node_modules/jsdom/lib/jsdom/browser/Window.js b/node_modules/jsdom/lib/jsdom/browser/Window.js
+index 52d011c..5b29f5a 100644
+--- a/node_modules/jsdom/lib/jsdom/browser/Window.js
++++ b/node_modules/jsdom/lib/jsdom/browser/Window.js
+@@ -507,7 +507,7 @@ function installOwnProperties(window, options) {
+     // [LegacyUnforgeable]:
+     window: { configurable: false },
+     document: { configurable: false },
+-    location: { configurable: false },
++    location: { configurable: true },
+     top: { configurable: false }
+   });
+

src/test/components/NetworkChart.test.js

@@ -455,7 +455,7 @@ describe('NetworkChartRowBar phase calculations', function () {
     const barStyles = getBarElementStyles();
     expect(barStyles).toHaveLength(2);
     expect(barStyles).toEqual([
-      'width: 40px; left: -18870px;',
+      'left: -18870px; width: 40px;',
       'width: 198px; left: 150px;',
     ]);
   });
@@ -485,7 +485,7 @@ describe('NetworkChartRowBar phase calculations', function () {
     const barStyles = getBarElementStyles();
     expect(barStyles).toHaveLength(2);
     expect(barStyles).toEqual([
-      'width: 40px; left: -18870px;',
+      'left: -18870px; width: 40px;',
       'width: 198px; left: 150px;',
     ]);
   });

src/test/components/__snapshots__/CallTreeSidebar.test.js.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`CallTreeSidebar can expand subcategories 1`] = `
 <aside
@@ -125,7 +125,7 @@ exports[`CallTreeSidebar can expand subcategories 1`] = `
     >
       <div
         class="sidebar-histogram-bar-color category-color-purple"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
     <h4
@@ -168,7 +168,7 @@ exports[`CallTreeSidebar can expand subcategories 1`] = `
     >
       <div
         class="sidebar-histogram-bar-color category-color-purple"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>
@@ -300,7 +300,7 @@ exports[`CallTreeSidebar can expand subcategories 2`] = `
     >
       <div
         class="sidebar-histogram-bar-color category-color-purple"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
     <div
@@ -373,7 +373,7 @@ exports[`CallTreeSidebar can expand subcategories 2`] = `
     >
       <div
         class="sidebar-histogram-bar-color category-color-purple"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>
@@ -485,7 +485,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying bytes data 2`] =
     >
       <div
         class="sidebar-histogram-bar-color category-color-yellow"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>
@@ -623,7 +623,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-yellow"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>
@@ -749,7 +749,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-yellow"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>
@@ -875,7 +875,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-transparent"
-        style="width: 50.0000%;"
+        style="width: 50%;"
       />
     </div>
     <div
@@ -898,7 +898,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-purple"
-        style="width: 50.0000%;"
+        style="width: 50%;"
       />
     </div>
     <h4
@@ -935,7 +935,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-purple"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>
@@ -1061,7 +1061,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-yellow"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
     <h4
@@ -1098,7 +1098,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-yellow"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>
@@ -1236,7 +1236,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-yellow"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>
@@ -1362,7 +1362,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-purple"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>
@@ -1488,7 +1488,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-transparent"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>
@@ -1614,7 +1614,7 @@ exports[`CallTreeSidebar matches the snapshots when displaying data about the cu
     >
       <div
         class="sidebar-histogram-bar-color category-color-purple"
-        style="width: 100.0000%;"
+        style="width: 100%;"
       />
     </div>
   </div>

src/test/components/__snapshots__/FlameGraph.test.js.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`FlameGraph EmptyReasons matches the snapshot when a profile has no samples 1`] = `
 <div
@@ -120,7 +120,7 @@ exports[`FlameGraph has a tooltip that matches the snapshot with categories 1`]
           >
             <div
               class="tooltipCallNodeGraphMeterBar"
-              style="width: 100%;"
+              style="width: 100%; background: var(--blue-40);"
             />
           </div>
           <div
@@ -160,7 +160,7 @@ exports[`FlameGraph has a tooltip that matches the snapshot with categories 1`]
           >
             <div
               class="tooltipCallNodeGraphMeterBar"
-              style="width: 33.33333333333333%;"
+              style="width: 33.33333333333333%; background: var(--category-color-lightblue);"
             />
           </div>
           <div
@@ -200,7 +200,7 @@ exports[`FlameGraph has a tooltip that matches the snapshot with categories 1`]
           >
             <div
               class="tooltipCallNodeGraphMeterBar"
-              style="width: 66.66666666666666%;"
+              style="width: 66.66666666666666%; background: var(--category-color-green);"
             />
           </div>
           <div
@@ -331,7 +331,7 @@ exports[`FlameGraph has a tooltip that matches the snapshot with categories when
           >
             <div
               class="tooltipCallNodeGraphMeterBar"
-              style="width: 100%;"
+              style="width: 100%; background: var(--blue-40);"
             />
           </div>
           <div
@@ -371,7 +371,7 @@ exports[`FlameGraph has a tooltip that matches the snapshot with categories when
           >
             <div
               class="tooltipCallNodeGraphMeterBar"
-              style="width: 100%;"
+              style="width: 100%; background: var(--category-color-lightblue);"
             />
           </div>
           <div
@@ -933,7 +933,7 @@ exports[`FlameGraph shows a tooltip with the resource information with categorie
           >
             <div
               class="tooltipCallNodeGraphMeterBar"
-              style="width: 100%;"
+              style="width: 100%; background: var(--blue-40);"
             />
           </div>
           <div
@@ -946,7 +946,7 @@ exports[`FlameGraph shows a tooltip with the resource information with categorie
           >
             <div
               class="tooltipCallNodeGraphMeterBar"
-              style="width: 100%;"
+              style="width: 100%; background: var(--blue-40);"
             />
           </div>
         </div>
@@ -978,7 +978,7 @@ exports[`FlameGraph shows a tooltip with the resource information with categorie
           >
             <div
               class="tooltipCallNodeGraphMeterBar"
-              style="width: 100%;"
+              style="width: 100%; background: var(--category-color-green);"
             />
           </div>
           <div
@@ -991,7 +991,7 @@ exports[`FlameGraph shows a tooltip with the resource information with categorie
           >
             <div
               class="tooltipCallNodeGraphMeterBar"
-              style="width: 100%;"
+              style="width: 100%; background: var(--category-color-green);"
             />
           </div>
         </div>

src/test/components/__snapshots__/SampleTooltipContents.test.js.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`SampleTooltipContents renders the CPU usage only when outside of the activity graph is hovered 1`] = `
 <div

src/test/components/__snapshots__/TooltipMarker.test.js.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`TooltipMarker renders profiled off-main thread FileIO markers properly 1`] = `
 <div
@@ -414,7 +414,7 @@ exports[`TooltipMarker renders properly network markers where content type is bl
     <div
       aria-hidden="true"
       class="tooltipNetworkPhase tooltipNetworkPhaseEmpty"
-      style="margin-left: 83.7404047452896%;"
+      style="margin-left: 83.7404047452896%; margin-right: 7.105427357601002e-15%;"
     />
   </div>
 </div>
@@ -600,7 +600,7 @@ exports[`TooltipMarker renders properly network markers where content type is mi
     <div
       aria-hidden="true"
       class="tooltipNetworkPhase tooltipNetworkPhaseEmpty"
-      style="margin-left: 83.7404047452896%;"
+      style="margin-left: 83.7404047452896%; margin-right: 7.105427357601002e-15%;"
     />
   </div>
 </div>
@@ -791,7 +791,7 @@ exports[`TooltipMarker renders properly network markers with a preconnect part 2
     <div
       aria-hidden="true"
       class="tooltipNetworkPhase"
-      style="margin-left: 95.9090909090909%; opacity: 0.5;"
+      style="margin-left: 95.9090909090909%; margin-right: 2.6645352591003757e-15%; opacity: 0.5;"
     />
     <h3
       class="tooltipNetworkTitle3"
@@ -860,7 +860,7 @@ exports[`TooltipMarker renders properly network markers with a preconnect part 2
     <div
       aria-hidden="true"
       class="tooltipNetworkPhase tooltipNetworkPhaseEmpty"
-      style="margin-left: 83.7404047452896%;"
+      style="margin-left: 83.7404047452896%; margin-right: 7.105427357601002e-15%;"
     />
   </div>
 </div>
@@ -1056,7 +1056,7 @@ exports[`TooltipMarker renders properly network markers with a preconnect part c
     <div
       aria-hidden="true"
       class="tooltipNetworkPhase tooltipNetworkPhaseEmpty"
-      style="margin-left: 83.7404047452896%;"
+      style="margin-left: 83.7404047452896%; margin-right: 7.105427357601002e-15%;"
     />
   </div>
 </div>
@@ -1310,7 +1310,7 @@ exports[`TooltipMarker renders properly normal network markers 1`] = `
     <div
       aria-hidden="true"
       class="tooltipNetworkPhase tooltipNetworkPhaseEmpty"
-      style="margin-left: 83.69368112707495%;"
+      style="margin-left: 83.69368112707495%; margin-right: -3.552713678800501e-15%;"
     />
   </div>
 </div>

src/test/components/__snapshots__/TrackBandwidth.test.js.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`TrackBandwidth draws a dot that matches the snapshot 1`] = `
 <div

src/test/components/__snapshots__/TrackCustomMarker.test.js.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`TrackCustomMarker draws a dot that matches the snapshot 1`] = `
 <div

src/test/components/__snapshots__/TrackMemory.test.js.snap

@@ -1,4 +1,4 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`TrackMemory draws a dot that matches the snapshot 1`] = `
 <div