Bump jest-environment-jsdom from 29.7.0 to 30.0.0 (#14195)

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Pascal Birchler <pascalb@google.com>

Author: dependabot[bot]

package-lock.json

@@ -136,7 +136,7 @@
     "jest": "^29.7.0",
     "jest-axe": "^9.0.0",
     "jest-canvas-mock": "^2.5.2",
-    "jest-environment-jsdom": "^29.6.1",
+    "jest-environment-jsdom": "^30.0.0",
     "jest-extended": "^4.0.0",
     "jest-fetch-mock": "^3.0.3",
     "jest-matcher-deep-close-to": "^3.0.2",

package.json

@@ -38,6 +38,6 @@
   },
   "devDependencies": {
     "@storybook/addon-essentials": "^8.6.12",
-    "@testing-library/react": "^14.0.0"
+    "@testing-library/react": "^16.3.0"
   }
 }

packages/activation-notice/package.json

@@ -52,6 +52,6 @@
     "prop-types": "^15.8.1"
   },
   "devDependencies": {
-    "@testing-library/react": "^14.0.0"
+    "@testing-library/react": "^16.3.0"
   }
 }

packages/stories-block/package.json

@@ -45,6 +45,7 @@ const Autocomplete = ({
           label={label}
           placeholder={placeholder}
           __nextHasNoMarginBottom
+          __next40pxDefaultSize
         />
       </div>
     )

packages/stories-block/src/block/components/autocomplete.js

@@ -21,19 +21,20 @@ import { getStoryAmpValidationErrors } from '../storyAmpValidationErrors';
 
 describe('getStoryAmpValidationErrors', () => {
   const fetchSpy = jest.spyOn(window, 'fetch');
-  const windowSpy = jest.spyOn(window, 'window', 'get');
 
   beforeAll(() => {
     fetchSpy.mockResolvedValue({
       text: () => ({
         status: 200,
       }),
     });
+
+    delete window.amp;
   });
 
   afterAll(() => {
     fetchSpy.mockClear();
-    windowSpy.mockRestore();
+    delete window.amp;
   });
 
   it('should return false if no link', async () => {
@@ -43,16 +44,14 @@ describe('getStoryAmpValidationErrors', () => {
   });
 
   it('should return false if there are no violations', async () => {
-    windowSpy.mockImplementation(() => ({
-      amp: {
-        validator: {
-          validateString: () => ({
-            status: 'PASS',
-            errors: [],
-          }),
-        },
+    window.amp = {
+      validator: {
+        validateString: () => ({
+          status: 'PASS',
+          errors: [],
+        }),
       },
-    }));
+    };
 
     await expect(
       getStoryAmpValidationErrors({
@@ -63,25 +62,23 @@ describe('getStoryAmpValidationErrors', () => {
   });
 
   it('should return true if there are AMP violations', async () => {
-    windowSpy.mockImplementation(() => ({
-      amp: {
-        validator: {
-          init: () => {},
-          validateString: () => ({
-            status: 'FAIL',
-            errors: [
-              { code: 'INVALID_URL_PROTOCOL', severity: 'ERROR' },
-              { code: 'TAG_REQUIRED_BY_MISSING', severity: 'ERROR' },
-              {
-                code: 'MISSING_URL',
-                severity: 'ERROR',
-                params: ['poster-portrait-src'],
-              },
-            ],
-          }),
-        },
+    window.amp = {
+      validator: {
+        init: () => {},
+        validateString: () => ({
+          status: 'FAIL',
+          errors: [
+            { code: 'INVALID_URL_PROTOCOL', severity: 'ERROR' },
+            { code: 'TAG_REQUIRED_BY_MISSING', severity: 'ERROR' },
+            {
+              code: 'MISSING_URL',
+              severity: 'ERROR',
+              params: ['poster-portrait-src'],
+            },
+          ],
+        }),
       },
-    }));
+    };
 
     await expect(
       getStoryAmpValidationErrors({
@@ -92,19 +89,17 @@ describe('getStoryAmpValidationErrors', () => {
   });
 
   it('should return false if there are no ERROR severity errors', async () => {
-    windowSpy.mockImplementation(() => ({
-      amp: {
-        validator: {
-          validateString: () => ({
-            status: 'FAIL',
-            errors: [
-              { severity: 'WARNING' },
-              { code: 'LOREM IPSUM', severity: 'WARNING' },
-            ],
-          }),
-        },
+    window.amp = {
+      validator: {
+        validateString: () => ({
+          status: 'FAIL',
+          errors: [
+            { severity: 'WARNING' },
+            { code: 'LOREM IPSUM', severity: 'WARNING' },
+          ],
+        }),
       },
-    }));
+    };
 
     await expect(
       getStoryAmpValidationErrors({
@@ -115,22 +110,20 @@ describe('getStoryAmpValidationErrors', () => {
   });
 
   it('should return false if MISSING URL is the only AMP Violation', async () => {
-    windowSpy.mockImplementation(() => ({
-      amp: {
-        validator: {
-          validateString: () => ({
-            status: 'FAIL',
-            errors: [
-              {
-                code: 'MISSING_URL',
-                severity: 'ERROR',
-                params: ['poster-portrait-src'],
-              },
-            ],
-          }),
-        },
+    window.amp = {
+      validator: {
+        validateString: () => ({
+          status: 'FAIL',
+          errors: [
+            {
+              code: 'MISSING_URL',
+              severity: 'ERROR',
+              params: ['poster-portrait-src'],
+            },
+          ],
+        }),
       },
-    }));
+    };
 
     await expect(
       getStoryAmpValidationErrors({

packages/story-editor/src/components/canvas/test/__snapshots__/mediaDisplay.js.snap

@@ -126,7 +126,7 @@ describe('MediaElement', () => {
     });
     const { container } = renderMediaElement(IMAGE_RESOURCE, 'local');
 
-    const results = await axe(container);
+    const results = await axe(container, { preload: false });
     expect(results).toHaveNoViolations();
   }, 30000);
 
@@ -137,7 +137,7 @@ describe('MediaElement', () => {
     });
     const { container } = renderMediaElement(GIF_RESOURCE, 'local');
 
-    const results = await axe(container);
+    const results = await axe(container, { preload: false });
     expect(results).toHaveNoViolations();
   }, 30000);
 
@@ -148,7 +148,7 @@ describe('MediaElement', () => {
     });
     const { container } = renderMediaElement(VIDEO_RESOURCE, 'local');
 
-    const results = await axe(container);
+    const results = await axe(container, { preload: false });
     expect(results).toHaveNoViolations();
   }, 30000);
 

packages/story-editor/src/components/checklist/checks/test/storyAmpValidationErrors.js

@@ -34,6 +34,6 @@
     "prop-types": "^15.8.1"
   },
   "devDependencies": {
-    "@testing-library/react": "^14.0.0"
+    "@testing-library/react": "^16.3.0"
   }
 }

packages/story-editor/src/components/library/test/mediaElement.js

@@ -136,6 +136,9 @@ export default {
           '<rootDir>/packages/stories-block/node_modules/react/index.js',
         '^react-dom(/.*)$':
           '<rootDir>/packages/stories-block/node_modules/react-dom/$1',
+        // Ditto for React Testing Library.
+        '^@testing-library/react$':
+          '<rootDir>/packages/stories-block/node_modules/@testing-library/react/dist/index.js',
       },
       testMatch: [
         '<rootDir>/packages/activation-notice/**/test/**/*.{js,jsx,ts,tsx}',