@onewelcome/react-lib-components 6.0.0 → 6.1.0

package/src/hooks/useScroll.test.tsx

@@ -1,36 +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 { fireEvent, render } from "@testing-library/react";
-import { useScroll } from "./useScroll";
-
-describe("function should be executed", () => {
-  it("should execute", () => {
-    const scrollHandler = jest.fn();
-
-    const Component = () => {
-      useScroll(scrollHandler);
-      return <div>Test</div>;
-    };
-
-    render(<Component />);
-
-    expect(scrollHandler).not.toBeCalled();
-    fireEvent.scroll(window, { target: { scrollY: 100 } });
-    expect(scrollHandler).toBeCalledTimes(1);
-  });
-});

package/src/hooks/useSpacing.test.ts

@@ -1,86 +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 { useSpacing } from "./useSpacing";
-
-describe("useSpacing should set propert padding and margin css properties", () => {
-  it("should set padding and margin for 4 values definition", () => {
-    const styles = useSpacing({ padding: "0 0.5 1 2", margin: "0 0.5 1 2" });
-    expect(styles).toHaveProperty("padding", "0rem 0.125rem 0.25rem 0.5rem");
-    expect(styles).toHaveProperty("margin", "0rem 0.125rem 0.25rem 0.5rem");
-  });
-
-  it("should set padding and margin for 3 values definition", () => {
-    const styles = useSpacing({ padding: "3 4 5", margin: "3 4 5" });
-    expect(styles).toHaveProperty("padding", "0.75rem 1rem 1.25rem");
-    expect(styles).toHaveProperty("margin", "0.75rem 1rem 1.25rem");
-  });
-
-  it("should set padding and margin for 2 values definition", () => {
-    const styles = useSpacing({ padding: "6 7", margin: "6 7" });
-    expect(styles).toHaveProperty("padding", "1.5rem 1.75rem");
-    expect(styles).toHaveProperty("margin", "1.5rem 1.75rem");
-  });
-
-  it("should set padding and margin for 1 value definition", () => {
-    const styles = useSpacing({ padding: 8, margin: "8" });
-    expect(styles).toHaveProperty("padding", "2rem");
-    expect(styles).toHaveProperty("margin", "2rem");
-  });
-
-  it("should set paddingLeft, paddingRight, paddingTop, paddingBottom, marginLeft, marginRight, marginTop, marginBottom css values when all provided", async () => {
-    const styles = useSpacing({
-      paddingLeft: "1",
-      paddingRight: 1,
-      paddingTop: "2",
-      paddingBottom: 0.5,
-      marginLeft: 3,
-      marginRight: 4,
-      marginTop: 5,
-      marginBottom: 6
-    });
-    expect(styles).toHaveProperty("paddingLeft", "0.25rem");
-    expect(styles).toHaveProperty("paddingRight", "0.25rem");
-    expect(styles).toHaveProperty("paddingTop", "0.5rem");
-    expect(styles).toHaveProperty("paddingBottom", "0.125rem");
-    expect(styles).toHaveProperty("marginLeft", "0.75rem");
-    expect(styles).toHaveProperty("marginRight", "1rem");
-    expect(styles).toHaveProperty("marginTop", "1.25rem");
-    expect(styles).toHaveProperty("marginBottom", "1.5rem");
-    expect(styles?.padding).toBeUndefined();
-    expect(styles?.margin).toBeUndefined();
-  });
-});
-
-describe("useSpacing should add/repalce properties in passed style object", () => {
-  it("should add properties to style object", () => {
-    const styles = useSpacing({ padding: 8, margin: "8" }, { backgroundColor: "red" });
-    expect(styles).toStrictEqual({ padding: "2rem", margin: "2rem", backgroundColor: "red" });
-  });
-
-  it("should add and replace properties to style object", () => {
-    const styles = useSpacing(
-      { padding: 8, margin: "8" },
-      { padding: "2px", paddingTop: 2, backgroundColor: "red" }
-    );
-    expect(styles).toStrictEqual({
-      padding: "2rem",
-      margin: "2rem",
-      paddingTop: 2,
-      backgroundColor: "red"
-    });
-  });
-});

package/src/hooks/useUploadFile.test.ts

@@ -1,211 +0,0 @@
-import { useUploadFile } from "./useUploadFile";
-import { renderHook } from "@testing-library/react";
-import { waitFor } from "@testing-library/react";
-import { FileType } from "../components/Form/FileUpload/FileUpload";
-
-const DONE = 4;
-
-const mockXhrRequest = (status: number, readyState?: number, response?: Object) => {
-  return {
-    open: jest.fn(),
-    send: jest.fn(),
-    addEventListener: jest.fn(),
-    onprogress: jest.fn(),
-    responseText: response,
-    onreadystatechange: jest.fn(),
-    getResponseHeader: jest.fn(),
-    upload: {
-      addEventListener: jest.fn()
-    },
-    DONE,
-    setRequestHeader: jest.fn(),
-    readyState: readyState || 4,
-    status
-  };
-};
-
-type mockRequestParams = Parameters<typeof mockXhrRequest>;
-
-const progressData = {
-  loaded: 12,
-  total: 100
-};
-
-const requestInfo = { url: "https://www.test.io", withCredentials: true };
-
-const file = {
-  name: "test.txt",
-  data: new File([""], "test.txt"),
-  size: 5,
-  type: ""
-};
-
-const setupXhrEnvironment = (mockParams: mockRequestParams) => {
-  const mock = mockXhrRequest(...mockParams);
-  const mockClass = () => mock;
-
-  // @ts-ignore
-  window.XMLHttpRequest = jest.fn().mockImplementation(mockClass);
-
-  return mock;
-};
-
-const expectReadyStateInfo = async (
-  files: FileType[],
-  mock: ReturnType<typeof mockXhrRequest>,
-  response: { code: number; body: { message: string } }
-) => {
-  const { result } = renderHook(() =>
-    useUploadFile(files, { ...requestInfo, responseErrorPath: "body.message" })
-  );
-
-  expect(mock.addEventListener).toHaveBeenCalled();
-  const [[, readystatechange]] = mock.addEventListener.mock.calls;
-  await waitFor(() => readystatechange());
-  const currentFile = result.current.updatedFiles[0];
-  expect(currentFile.status).toEqual("error");
-  expect(currentFile.error).toEqual(response.body.message);
-};
-
-describe("it should perform upload", () => {
-  it("should register the correct progress", async () => {
-    const mock = setupXhrEnvironment([200]);
-    const { result } = renderHook(() => useUploadFile([file], requestInfo));
-    expect(result.current).toBeDefined();
-    expect(mock.upload.addEventListener).toHaveBeenCalled();
-    const [[, progress]] = mock.upload.addEventListener.mock.calls;
-    await waitFor(() => progress(progressData));
-
-    const targetFile = result.current.updatedFiles[0];
-    expect(targetFile.name).toEqual(file.name);
-    expect(targetFile.progress).toEqual(12);
-  });
-
-  it("should contain a file with status of retry", async () => {
-    const mock = setupXhrEnvironment([0, DONE]);
-    const files2 = [
-      {
-        name: "test2.txt",
-        data: new File([""], "test2.txt"),
-        size: 5,
-        type: ""
-      }
-    ];
-    const { result } = renderHook(() => useUploadFile(files2, requestInfo));
-    expect(result.current).toBeDefined();
-    expect(mock.addEventListener).toHaveBeenCalled();
-    const [[, readystatechange]] = mock.addEventListener.mock.calls;
-    await waitFor(() => readystatechange());
-    expect(result.current.updatedFiles[0].status).toEqual("retry");
-  });
-
-  it("should contain a file with status of error", async () => {
-    const response = { code: 404, body: { message: "Error test" } };
-    const mock = setupXhrEnvironment([404, DONE, JSON.stringify(response)]);
-    const files3 = [
-      {
-        name: "test3.txt",
-        data: new File([""], "test3.txt"),
-        size: 5,
-        type: ""
-      }
-    ];
-    await expectReadyStateInfo(files3, mock, response);
-  });
-
-  it("should contain a file with status of server error", async () => {
-    const response = { code: 500, body: { message: "Error test" } };
-    const mock = setupXhrEnvironment([500, DONE, JSON.stringify(response)]);
-    const files6 = [
-      {
-        name: "test6.txt",
-        data: new File([""], "test3.txt"),
-        size: 5,
-        type: ""
-      }
-    ];
-    await expectReadyStateInfo(files6, mock, response);
-  });
-
-  it("should contain a file with status of success", async () => {
-    const mock = setupXhrEnvironment([200, DONE]);
-    const files3 = [
-      {
-        name: "test3.txt",
-        data: new File([""], "test3.txt"),
-        size: 5,
-        type: ""
-      }
-    ];
-    const { result } = renderHook(() => useUploadFile(files3, requestInfo));
-    expect(result.current).toBeDefined();
-    expect(mock.addEventListener).toHaveBeenCalled();
-    const [[, readystatechange]] = mock.addEventListener.mock.calls;
-    await waitFor(() => readystatechange());
-    const currentFile = result.current.updatedFiles[0];
-    expect(currentFile.status).toEqual("completed");
-  });
-});
-
-describe("should return data according to the parameters", () => {
-  it("should call custom callbacks", async () => {
-    const onComplete = jest.fn();
-    const onProgress = jest.fn();
-    const mock = setupXhrEnvironment([200, DONE]);
-    const files4 = [
-      {
-        name: "test4.txt",
-        data: new File([""], "test3.txt"),
-        size: 5,
-        type: ""
-      }
-    ];
-    renderHook(() => useUploadFile(files4, requestInfo, { onProgress, onComplete }));
-
-    const [[, progress]] = mock.upload.addEventListener.mock.calls;
-    await waitFor(() => progress(progressData));
-
-    const [[, readystatechange]] = mock.addEventListener.mock.calls;
-    await waitFor(() => readystatechange());
-
-    expect(mock.addEventListener).toHaveBeenCalled();
-    expect(onComplete).toHaveBeenCalled();
-    expect(onComplete).toHaveBeenCalled();
-  });
-
-  it("should add the correct error message", async () => {
-    const mock = setupXhrEnvironment([0, DONE]);
-    const files5 = [
-      {
-        name: "test5.txt",
-        data: new File([""], "test5.txt"),
-        size: 5,
-        type: ""
-      }
-    ];
-    const error = "Network error";
-    const { result } = renderHook(() =>
-      useUploadFile(files5, { ...requestInfo, networkErrorText: error })
-    );
-    const [[, readystatechange]] = mock.addEventListener.mock.calls;
-    await waitFor(() => readystatechange());
-
-    expect(mock.addEventListener).toHaveBeenCalled();
-    const file = result.current.updatedFiles[0];
-    expect(file.error).toEqual(error);
-  });
-});
-
-describe("useFileUpload hook should not fire when url and array of files is not present", () => {
-  it("should return an empty array if url is empty", () => {
-    const { result } = renderHook(() => useUploadFile([], { url: "https://yoohoo.co" }));
-
-    expect(result.current.uploadingFiles.length).toBe(0);
-  });
-
-  it("should return an empty array if url is empty", () => {
-    const { result } = renderHook(() => useUploadFile([file], { url: "" }));
-
-    expect(result.current.uploadingFiles.length).toBe(0);
-  });
-});