Merge pull request #13552 from openfoodfoundation/dependabot/npm_and_yarn/jest-30.2.0

Bump jest from 27.5.1 to 30.2.0

app/webpacker/controllers/out_of_stock_modal_controller.js

@@ -1,4 +1,5 @@
 import { Controller } from "stimulus";
+import { locationPathName } from "js/window_location_wrapper";
 
 // This is meant to be used with the "modal:closing" event, ie:
 //
@@ -13,7 +14,7 @@ export default class extends Controller {
 
   redirect() {
     if (this.redirectValue) {
-      window.location.pathname = "/shop";
+      locationPathName("/shop");
     }
   }
 }

app/webpacker/controllers/popout_controller.js

@@ -8,7 +8,7 @@ export default class PopoutController extends Controller {
   };
 
   connect() {
-    this.displayElements = Array.from(this.element.querySelectorAll('input:not([type="hidden"]'));
+    this.displayElements = Array.from(this.element.querySelectorAll('input:not([type="hidden"])'));
     this.first_input = this.displayElements[0];
 
     // Show when click or down-arrow on button

app/webpacker/js/window_location_wrapper.js

@@ -0,0 +1,9 @@
+// Wrapper around location window.location
+//
+// It's mainly needed because we can't mock window.location in jsdom
+//
+const locationPathName = (pathName) => {
+  window.location.pathname = pathName;
+};
+
+export { locationPathName };

jest.config.js

@@ -138,7 +138,10 @@ module.exports = {
   // testEnvironment: "jest-environment-node",
 
   // Options that will be passed to the testEnvironment
-  // testEnvironmentOptions: {},
+  // this will become default in future jest release
+  testEnvironmentOptions: {
+    globalsCleanup: "on",
+  },
 
   // Adds a location field to test results
   // testLocationInResults: false,
@@ -166,11 +169,14 @@ module.exports = {
   // This option sets the URL for the jsdom environment. It is reflected in properties such as location.href
   // testURL: "http://localhost",
 
-  // Setting this value to "fake" allows the use of fake timers for functions such as "setTimeout"
-  // timers: "real",
+  // Setting this enableGlobally to "true" allows the use of fake timers for functions such as "setTimeout"
+  // fakeTimers: {
+  //   enableGlobally: false
+  // }
 
   // A map from regular expressions to paths to transformers
-  // transform: undefined,
+  // https://jestjs.io/docs/configuration#transform-objectstring-pathtotransformer--pathtotransformer-object
+  // transform: { "\\.[jt]sx?$": "babel-jest" },
 
   // An array of regexp pattern strings that are matched against all source file paths, matched files will skip transformation
   transformIgnorePatterns: ["/node_modules/(?!(stimulus.+)/)"],

package.json

@@ -37,7 +37,8 @@
   "devDependencies": {
     "@testing-library/dom": "<11.0.0",
     "jasmine-core": "~5.12.1",
-    "jest": "^27.4.7",
+    "jest": "^30.2.0",
+    "jest-environment-jsdom": "^30.2.0",
     "karma": "~6.4.4",
     "karma-chrome-launcher": "~3.2.0",
     "karma-coffee-preprocessor": "~1.0.1",

spec/javascripts/stimulus/out_of_stock_modal_controller_test.js

@@ -1,32 +1,18 @@
 /**
  * @jest-environment jsdom
+ * @jest-environment-options {"url": "http://www.example.com/"}
  */
 
 import { Application } from "stimulus";
-import out_of_stock_modal_controller from "../../../app/webpacker/controllers/out_of_stock_modal_controller";
+import * as locationWrapper from "js/window_location_wrapper";
+import out_of_stock_modal_controller from "controllers/out_of_stock_modal_controller";
 
 describe("OutOfStockModalController", () => {
   beforeAll(() => {
     const application = Application.start();
     application.register("out-of-stock-modal", out_of_stock_modal_controller);
-  });
 
-  let originalWindowLocation = window.location;
-
-  beforeEach(() => {
-    Object.defineProperty(window, "location", {
-      configurable: true,
-      enumerable: true,
-      value: new URL(window.location.href),
-    });
-  });
-
-  afterEach(() => {
-    Object.defineProperty(window, "location", {
-      configurable: true,
-      enumerable: true,
-      value: originalWindowLocation,
-    });
+    jest.spyOn(locationWrapper, "locationPathName").mockImplementation(() => undefined);
   });
 
   // We use window to dispatch the closing event so we don't need to set up another controller
@@ -46,7 +32,7 @@ describe("OutOfStockModalController", () => {
         const event = new Event("closing");
         window.dispatchEvent(event);
 
-        expect(window.location.href).not.toBe("/shop");
+        expect(locationWrapper.locationPathName).not.toHaveBeenCalled();
       });
     });
 
@@ -65,7 +51,7 @@ describe("OutOfStockModalController", () => {
         const event = new Event("closing");
         window.dispatchEvent(event);
 
-        expect(window.location.pathname).toBe("/shop");
+        expect(locationWrapper.locationPathName).toHaveBeenCalledWith("/shop");
       });
     });
   });

spec/javascripts/stimulus/tabs_and_panels_controller_test.js

@@ -3,7 +3,7 @@
  */
 
 import { Application } from "stimulus";
-import tabs_and_panels_controller from "../../../app/webpacker/controllers/tabs_and_panels_controller";
+import tabs_and_panels_controller from "controllers/tabs_and_panels_controller";
 
 describe("TabsAndPanelsController", () => {
   beforeAll(() => {
@@ -90,16 +90,8 @@ describe("TabsAndPanelsController", () => {
   });
 
   describe("when valid anchor is specified in the url", () => {
-    const oldWindowLocation = window.location;
     beforeAll(() => {
-      Object.defineProperty(window, "location", {
-        value: new URL("http://example.com/#boo_panel"),
-        configurable: true,
-      });
-    });
-    afterAll(() => {
-      delete window.location;
-      window.location = oldWindowLocation;
+      history.pushState({}, "", "#boo_panel");
     });
 
     it("#activateFromWindowLocationOrDefaultPanelTarget show panel based on anchor", () => {
@@ -121,16 +113,8 @@ describe("TabsAndPanelsController", () => {
   });
 
   describe("when non valid anchor is specified in the url", () => {
-    const oldWindowLocation = window.location;
     beforeAll(() => {
-      Object.defineProperty(window, "location", {
-        value: new URL("http://example.com/#non_valid_panel"),
-        configurable: true,
-      });
-    });
-    afterAll(() => {
-      delete window.location;
-      window.location = oldWindowLocation;
+      history.pushState({}, "", "#non_valid_panel");
     });
 
     it("#activateFromWindowLocationOrDefaultPanelTarget show default panel", () => {