Clone tests

docs/single-demo.js

@@ -4,46 +4,51 @@ import React from "react";
 import { createRoot } from "react-dom/client";
 import Slider from "../src/slider";
 import MultipleItems from "../examples/MultipleItems";
-function SimpleSlider() {
-  const settings = {
-    dots: true,
-    infinite: true,
-    speed: 500,
-    slidesToShow: 1,
-    slidesToScroll: 1
-  };
-  return (
-    <div>
-      <h2> Single Item</h2>
-      <Slider {...settings}>
-        <div>
-          <h3>1</h3>
-        </div>
-        <div>
-          <h3>2</h3>
-        </div>
-        <div>
-          <h3>3</h3>
-        </div>
-        <div>
-          <h3>4</h3>
-        </div>
-        <div>
-          <h3>5</h3>
-        </div>
-        <div>
-          <h3>6</h3>
-        </div>
-      </Slider>
-    </div>
-  );
-}
+import SimpleSlider from "../examples/SimpleSlider";
+import CenterMode from "../examples/CenterMode";
+import UnevenSetsInfinite from "../examples/UnevenSetsInfinite";
+// function SimpleSlider() {
+//   const settings = {
+//     dots: true,
+//     infinite: true,
+//     speed: 500,
+//     slidesToShow: 1,
+//     slidesToScroll: 1
+//   };
+//   return (
+//     <div>
+//       <h2> Single Item</h2>
+//       <Slider {...settings}>
+//         <div>
+//           <h3>1</h3>
+//         </div>
+//         <div>
+//           <h3>2</h3>
+//         </div>
+//         <div>
+//           <h3>3</h3>
+//         </div>
+//         <div>
+//           <h3>4</h3>
+//         </div>
+//         <div>
+//           <h3>5</h3>
+//         </div>
+//         <div>
+//           <h3>6</h3>
+//         </div>
+//       </Slider>
+//     </div>
+//   );
+// }
 
 function App() {
   return (
     <div className="content">
       {/* <SimpleSlider /> */}
-      <MultipleItems />
+      {/* <MultipleItems /> */}
+      {/* <CenterMode /> */}
+      <UnevenSetsInfinite />
     </div>
   );
 }

examples/__tests__/CentreMode.test.js

@@ -17,8 +17,8 @@ describe("CenterMode Tests", () => {
     let totalSlides = getSlidesCount(container);
     let clonedSlides = getClonesCount(container);
     let activeSlides = getActiveSlidesCount(container);
-    expect(totalSlides).toEqual(16);
-    expect(clonedSlides).toEqual(10);
+    expect(totalSlides).toEqual(14);
+    expect(clonedSlides).toEqual(8);
     expect(activeSlides).toEqual(3);
     //expect(beautify_html(toString(container))).toMatchSnapshot();
   });

examples/__tests__/MultipleItems.test.js

@@ -20,10 +20,10 @@ import {
 import MultipleItems from "../MultipleItems";
 
 describe("Multiple Items", function() {
-  it("should have 9 actual slides and (3(pre) + 9(post)) clone slides", function() {
+  it("should have 9 actual slides and (3(pre) + 3(post)) clone slides", function() {
     const { container } = render(<MultipleItems />);
-    expect(getSlidesCount(container)).toEqual(21);
-    expect(getClonesCount(container)).toEqual(12);
+    expect(getSlidesCount(container)).toEqual(15);
+    expect(getClonesCount(container)).toEqual(6);
     //expect(beautify_html(toString(container))).toMatchSnapshot();
   });
   it("should have 3 active slides", function() {

examples/__tests__/SimpleSlider.test.js

@@ -16,13 +16,13 @@ import {
 } from "../../test-utils";
 
 describe("SimpleSlider example", () => {
-  it("should have 13 slides (1(preclone) + 6(actual) + 6(postclone))", function() {
-    const { container } = render(<SimpleSlider a={5} />);
-    expect(container.getElementsByClassName("slick-slide").length).toBe(13);
+  it("should have 13 slides (1(preclone) + 6(actual) + 1(postclone))", function() {
+    const { container } = render(<SimpleSlider />);
+    expect(container.getElementsByClassName("slick-slide").length).toBe(8);
   });
   it("should have 7 clone slides", function() {
     const { container } = render(<SimpleSlider />);
-    expect(container.getElementsByClassName("slick-cloned").length).toBe(7);
+    expect(container.getElementsByClassName("slick-cloned").length).toBe(2);
   });
   it("should have 1 current slide", function() {
     const { container } = render(<SimpleSlider />);

examples/__tests__/UnevenSets.test.js

@@ -82,8 +82,8 @@ describe("UnevenSets Infinite", () => {
     let clonedSlides = getClonesCount(container);
     let activeSlides = getActiveSlidesCount(container);
     let dots = getButtonsLength(container);
-    expect(totalSlides).toEqual(16);
-    expect(clonedSlides).toEqual(10);
+    expect(totalSlides).toEqual(14);
+    expect(clonedSlides).toEqual(8);
     expect(activeSlides).toEqual(4);
     expect(dots).toEqual(2);
     //  expect(beautify_html(toString(container))).toMatchSnapshot();

jest.config.js

@@ -1,5 +1,8 @@
 module.exports = {
   testEnvironment: "jsdom",
   setupFilesAfterEnv: ["<rootDir>/test-setup.js"],
-  testPathIgnorePatterns: ["/node_modules/", "playwright-tests"]
+  testPathIgnorePatterns: ["/node_modules/", "playwright-tests"],
+  moduleNameMapper: {
+    "react-slick": "<rootDir>/src/index.js"
+  }
 };