From 4e6250b953ee74870583b8ef3c434db6438c6292 Mon Sep 17 00:00:00 2001
From: akiran <kiran@neostack.com>
Date: Wed, 27 Jul 2022 00:05:48 +0530
Subject: [PATCH] wrote tests for basic slider example

---
 examples/__tests__/SimpleSlider.test.js | 54 ++++++++++++++++++++++++-
 package.json                            |  1 +
 2 files changed, 54 insertions(+), 1 deletion(-)

diff --git a/examples/__tests__/SimpleSlider.test.js b/examples/__tests__/SimpleSlider.test.js
index db195bb74..dec3390dc 100644
--- a/examples/__tests__/SimpleSlider.test.js
+++ b/examples/__tests__/SimpleSlider.test.js
@@ -3,8 +3,60 @@ import SimpleSlider from "../SimpleSlider";
 import { render, fireEvent, waitFor, screen } from "@testing-library/react";
 
 describe("SimpleSlider example", () => {
-  test("render", () => {
+  it("should have 13 slides (1(preclone) + 6(actual) + 6(postclone))", function() {
     const { container } = render(<SimpleSlider />);
     expect(container.getElementsByClassName("slick-slide").length).toBe(13);
   });
+  it("should have 7 clone slides", function() {
+    const { container } = render(<SimpleSlider />);
+
+    expect(container.getElementsByClassName("slick-cloned").length).toBe(7);
+  });
+  it("should have 1 active slide", function() {
+    const { container } = render(<SimpleSlider />);
+    expect(container.querySelectorAll(".slick-slide.slick-active").length).toBe(
+      1
+    );
+  });
+  it("should have 6 dots", function() {
+    const { container } = render(<SimpleSlider />);
+    expect(
+      container.getElementsByClassName("slick-dots")[0].children.length
+    ).toBe(6);
+  });
+  it("should have 1 active dot", function() {
+    const { container } = render(<SimpleSlider />);
+    expect(container.querySelectorAll(".slick-dots .slick-active").length).toBe(
+      1
+    );
+  });
+  it("should have a prev arrow", function() {
+    const { container } = render(<SimpleSlider />);
+    expect(container.getElementsByClassName("slick-prev").length).toBe(1);
+  });
+  it("should have a next arrow", function() {
+    const { container } = render(<SimpleSlider />);
+    expect(container.getElementsByClassName("slick-next").length).toBe(1);
+  });
+  it("should got to second slide when next button is clicked", function() {
+    const { container } = render(<SimpleSlider />);
+    fireEvent(
+      container.getElementsByClassName("slick-next")[0],
+      new MouseEvent("click", {
+        bubbles: true,
+        cancelable: true
+      })
+    );
+    expect(
+      container.querySelectorAll(".slick-slide.slick-active")[0].textContent
+    ).toBe("2");
+    expect(container.querySelectorAll(".slick-dots .slick-active").length).toBe(
+      1
+    );
+    expect(
+      container
+        .querySelectorAll(".slick-dots")[0]
+        .children[1].classList.contains("slick-active")
+    ).toBe(true);
+  });
 });
diff --git a/package.json b/package.json
index ee96a1981..95be2dfe2 100644
--- a/package.json
+++ b/package.json
@@ -81,6 +81,7 @@
     "why-did-you-update": "^0.1.1"
   },
   "dependencies": {
+    "@testing-library/user-event": "^14.3.0",
     "classnames": "^2.2.5",
     "enquire.js": "^2.1.6",
     "json2mq": "^0.2.0",