npm - @kaizen/components - Versions diffs - 1.61.1 → 1.61.2 - Mend

@kaizen/components 1.61.1 → 1.61.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (102) hide show

package/src/Heading/__snapshots__/Heading.spec.tsx.snap DELETED Viewed

@@ -1,85 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={display-0} /> 1`] = `
-<body>
-  <div>
-    <h1
-      class="heading display-0 dark large"
-    >
-      Example
-    </h1>
-  </div>
-</body>
-`;
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-1} /> 1`] = `
-<body>
-  <div>
-    <h1
-      class="heading heading-1 dark large"
-    >
-      Example
-    </h1>
-  </div>
-</body>
-`;
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-2} /> 1`] = `
-<body>
-  <div>
-    <h2
-      class="heading heading-2 dark large"
-    >
-      Example
-    </h2>
-  </div>
-</body>
-`;
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-3} /> 1`] = `
-<body>
-  <div>
-    <h3
-      class="heading heading-3 dark small"
-    >
-      Example
-    </h3>
-  </div>
-</body>
-`;
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-4} /> 1`] = `
-<body>
-  <div>
-    <h4
-      class="heading heading-4 dark small"
-    >
-      Example
-    </h4>
-  </div>
-</body>
-`;
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-5} /> 1`] = `
-<body>
-  <div>
-    <h5
-      class="heading heading-5 dark small"
-    >
-      Example
-    </h5>
-  </div>
-</body>
-`;
-exports[`<Heading /> defaults to the correct HTML element renders the correct element for <Heading variant={heading-6} /> 1`] = `
-<body>
-  <div>
-    <h6
-      class="heading heading-6 dark small"
-    >
-      Example
-    </h6>
-  </div>
-</body>
-`;

package/src/Illustration/utils/usePausePlay.spec.tsx DELETED Viewed

@@ -1,85 +0,0 @@
-import React, { RefObject, act } from "react"
-import { render, renderHook } from "@testing-library/react"
-import { LaunchIcon, PauseIcon } from "~components/Icon"
-import { usePausePlay, usePausePlayHook } from "./usePausePlay"
-describe("usePausePlay()", () => {
-  beforeEach(() => {
-    jest.clearAllMocks()
-  })
-  let hookResult: usePausePlayHook
-  const mockPause = jest.fn()
-  const mockPlay = jest.fn()
-  describe("when toggling a currently playing video", () => {
-    beforeEach(() => {
-      const fakeRef = {
-        current: {
-          pause: mockPause,
-          play: mockPlay,
-          paused: false, // It's playing
-        },
-      } as unknown as RefObject<HTMLVideoElement>
-      const { result } = renderHook(() => usePausePlay(fakeRef))
-      act(() => {
-        result.current.toggle()
-      })
-      hookResult = result.current
-    })
-    it("pauses the video", () => {
-      expect(mockPause).toHaveBeenCalled()
-    })
-    it("returns the play icon", () => {
-      const { baseElement: original } = render(hookResult.icon)
-      const { baseElement: comparison } = render(
-        <LaunchIcon role="presentation" />
-      )
-      expect(original).toEqual(comparison)
-    })
-    it("returns the 'Play animation' label", () => {
-      expect(hookResult.label).toEqual("Play animation")
-    })
-  })
-  describe("when toggling a currently paused video", () => {
-    beforeEach(() => {
-      const fakeRef = {
-        current: {
-          pause: mockPause,
-          play: mockPlay,
-          paused: true, // It's not playing
-        },
-      } as unknown as RefObject<HTMLVideoElement>
-      const { result } = renderHook(() => usePausePlay(fakeRef))
-      act(() => {
-        result.current.toggle()
-      })
-      hookResult = result.current
-    })
-    it("starts the video again", () => {
-      expect(mockPlay).toHaveBeenCalled()
-    })
-    it("returns the pause icon", () => {
-      const { baseElement: original } = render(hookResult.icon)
-      const { baseElement: comparison } = render(
-        <PauseIcon role="presentation" />
-      )
-      expect(original).toEqual(comparison)
-    })
-    it("returns the 'Pause animation' label", () => {
-      expect(hookResult.label).toEqual("Pause animation")
-    })
-  })
-})

package/src/Notification/subcomponents/GenericNotification/GenericNotification.spec.tsx DELETED Viewed

@@ -1,76 +0,0 @@
-import React, { act } from "react"
-import { fireEvent, waitFor } from "@testing-library/dom"
-import { render } from "@testing-library/react"
-import ReactTestUtils from "react-dom/test-utils"
-import { GenericNotification } from "./GenericNotification"
-describe("<GenericNotification />", () => {
-  afterEach(() => {
-    jest.runAllTimers()
-  })
-  beforeEach(() => {
-    jest.useFakeTimers()
-  })
-  it('begins "hidden" but transitions out of it immediately', async () => {
-    const { container } = render(
-      <GenericNotification type="positive" style="inline" title="Success">
-        This is my positive notification
-      </GenericNotification>
-    )
-    await waitFor(() => {
-      expect(container.querySelector(".hidden")).toBeInTheDocument()
-    })
-    await act(async () => {
-      jest.advanceTimersByTime(50)
-    })
-    await waitFor(() => {
-      expect(container.querySelector(".hidden")).not.toBeInTheDocument()
-    })
-  })
-  it("hides the notification and triggers the onHide callback when the cancel button is clicked", async () => {
-    const onHide = jest.fn()
-    const { container, getByTestId } = render(
-      <GenericNotification
-        type="positive"
-        style="inline"
-        title="Success"
-        onHide={onHide}
-      >
-        Notification Text
-      </GenericNotification>
-    )
-    // The element should start in a "hidden" state
-    expect(container.querySelector(".hidden")).toBeTruthy()
-    // After clicking, the element should fade out, but the onHide not trigger yet.
-    const cancelButton = getByTestId("close-button")
-    const notification = container.querySelector(".notification")
-    fireEvent(cancelButton, new MouseEvent("click"))
-    await waitFor(() => {
-      expect(notification).toBeTruthy()
-    })
-    // Cannot use @testing-library/react `fireEvent` as it relies on jsdom events
-    // TransitionEvent has not been implemented yet, using `ReactTestUtils.Simulate` is a workaround
-    act(() => {
-      notification &&
-        ReactTestUtils.Simulate.transitionEnd(notification, {
-          propertyName: "margin-top",
-        } as any)
-    })
-    await waitFor(() => {
-      expect(notification).not.toBeInTheDocument()
-    })
-    await waitFor(() => expect(onHide).toHaveBeenCalledTimes(1))
-  })
-})

package/src/Text/__snapshots__/Text.spec.tsx.snap DELETED Viewed

@@ -1,49 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`<Text /> defaults to the correct HTML element renders the correct element for <Text variant={body} /> 1`] = `
-<body>
-  <div>
-    <p
-      class="text body dark"
-    >
-      Example
-    </p>
-  </div>
-</body>
-`;
-exports[`<Text /> defaults to the correct HTML element renders the correct element for <Text variant={extra-small} /> 1`] = `
-<body>
-  <div>
-    <p
-      class="text extra-small dark"
-    >
-      Example
-    </p>
-  </div>
-</body>
-`;
-exports[`<Text /> defaults to the correct HTML element renders the correct element for <Text variant={intro-lede} /> 1`] = `
-<body>
-  <div>
-    <p
-      class="text intro-lede dark"
-    >
-      Example
-    </p>
-  </div>
-</body>
-`;
-exports[`<Text /> defaults to the correct HTML element renders the correct element for <Text variant={small} /> 1`] = `
-<body>
-  <div>
-    <p
-      class="text small dark"
-    >
-      Example
-    </p>
-  </div>
-</body>
-`;

package/src/__overlays__/Tooltip/v1/subcomponents/AppearanceAnim.spec.tsx DELETED Viewed

@@ -1,39 +0,0 @@
-import React from "react"
-import { render } from "@testing-library/react"
-import useDebounce from "use-debounce"
-import { AnimationProvider } from "./AppearanceAnim"
-jest.mock("use-debounce")
-const useDebouncedCallback = useDebounce.useDebouncedCallback as jest.Mock
-let mockReturnValue: Record<string, any>
-describe("<AnimationProvider />", () => {
-  beforeEach(() => {
-    mockReturnValue = jest.fn()
-    mockReturnValue.cancel = (): void => undefined
-    useDebouncedCallback.mockImplementation(() => mockReturnValue)
-  })
-  describe("When no animationDuration prop is given", () => {
-    it("calls useDebouncedCallback with a 400 ms delay", () => {
-      render(<AnimationProvider isVisible />)
-      expect(useDebouncedCallback).toHaveBeenCalledWith(
-        expect.anything(),
-        400,
-        expect.anything()
-      )
-    })
-  })
-  describe("When an animationDuration prop is given", () => {
-    it("calls useDebouncedCallback with the animationDuration value", () => {
-      const expected = 1000
-      render(<AnimationProvider isVisible animationDuration={expected} />)
-      expect(useDebouncedCallback).toHaveBeenCalledWith(
-        expect.anything(),
-        expected,
-        expect.anything()
-      )
-    })
-  })
-})