@bigbinary/neetoui 3.2.69 → 3.2.72

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigbinary/neetoui",
-  "version": "3.2.69",
+  "version": "3.2.72",
   "main": "./index.js",
   "author": "BigBinary",
   "license": "MIT",

package/tests/Callout.test.js

@@ -0,0 +1,20 @@
+import React from "react";
+import { Callout } from "../lib/components";
+import { Check } from "@bigbinary/neeto-icons";
+import { render } from "@testing-library/react";
+
+describe("Callout", () => {
+  it("should render without error", () => {
+    const { getByText } = render(
+      <Callout>
+        <p>Tesing Callout</p>
+      </Callout>
+    );
+    expect(getByText("Tesing Callout")).toBeInTheDocument();
+  });
+
+  it("should show icon when icon component is provided", () => {
+    const { getByTestId } = render(<Callout icon={Check} />);
+    expect(getByTestId("callout-icon")).toBeInTheDocument();
+  });
+});

package/tests/Checkbox.test.js

@@ -0,0 +1,43 @@
+import React from "react";
+import { Checkbox } from "../lib/components";
+import { render } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+
+describe("Checkbox", () => {
+  it("should render without error", () => {
+    const { getByRole } = render(<Checkbox label="Checkbox" />);
+    expect(getByRole("checkbox")).toBeInTheDocument();
+  });
+
+  it("should call onChange when checkbox value is changed", () => {
+    const onChange = jest.fn();
+    const { getByRole } = render(
+      <Checkbox label="Checkbox" onChange={onChange} />
+    );
+    userEvent.click(getByRole("checkbox"));
+    expect(onChange).toHaveBeenCalledTimes(1);
+  });
+
+  it("should display error message", () => {
+    const { getByText } = render(
+      <Checkbox label="Checkbox" error="Error message" />
+    );
+    expect(getByText("Error message")).toBeInTheDocument();
+  });
+
+  it("should be unchecked by default", () => {
+    const { getByRole } = render(
+      <Checkbox label="Checkbox"/>
+    );
+    expect(getByRole("checkbox")).not.toBeChecked();
+  });
+
+  it("should be checked on clicking the checkbox", () => {
+    const { getByRole } = render(
+      <Checkbox label="Checkbox"/>
+    );
+    const checkbox = getByRole("checkbox");
+    userEvent.click(checkbox);
+    expect(checkbox).toBeChecked();
+  });
+});

package/tests/Modal.test.js

@@ -0,0 +1,116 @@
+import React from "react";
+import { Modal, Typography, Button } from "../lib/components";
+import { render } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+
+describe("Modal", () => {
+  it("should render without error", () => {
+    const { getByText } = render(
+      <Modal isOpen>
+        <Modal.Header>
+          <Typography style="h2">Modal Header</Typography>
+        </Modal.Header>
+      </Modal>
+    );
+    expect(getByText("Modal Header")).toBeInTheDocument();
+  });
+
+  it("should not display content when isOpen is false", () => {
+    const { queryByText } = render(
+      <Modal>
+        <Modal.Header>
+          <Typography style="h2">Modal Header</Typography>
+        </Modal.Header>
+      </Modal>
+    );
+    expect(queryByText("Modal Header")).not.toBeInTheDocument();
+  });
+
+  it("should render body", () => {
+    const { getByText } = render(
+      <Modal isOpen>
+        <Modal.Body>
+          <Typography style="body2" lineHeight="normal">
+            Sample body text
+          </Typography>
+        </Modal.Body>
+      </Modal>
+    );
+    expect(getByText("Sample body text")).toBeInTheDocument();
+  });
+
+  it("should render footer ", () => {
+    const { getByText } = render(
+      <Modal isOpen>
+        <Modal.Footer>
+          <Button label="Submit" size="large" />
+        </Modal.Footer>
+      </Modal>
+    );
+    expect(getByText("Submit")).toBeInTheDocument();
+  });
+
+  it("should not show close button when closeButton is false", () => {
+    const { queryByTestId } = render(
+      <Modal isOpen closeButton={false}>
+        <Modal.Body>Sample text</Modal.Body>
+      </Modal>
+    );
+    expect(queryByTestId("close-button")).not.toBeInTheDocument();
+  });
+
+  it("should trigger onClose on close button is clicked", () => {
+    const onClose = jest.fn();
+    const { getByTestId } = render(
+      <Modal isOpen onClose={onClose}>
+        <Modal.Body>Sample text</Modal.Body>
+      </Modal>
+    );
+    userEvent.click(getByTestId("close-button"));
+    expect(onClose).toHaveBeenCalledTimes(1);
+  });
+
+  it("should close the modal when Esc key is pressed", () => {
+    const onClose = jest.fn();
+    const { container } = render(
+      <Modal isOpen onClose={onClose}>
+        <Modal.Body>Sample text</Modal.Body>
+      </Modal>
+    );
+    userEvent.type(container, "{esc}");
+    expect(onClose).toHaveBeenCalledTimes(1);
+  });
+
+  it("should not close the modal when Esc key is pressed when closeOnEsc is false", () => {
+    const onClose = jest.fn();
+    const { container } = render(
+      <Modal isOpen onClose={onClose} closeOnEsc={false}>
+        <Modal.Body>Sample text</Modal.Body>
+      </Modal>
+    );
+    userEvent.type(container, "{esc}");
+    expect(onClose).not.toHaveBeenCalled();
+  });
+
+  it("should close modal when clicking outside", () => {
+    const onClose = jest.fn();
+    const { getByTestId } = render(
+      <Modal isOpen onClose={onClose} closeOnOutsideClick>
+        <Modal.Body>Sample text</Modal.Body>
+      </Modal>
+    );
+    userEvent.click(getByTestId("backdrop"));
+    expect(onClose).toHaveBeenCalledTimes(1);
+  });
+
+  it("should not close modal when clicking outside when closeOnOutsideClick is false", () => {
+    const onClose = jest.fn();
+    const { getByTestId } = render(
+      <Modal isOpen onClose={onClose} closeOnOutsideClick={false}>
+        <Modal.Body>Sample text</Modal.Body>
+      </Modal>
+    );
+    userEvent.click(getByTestId("backdrop"));
+    expect(onClose).not.toHaveBeenCalled();
+  });
+});

package/tests/PageLoader.test.js

@@ -0,0 +1,15 @@
+import React from "react";
+import { PageLoader } from "../lib/components";
+import { render } from "@testing-library/react";
+
+describe("PageLoader", () => {
+  it("should render without error", () => {
+    const { getByTestId } = render(<PageLoader data-testid="pageloader"/>);
+    expect(getByTestId("pageloader")).toBeInTheDocument();
+  });
+
+  it("should render text without error", () => {
+    const { getByText } = render(<PageLoader text="Loading"/>);
+    expect(getByText("Loading")).toBeInTheDocument();
+  });
+});

package/tests/Spinner.test.js

@@ -0,0 +1,10 @@
+import React from "react";
+import { Spinner } from "../lib/components";
+import { render } from "@testing-library/react";
+
+describe("Spinner", () => {
+  it("should render without error", () => {
+    const { getByTestId } = render(<Spinner/>);
+    expect(getByTestId("spinner")).toBeInTheDocument();
+  });
+});