From ec32089f9ffd395e68e80a21ae7ef3f9015fb133 Mon Sep 17 00:00:00 2001 From: akiran Date: Thu, 8 Feb 2024 23:03:14 +0530 Subject: [PATCH 1/5] Fixed #2076 click issue in Fade mode --- src/track.js | 45 ++++++++++++++++++++++----------------------- 1 file changed, 22 insertions(+), 23 deletions(-) diff --git a/src/track.js b/src/track.js index 2378d048d..d3c92f2f6 100644 --- a/src/track.js +++ b/src/track.js @@ -67,6 +67,7 @@ const getSlideStyle = spec => { style.left = -spec.index * parseInt(spec.slideWidth); } style.opacity = spec.currentSlide === spec.index ? 1 : 0; + style.zIndex = spec.currentSlide === spec.index ? 999 : 998; if (spec.useCSS) { style.transition = "opacity " + @@ -137,9 +138,7 @@ const renderSlides = spec => { // if slide needs to be precloned or postcloned if (spec.infinite && spec.fade === false) { let preCloneNo = childrenCount - index; - if ( - preCloneNo <= getPreClones(spec) - ) { + if (preCloneNo <= getPreClones(spec)) { key = -preCloneNo; if (key >= startIndex) { child = elem; @@ -163,27 +162,27 @@ const renderSlides = spec => { ); } - key = childrenCount + index; - if (key < endIndex) { - child = elem; - } - slideClasses = getSlideClasses({ ...spec, index: key }); - postCloneSlides.push( - React.cloneElement(child, { - key: "postcloned" + getKey(child, key), - "data-index": key, - tabIndex: "-1", - className: classnames(slideClasses, slideClass), - "aria-hidden": !slideClasses["slick-active"], - style: { ...(child.props.style || {}), ...childStyle }, - onClick: e => { - child.props && child.props.onClick && child.props.onClick(e); - if (spec.focusOnSelect) { - spec.focusOnSelect(childOnClickOptions); - } + key = childrenCount + index; + if (key < endIndex) { + child = elem; + } + slideClasses = getSlideClasses({ ...spec, index: key }); + postCloneSlides.push( + React.cloneElement(child, { + key: "postcloned" + getKey(child, key), + "data-index": key, + tabIndex: "-1", + className: classnames(slideClasses, slideClass), + "aria-hidden": !slideClasses["slick-active"], + style: { ...(child.props.style || {}), ...childStyle }, + onClick: e => { + child.props && child.props.onClick && child.props.onClick(e); + if (spec.focusOnSelect) { + spec.focusOnSelect(childOnClickOptions); } - }) - ); + } + }) + ); } }); From cf3130744e4e2ad5870d9286ffd95ecf0152fa02 Mon Sep 17 00:00:00 2001 From: akiran Date: Fri, 9 Feb 2024 21:49:31 +0530 Subject: [PATCH 2/5] Added regenerator-runtime for async jest tests --- package.json | 3 ++- test-setup.js | 1 + 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 6ab3c5320..2a5c68dd5 100644 --- a/package.json +++ b/package.json @@ -80,7 +80,8 @@ "webpack": "^4.21.0", "webpack-cli": "^3.1.2", "webpack-dev-server": "^3.1.9", - "why-did-you-update": "^0.1.1" + "why-did-you-update": "^0.1.1", + "regenerator-runtime": "^0.14.1" }, "dependencies": { "classnames": "^2.2.5", diff --git a/test-setup.js b/test-setup.js index 544d67a38..10cb36f33 100644 --- a/test-setup.js +++ b/test-setup.js @@ -1,4 +1,5 @@ import "@testing-library/jest-dom/extend-expect"; +import "regenerator-runtime/runtime"; //Fix for "matchMedia not present, legacy browsers require a polyfill jest" error window.matchMedia = From 372349a3ed21b9b5540b6fcc2e81b31e461e202d Mon Sep 17 00:00:00 2001 From: akiran Date: Fri, 9 Feb 2024 21:50:38 +0530 Subject: [PATCH 3/5] updated jest config to run tests only with .test.js extension --- jest.config.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/jest.config.js b/jest.config.js index 4973d7e41..2de2a965e 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,4 +1,6 @@ module.exports = { testEnvironment: "jsdom", - setupFilesAfterEnv: ["/test-setup.js"] + setupFilesAfterEnv: ["/test-setup.js"], + // testMatch: [ "**/__tests__/**/*.[jt]s?(x)", "**/?(*.)+(spec|test).[jt]s?(x)" ] + testMatch: ["**/?(*.)+(test).[jt]s?(x)"] }; From b9150c1564eefa15c8263ee5bf6c89f4731baaed Mon Sep 17 00:00:00 2001 From: akiran Date: Fri, 9 Feb 2024 21:58:26 +0530 Subject: [PATCH 4/5] updated jest config to ignore playwright tests --- jest.config.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/jest.config.js b/jest.config.js index 2de2a965e..0ef9b2852 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,6 +1,5 @@ module.exports = { testEnvironment: "jsdom", setupFilesAfterEnv: ["/test-setup.js"], - // testMatch: [ "**/__tests__/**/*.[jt]s?(x)", "**/?(*.)+(spec|test).[jt]s?(x)" ] - testMatch: ["**/?(*.)+(test).[jt]s?(x)"] + testPathIgnorePatterns: ["/node_modules/", "e2e-tests"] }; From d4595b0870db7437874b2bc1904647e591da6bcf Mon Sep 17 00:00:00 2001 From: akiran Date: Fri, 16 Feb 2024 23:13:18 +0530 Subject: [PATCH 5/5] placeholder for test --- __tests__/regression/fix-2076.test.js | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 __tests__/regression/fix-2076.test.js diff --git a/__tests__/regression/fix-2076.test.js b/__tests__/regression/fix-2076.test.js new file mode 100644 index 000000000..998378c51 --- /dev/null +++ b/__tests__/regression/fix-2076.test.js @@ -0,0 +1,3 @@ +// Test fix of #2076: Click on any slide in fade mode is triggering the click on last slide. + +// Todo: Need to write the test in playwright (Couldn't trigger click on inner slide in fade mode with testing library)