@pernod-ricard-global-cms/jsutils 2.1.2 → 2.2.0

package/cypress/e2e/resizeDebouncer.cy.js

@@ -0,0 +1,5 @@
+import { resizeDebouncer } from '../../jsutils';
+
+describe('A suite to test resizeDebouncer()', () => {
+	// Test coming soon!
+});

package/cypress.config.js

@@ -0,0 +1,11 @@
+const { defineConfig } = require('cypress')
+
+module.exports = defineConfig({
+  e2e: {
+    // We've imported your old cypress plugins here.
+    // You may want to clean this up later by importing these.
+    setupNodeEvents(on, config) {
+      return require('./cypress/plugins/index.js')(on, config)
+    },
+  },
+})

package/jsutils.mjs

@@ -309,23 +309,37 @@ export function mobileCheck() {
 
 /**
  * Run a function after a window resize event, but only after the alloted time has ended.
- * If another resize even occurs it resets the time window.
+ * If another resize event occurs it resets the time window.
  * @param {function} debouncedFunction The function you want to run after a window resize event.
  * @param {number} time The time in ms.
+ * @param {boolean} ignoreVertical Set to true if you only want to listen for horizontal resizing events.
  */
-export function resizeDebouncer(debouncedFunction, time = 250) {
+export function resizeDebouncer(
+	debouncedFunction,
+	time = 250,
+	ignoreVertical = false
+) {
 	let resizeTimer;
+	let screenWidth = window.innerWidth;
 	window.addEventListener("resize", () => {
 		clearTimeout(resizeTimer);
 		resizeTimer = setTimeout(() => {
-			debouncedFunction();
+			if (ignoreVertical) {
+				let currentWidth = window.innerWidth;
+				if (currentWidth - screenWidth !== 0) {
+					debouncedFunction();
+				}
+				screenWidth = currentWidth;
+			} else {
+				debouncedFunction();
+			}
 		}, time);
 	});
 }
 
 /**
  * General purpose utility for running a function after a particular event fires on a specified element. The function only fires after the alloted time has ended.
- * If another resize even occurs it resets the time window.
+ * If another resize event occurs it resets the time window.
  * @param {htmlElement} element The element that emits the event.
  * @param {string} eventType The type of event to listen for.
  * @param {function} debouncedFunction The function to run after the event.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@pernod-ricard-global-cms/jsutils",
-	"version": "2.1.2",
+	"version": "2.2.0",
 	"description": "Handy collection of Javascript utility functions",
 	"type": "commonjs",
 	"main": "jsutils.mjs",
@@ -24,7 +24,7 @@
 		"swiper": "^8.1.4"
 	},
 	"devDependencies": {
-		"cypress": "^9.6.1",
+		"cypress": "^10.5.0",
 		"jsdoc": "^3.6.7"
 	}
 }

package/cypress.json

@@ -1 +0,0 @@
-{}