@onewelcome/react-lib-components 5.2.0 → 6.1.0

package/src/components/Breadcrumbs/Breadcrumbs.test.tsx

@@ -1,64 +0,0 @@
-/*
- * Copyright 2022 OneWelcome B.V.
- *
- *    Licensed under the Apache License, Version 2.0 (the "License");
- *    you may not use this file except in compliance with the License.
- *    You may obtain a copy of the License at
- *
- *        http://www.apache.org/licenses/LICENSE-2.0
- *
- *    Unless required by applicable law or agreed to in writing, software
- *    distributed under the License is distributed on an "AS IS" BASIS,
- *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- *    See the License for the specific language governing permissions and
- *    limitations under the License.
- */
-
-import React from "react";
-import { Breadcrumbs, Props } from "./Breadcrumbs";
-import { render } from "@testing-library/react";
-import { Link } from "../Link/Link";
-
-const defaultParams: Props = {
-  ariaLabel: "Breadcrumbs",
-  children: [
-    <Link key="0" to="#1" data-testid="link">
-      Test1
-    </Link>,
-    <Link key="1" to="#2" data-testid="link">
-      Test2
-    </Link>
-  ]
-};
-
-const createBreadcrumbs = (params?: (defaultParams: Props) => Props) => {
-  let parameters: Props = defaultParams;
-  if (params) {
-    parameters = params(defaultParams);
-  }
-  const queries = render(<Breadcrumbs {...parameters} data-testid="breadcrumbs"></Breadcrumbs>);
-  const breadcrumbs = queries.getByTestId("breadcrumbs");
-
-  return {
-    ...queries,
-    breadcrumbs
-  };
-};
-
-describe("Breadcrumbs should render", () => {
-  it("renders without crashing", () => {
-    const { breadcrumbs } = createBreadcrumbs();
-
-    expect(breadcrumbs).toBeDefined();
-    expect(breadcrumbs.firstChild).not.toHaveAttribute("aria-current");
-    if (breadcrumbs.firstChild) {
-      const homeIcon = (breadcrumbs.firstChild as HTMLElement).querySelector(
-        "[class*='icon-home-filled']"
-      );
-      expect(homeIcon).toBeInTheDocument();
-    }
-    expect((breadcrumbs.firstChild as HTMLElement).tagName).toEqual("A");
-    expect(breadcrumbs.lastChild).toHaveAttribute("aria-current", "page");
-    expect((breadcrumbs.lastChild as HTMLElement).tagName).toEqual("SPAN");
-  });
-});

package/src/components/Button/BaseButton.test.tsx

@@ -1,133 +0,0 @@
-/*
- * Copyright 2022 OneWelcome B.V.
- *
- *    Licensed under the Apache License, Version 2.0 (the "License");
- *    you may not use this file except in compliance with the License.
- *    You may obtain a copy of the License at
- *
- *        http://www.apache.org/licenses/LICENSE-2.0
- *
- *    Unless required by applicable law or agreed to in writing, software
- *    distributed under the License is distributed on an "AS IS" BASIS,
- *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- *    See the License for the specific language governing permissions and
- *    limitations under the License.
- */
-
-import React, { useEffect, useRef } from "react";
-import { BaseButton, Props } from "./BaseButton";
-import { render } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-
-const defaultParams: Props = {};
-
-const createBaseButton = (params?: (defaultParams: Props) => Props) => {
-  let parameters: Props = defaultParams;
-  if (params) {
-    parameters = params(defaultParams);
-  }
-  const queries = render(
-    <BaseButton {...parameters} data-testid="baseButton">
-      baseButton content
-    </BaseButton>
-  );
-  const baseButton = queries.getByTestId("baseButton");
-
-  return {
-    ...queries,
-    baseButton
-  };
-};
-
-describe("BaseButton should render", () => {
-  it("renders without crashing", () => {
-    const { baseButton } = createBaseButton();
-
-    expect(baseButton).toBeDefined();
-    expect(baseButton).toHaveTextContent("baseButton content");
-  });
-});
-
-describe("On click handler", () => {
-  it("executes the onclick handler", async () => {
-    const onClickHandler = jest.fn();
-    const { baseButton } = createBaseButton(defaultParams => ({
-      ...defaultParams,
-      onClick: onClickHandler
-    }));
-
-    await userEvent.click(baseButton);
-
-    expect(onClickHandler).toBeCalled();
-  });
-});
-
-describe("Properties of the button", () => {
-  it("should be disabled, function should not have been called", async () => {
-    const onClickHandler = jest.fn();
-    const { baseButton } = createBaseButton(defaultParams => ({
-      ...defaultParams,
-      disabled: true,
-      onClick: onClickHandler
-    }));
-
-    await userEvent.click(baseButton);
-    expect(onClickHandler).toHaveBeenCalledTimes(0);
-  });
-
-  it("when loading onClick function should not have been called", async () => {
-    const onClickHandler = jest.fn();
-    const { baseButton } = createBaseButton(defaultParams => ({
-      ...defaultParams,
-      loading: true,
-      onClick: onClickHandler
-    }));
-
-    await userEvent.click(baseButton);
-    expect(onClickHandler).toHaveBeenCalledTimes(0);
-  });
-
-  it('should have the class "TESTING"', () => {
-    const { baseButton } = createBaseButton(defaultParams => ({
-      ...defaultParams,
-      className: "TESTING"
-    }));
-
-    expect(baseButton).toHaveClass("TESTING");
-  });
-
-  it('should have a "name" property with the value "button"', () => {
-    const { baseButton } = createBaseButton(defaultParams => ({
-      ...defaultParams,
-      name: "button"
-    }));
-
-    expect(baseButton).toHaveAttribute("name", "button");
-  });
-});
-
-describe("ref should work", () => {
-  it("should give back the proper data prop, this also checks if the component propagates ...rest properly", () => {
-    const ExampleComponent = ({
-      propagateRef
-    }: {
-      propagateRef?: (ref: React.RefObject<HTMLElement>) => void;
-    }) => {
-      const ref = useRef(null);
-
-      useEffect(() => {
-        if (ref.current) {
-          propagateRef && propagateRef(ref);
-        }
-      }, [ref]);
-
-      return <BaseButton {...defaultParams} data-ref="testing" ref={ref} />;
-    };
-
-    const refCheck = (ref: React.RefObject<HTMLElement>) => {
-      expect(ref.current).toHaveAttribute("data-ref", "testing");
-    };
-
-    render(<ExampleComponent propagateRef={refCheck} />);
-  });
-});

package/src/components/Button/Button.test.tsx

@@ -1,138 +0,0 @@
-/*
- * Copyright 2022 OneWelcome B.V.
- *
- *    Licensed under the Apache License, Version 2.0 (the "License");
- *    you may not use this file except in compliance with the License.
- *    You may obtain a copy of the License at
- *
- *        http://www.apache.org/licenses/LICENSE-2.0
- *
- *    Unless required by applicable law or agreed to in writing, software
- *    distributed under the License is distributed on an "AS IS" BASIS,
- *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- *    See the License for the specific language governing permissions and
- *    limitations under the License.
- */
-
-import React, { useRef, useEffect } from "react";
-import { Button, Props } from "./Button";
-import { render } from "@testing-library/react";
-import { Icon, Icons } from "../Icon/Icon";
-
-const defaultParams: Props = {};
-
-const createButton = (params?: (defaultParams: Props) => Props) => {
-  let parameters: Props = defaultParams;
-  if (params) {
-    parameters = params(defaultParams);
-  }
-  const queries = render(
-    <Button {...parameters} data-testid="button">
-      button content
-    </Button>
-  );
-  const button = queries.getByTestId("button");
-
-  return {
-    ...queries,
-    button
-  };
-};
-
-describe("Button should render", () => {
-  it("renders without crashing", () => {
-    const { button } = createButton();
-
-    expect(button).toBeDefined();
-  });
-});
-
-describe("ref should work", () => {
-  it("should give back the proper data prop, this also checks if the component propagates ...rest properly", () => {
-    const ExampleComponent = ({
-      propagateRef
-    }: {
-      propagateRef?: (ref: React.RefObject<HTMLElement>) => void;
-    }) => {
-      const ref = useRef(null);
-
-      useEffect(() => {
-        if (ref.current) {
-          propagateRef && propagateRef(ref);
-        }
-      }, [ref]);
-
-      return <Button {...defaultParams} data-ref="testing" ref={ref} />;
-    };
-
-    const refCheck = (ref: React.RefObject<HTMLElement>) => {
-      expect(ref.current).toHaveAttribute("data-ref", "testing");
-    };
-
-    render(<ExampleComponent propagateRef={refCheck} />);
-  });
-});
-
-describe("Button should render", () => {
-  it("renders without crashing", () => {
-    const { button } = createButton();
-
-    expect(button).toBeDefined();
-  });
-});
-
-describe("Different variants of the button", () => {
-  it('should have a class of "primary"', () => {
-    const { button } = createButton();
-    expect(button.classList.contains("primary")).toBe(true);
-  });
-
-  it('should have a class of "secondary"', () => {
-    const { button } = createButton(defaultParams => ({ ...defaultParams, color: "secondary" }));
-    expect(button.classList.contains("secondary")).toBe(true);
-  });
-
-  it('should have a class of "warning"', () => {
-    const { button } = createButton(defaultParams => ({ ...defaultParams, color: "warning" }));
-    expect(button.classList.contains("warning")).toBe(true);
-  });
-
-  it('should have a class of "fill"', () => {
-    const { button } = createButton(defaultParams => ({ ...defaultParams, variant: "fill" }));
-    expect(button.classList.contains("fill")).toBe(true);
-  });
-
-  it('should have a class of "outline"', () => {
-    const { button } = createButton(defaultParams => ({ ...defaultParams, variant: "outline" }));
-    expect(button.classList.contains("outline")).toBe(true);
-  });
-
-  it('should have a class of "text"', () => {
-    const { button } = createButton(defaultParams => ({ ...defaultParams, variant: "text" }));
-    expect(button.classList.contains("text")).toBe(true);
-  });
-});
-
-describe("Button contains an icon", () => {
-  it("Contains an icon at the start", () => {
-    const { button } = createButton(defaultParams => ({
-      ...defaultParams,
-      startIcon: <Icon icon={Icons.Calendar} />
-    }));
-
-    expect(button.classList.contains("has-icon")).toBe(true);
-    expect(button.firstElementChild?.nodeName).toBe("I");
-    expect(button.querySelector("i + span")!.innerHTML).toBe("button content");
-  });
-
-  it("Contains an icon at the end", () => {
-    const { button } = createButton(defaultParams => ({
-      ...defaultParams,
-      endIcon: <Icon icon={Icons.Calendar} />
-    }));
-
-    expect(button.classList.contains("has-icon")).toBe(true);
-    expect(button.lastElementChild?.nodeName).toBe("I");
-    expect(button.querySelector("span")!.innerHTML).toBe("button content");
-  });
-});

package/src/components/Button/IconButton.test.tsx

@@ -1,122 +0,0 @@
-/*
- * Copyright 2022 OneWelcome B.V.
- *
- *    Licensed under the Apache License, Version 2.0 (the "License");
- *    you may not use this file except in compliance with the License.
- *    You may obtain a copy of the License at
- *
- *        http://www.apache.org/licenses/LICENSE-2.0
- *
- *    Unless required by applicable law or agreed to in writing, software
- *    distributed under the License is distributed on an "AS IS" BASIS,
- *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- *    See the License for the specific language governing permissions and
- *    limitations under the License.
- */
-
-import React, { useRef, useEffect } from "react";
-import { IconButton, Props } from "./IconButton";
-import { render } from "@testing-library/react";
-
-const defaultParams: Props = {
-  title: "iconbutton"
-};
-
-const createIconButton = (params?: (defaultParams: Props) => Props) => {
-  let parameters: Props = defaultParams;
-  if (params) {
-    parameters = params(defaultParams);
-  }
-  const queries = render(
-    <IconButton {...parameters} data-testid="iconButton">
-      iconButton content
-    </IconButton>
-  );
-  const iconButton = queries.getByTestId("iconButton");
-
-  return {
-    ...queries,
-    iconButton
-  };
-};
-
-describe("IconButton should render", () => {
-  it("renders without crashing", () => {
-    const { iconButton } = createIconButton();
-
-    expect(iconButton).toBeDefined();
-  });
-});
-
-describe("ref should work", () => {
-  it("should give back the proper data prop, this also checks if the component propagates ...rest properly", () => {
-    const ExampleComponent = ({
-      propagateRef
-    }: {
-      propagateRef?: (ref: React.RefObject<HTMLElement>) => void;
-    }) => {
-      const ref = useRef(null);
-
-      useEffect(() => {
-        if (ref.current) {
-          propagateRef && propagateRef(ref);
-        }
-      }, [ref]);
-
-      return <IconButton {...defaultParams} data-ref="testing" ref={ref} />;
-    };
-
-    const refCheck = (ref: React.RefObject<HTMLElement>) => {
-      expect(ref.current).toHaveAttribute("data-ref", "testing");
-    };
-
-    render(<ExampleComponent propagateRef={refCheck} />);
-  });
-});
-
-describe("Different variants of the button", () => {
-  it('should have a class of "primary"', () => {
-    const { iconButton } = createIconButton();
-    expect(iconButton.classList.contains("primary")).toBe(true);
-  });
-
-  it('should have a class of "secondary"', () => {
-    const { iconButton } = createIconButton(defaultParams => ({
-      ...defaultParams,
-      color: "secondary"
-    }));
-    expect(iconButton.classList.contains("secondary")).toBe(true);
-  });
-
-  it('should have a class of "warning"', () => {
-    const { iconButton } = createIconButton(defaultParams => ({
-      ...defaultParams,
-      color: "warning"
-    }));
-    expect(iconButton.classList.contains("warning")).toBe(true);
-  });
-
-  it('should have a class of "fill"', () => {
-    const { iconButton } = createIconButton(defaultParams => ({
-      ...defaultParams,
-      variant: "fill"
-    }));
-    expect(iconButton.classList.contains("fill")).toBe(true);
-  });
-
-  it('should have a class of "outline"', () => {
-    const { iconButton } = createIconButton(defaultParams => ({
-      ...defaultParams,
-      variant: "outline"
-    }));
-    expect(iconButton.classList.contains("outline")).toBe(true);
-  });
-
-  it('should have a class of "text"', () => {
-    const { iconButton } = createIconButton(defaultParams => ({
-      ...defaultParams,
-      variant: "text"
-    }));
-    expect(iconButton.classList.contains("text")).toBe(true);
-  });
-});