From e45b9e75d3e6a42d95f8eaa0b9070c3fe270d5e5 Mon Sep 17 00:00:00 2001
From: kiran <kiran@neostack.com>
Date: Sun, 16 Aug 2020 20:33:36 +0530
Subject: [PATCH] Fix an issue with prev button clicks in fade mode

---
 docs/single-demo.js                            |  6 +-----
 examples/Fade.js                               |  3 ++-
 examples/__tests__/Fade.js                     | 18 ++++++++++++++++++
 .../__snapshots__/MultipleItems.test.js.snap   |  2 +-
 src/inner-slider.js                            |  1 -
 5 files changed, 22 insertions(+), 8 deletions(-)
 create mode 100644 examples/__tests__/Fade.js

diff --git a/docs/single-demo.js b/docs/single-demo.js
index d2ada8a12..48880e398 100644
--- a/docs/single-demo.js
+++ b/docs/single-demo.js
@@ -3,9 +3,6 @@
 import React from "react";
 import ReactDOM from "react-dom";
 import Slider from "../src/slider";
-import UnevenSetsFinite from "../examples/UnevenSetsFinite";
-import UnevenSetsInfinite from "../examples/UnevenSetsInfinite";
-
 function SimpleSlider() {
   const settings = {
     dots: true,
@@ -44,8 +41,7 @@ function SimpleSlider() {
 function App() {
   return (
     <div className="content">
-      <UnevenSetsFinite />
-      {/* <UnevenSetsInfinite /> */}
+      <SimpleSlider />
     </div>
   );
 }
diff --git a/examples/Fade.js b/examples/Fade.js
index f8fd80e74..e4ae2c961 100644
--- a/examples/Fade.js
+++ b/examples/Fade.js
@@ -10,7 +10,8 @@ export default class Fade extends Component {
       infinite: true,
       speed: 500,
       slidesToShow: 1,
-      slidesToScroll: 1
+      slidesToScroll: 1,
+      waitForAnimate: false
     };
     return (
       <div>
diff --git a/examples/__tests__/Fade.js b/examples/__tests__/Fade.js
new file mode 100644
index 000000000..80a1095f3
--- /dev/null
+++ b/examples/__tests__/Fade.js
@@ -0,0 +1,18 @@
+import React from "react";
+import { mount } from "enzyme";
+import Fade from "../Fade";
+import { clickNext, clickPrev } from "../../__tests__/testUtils";
+
+describe("Fade", () => {
+  it("should change slides when clicked on next & prev buttons", () => {
+    const slider = mount(<Fade />);
+    let activeSlide = slider.find("div.slick-active");
+    expect(activeSlide.props()["data-index"]).toEqual(0);
+    clickNext(slider);
+    activeSlide = slider.find("div.slick-active");
+    expect(activeSlide.props()["data-index"]).toEqual(1);
+    clickPrev(slider);
+    activeSlide = slider.find("div.slick-active");
+    expect(activeSlide.props()["data-index"]).toEqual(0);
+  });
+});
diff --git a/examples/__tests__/__snapshots__/MultipleItems.test.js.snap b/examples/__tests__/__snapshots__/MultipleItems.test.js.snap
index ab771bdfd..7e4aabd01 100644
--- a/examples/__tests__/__snapshots__/MultipleItems.test.js.snap
+++ b/examples/__tests__/__snapshots__/MultipleItems.test.js.snap
@@ -989,7 +989,7 @@ exports[`Multiple Items should show slides first 3 slides when middle dot is cli
     <h2> Multiple items </h2>
     <div class=\\"slick-slider slick-initialized\\" dir=\\"ltr\\"><button type=\\"button\\" data-role=\\"none\\" class=\\"slick-arrow slick-prev\\" style=\\"display: block;\\"> Previous</button>
         <div class=\\"slick-list\\">
-            <div class=\\"slick-track\\" style=\\"opacity: 1; transform: translate3d(0px, 0px, 0px);\\">
+            <div class=\\"slick-track\\" style=\\"opacity: 1; transform: translate3d(0px, 0px, 0px); transition: transform 500ms ease;\\">
                 <div data-index=\\"-3\\" tabindex=\\"-1\\" class=\\"slick-slide slick-cloned\\" aria-hidden=\\"true\\" style=\\"width: 0px;\\">
                     <div>
                         <div tabindex=\\"-1\\" style=\\"width: 100%; display: inline-block;\\">
diff --git a/src/inner-slider.js b/src/inner-slider.js
index fe4342366..20f3ccc6a 100644
--- a/src/inner-slider.js
+++ b/src/inner-slider.js
@@ -410,7 +410,6 @@ export class InnerSlider extends React.Component {
   changeSlide = (options, dontAnimate = false) => {
     const spec = { ...this.props, ...this.state };
     let targetSlide = changeSlide(spec, options);
-    if (targetSlide === this.state.targetSlide) return;
     if (targetSlide !== 0 && !targetSlide) return;
     if (dontAnimate === true) {
       this.slideHandler(targetSlide, dontAnimate);