wrote the tests of #1874 that came out to be successful

akiran · May 25, 2023 · f880fba · f880fba
1 parent 0d30a59
commit f880fba
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 11 deletions.
diff --git a/examples/SimpleSlider.js b/examples/SimpleSlider.js
@@ -7,6 +7,7 @@ export default class SimpleSlider extends Component {
       dots: true,
       infinite: true,
       speed: 500,
+      initialSlide: 2,
       slidesToShow: 1,
       slidesToScroll: 1
     };

diff --git a/examples/__tests__/SimpleSlider.test.js b/examples/__tests__/SimpleSlider.test.js
@@ -11,7 +11,8 @@ import {
   getActiveSlidesCount,
   getActiveSlidesText,
   getButtons,
-  getButtonsListItem
+  getButtonsListItem,
+  getCurrentSlide
 } from "../../test-utils";
 
 describe("SimpleSlider example", () => {
@@ -23,7 +24,14 @@ describe("SimpleSlider example", () => {
     const { container } = render(<SimpleSlider />);
     expect(container.getElementsByClassName("slick-cloned").length).toBe(7);
   });
-  it("should have 1 active slide", function() {
+  it("should have 1 current slide(When initialSlide is 2)", function() {
+    const { container } = render(<SimpleSlider />);
+    expect(
+      container.querySelectorAll(".slick-slide.slick-current").length
+    ).toBe(1);
+    expect(parseInt(getCurrentSlide(container).textContent) - 1).toBe(2);
+  });
+  it("should have 1 active slide(When initialSlide is 2)", function() {
     const { container } = render(<SimpleSlider />);
     expect(container.querySelectorAll(".slick-slide.slick-active").length).toBe(
       1
@@ -32,7 +40,7 @@ describe("SimpleSlider example", () => {
       Array.from(getActiveSlide(container).children).map(
         e => parseInt(e.textContent) - 1
       )[0]
-    ).toBe(0);
+    ).toBe(2);
   });
   it("should have 6 dots", function() {
     const { container } = render(<SimpleSlider />);
@@ -55,30 +63,30 @@ describe("SimpleSlider example", () => {
     const { container } = render(<SimpleSlider />);
     expect(container.getElementsByClassName("slick-next").length).toBe(1);
   });
-  it("should got to second slide when next button is clicked", function() {
+  it("should got to next slide when next button is clicked", function() {
     const { container } = render(<SimpleSlider />);
     clickNext(container);
     expect(
       container.querySelectorAll(".slick-slide.slick-active")[0].textContent
-    ).toBe("2");
+    ).toBe("4");
     expect(container.querySelectorAll(".slick-dots .slick-active").length).toBe(
       1
     );
     expect(
-      container.querySelectorAll(".slick-dots")[0].children[1]
+      container.querySelectorAll(".slick-dots")[0].children[3]
     ).toHaveClass("slick-active");
   });
-  it("should goto last slide when prev button is clicked", function() {
+  it("should goto previous slide when prev button is clicked", function() {
     const { container } = render(<SimpleSlider />);
     clickPrevious(container);
     expect(
       container.querySelectorAll(".slick-slide.slick-active")[0].textContent
-    ).toBe("6");
+    ).toBe("2");
     expect(container.querySelectorAll(".slick-dots .slick-active").length).toBe(
       1
     );
     expect(
-      container.querySelectorAll(".slick-dots")[0].children[5]
+      container.querySelectorAll(".slick-dots")[0].children[1]
     ).toHaveClass("slick-active");
   });
   it("should goto 4th slide when 4th dot is clicked", function() {

diff --git a/src/inner-slider.js b/src/inner-slider.js
@@ -35,6 +35,7 @@ export class InnerSlider extends React.Component {
     this.state = {
       ...initialState,
       currentSlide: this.props.initialSlide,
+      targetSlide: this.props.initialSlide ? this.props.initialSlide : 0,
       slideCount: React.Children.count(this.props.children)
     };
     this.callbackTimers = [];
@@ -304,7 +305,8 @@ export class InnerSlider extends React.Component {
   };
   checkImagesLoad = () => {
     let images =
-      (this.list && this.list.querySelectorAll &&
+      (this.list &&
+        this.list.querySelectorAll &&
         this.list.querySelectorAll(".slick-slide img")) ||
       [];
     let imagesCount = images.length,
@@ -316,7 +318,7 @@ export class InnerSlider extends React.Component {
         image.onclick = () => image.parentNode.focus();
       } else {
         const prevClickHandler = image.onclick;
-        image.onclick = (e) => {
+        image.onclick = e => {
           prevClickHandler(e);
           image.parentNode.focus();
         };