Switch shared-components from jest & test-runner to vitest (#31800)

* Remove babel

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove duplicated patch-package dep

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Switch to @fetch-mock/vitest

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update tests to import & call vitest functions

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update test-utils imports

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update unit test snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Switch from jest->vitest for unit tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update visual test screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Switch from test-runner->vitest for visual tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update README

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update CI for shared-components unit & visual tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update yarn.lock

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update README

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix storybook trying to import vitest

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix css modules leaking between storybook tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak screenshot update script to accept args

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski
2026-01-22 14:17:36 +00:00
committed by GitHub
parent 4bddf37866
commit 35fca4d339
157 changed files with 935 additions and 3875 deletions
@@ -6,8 +6,9 @@
*/
import { composeStories } from "@storybook/react-vite";
import { render } from "jest-matrix-react";
import { render } from "@test-utils";
import React from "react";
import { describe, it, expect } from "vitest";
import * as stories from "./Pill.stories";
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`Pill renders the pill 1`] = `
exports[`Pill > renders the pill 1`] = `
<div>
<div
class="flex pill"
@@ -45,7 +45,7 @@ exports[`Pill renders the pill 1`] = `
</div>
`;
exports[`Pill renders the pill without close button 1`] = `
exports[`Pill > renders the pill without close button 1`] = `
<div>
<div
class="flex pill"
@@ -5,10 +5,11 @@
* Please see LICENSE files in the repository root for full details.
*/
import { render, screen } from "jest-matrix-react";
import { render, screen } from "@test-utils";
import React from "react";
import { composeStories } from "@storybook/react-vite";
import userEvent from "@testing-library/user-event";
import { describe, it, vi, expect } from "vitest";
import * as stories from "./PillInput.stories";
import { PillInput } from "./PillInput";
@@ -28,7 +29,7 @@ describe("PillInput", () => {
it("calls onRemoveChildren when backspace is pressed and input is empty", async () => {
const user = userEvent.setup();
const mockOnRemoveChildren = jest.fn();
const mockOnRemoveChildren = vi.fn();
render(<PillInput onRemoveChildren={mockOnRemoveChildren} />);
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`PillInput renders only the input without children 1`] = `
exports[`PillInput > renders only the input without children 1`] = `
<div>
<div
class="flex pillInput"
@@ -16,7 +16,7 @@ exports[`PillInput renders only the input without children 1`] = `
</div>
`;
exports[`PillInput renders the pill input 1`] = `
exports[`PillInput > renders the pill input 1`] = `
<div>
<div
class="flex pillInput"