Update tests from Jest to Vitest #6112

joshblack · 2025-05-22T18:39:39Z

Continue our refactor of tests from Jest to Vitest.

Changelog

New

Changed

Update the following tests from Jest to Vitest:
- Radio
- RadioGroup
- RelativeTime
- ProgressBar
- ScrollableRegion
- Textarea

Removed

changeset-bot · 2025-05-22T18:39:42Z

⚠️ No Changeset found

Latest commit: a0cc40e

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

github-actions · 2025-05-22T18:40:15Z

👋 Hi, this pull request contains changes to the source code that github/github depends on. If you are GitHub staff, we recommend testing these changes with github/github using the integration workflow. Thanks!

github-actions · 2025-05-22T18:42:53Z

size-limit report 📦

Path	Size
packages/react/dist/browser.esm.js	94.34 KB (0%)
packages/react/dist/browser.umd.js	94.5 KB (0%)

Copilot

Pull Request Overview

This PR continues the migration of component tests from Jest to Vitest by updating configuration files and rewriting several test suites using Vitest’s APIs and React Testing Library.

Added Vitest test globs for newly migrated components in vitest.config.mts
Rewrote tests for Textarea, ScrollableRegion, RelativeTime, RadioGroup, Radio, ProgressBar to use Vitest and RTL
Updated snapshots and test setup for React 18’s act environment

Reviewed Changes

Copilot reviewed 10 out of 10 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
packages/react/vitest.config.mts	Added test globs for Radio, RadioGroup, RelativeTime, ProgressBar, ScrollableRegion, Textarea
packages/react/src/Textarea/Textarea.test.tsx	Replaced Jest utils with Vitest imports and RTL patterns
packages/react/src/ScrollableRegion/ScrollableRegion.test.tsx	Switched global to window ResizeObserver and updated style assertions
packages/react/src/RelativeTime/RelativeTime.test.tsx	Removed Jest helpers, now uses Vitest and RTL
packages/react/src/RadioGroup/RadioGroup.test.tsx	Replaced Jest mocks with `vi` and removed legacy helpers
packages/react/src/Radio/Radio.test.tsx	Switched from Jest to Vitest for mocks and assertions
packages/react/src/ProgressBar/snapshots/ProgressBar.test.tsx.snap	Updated snapshot header and output for Vitest
packages/react/src/ProgressBar/ProgressBar.test.tsx	Replaced Jest helpers with Vitest and RTL rendering
packages/react/jest.config.js	Added paths for newly migrated test directories
packages/react/config/vitest/setup.ts	Enabled `IS_REACT_ACT_ENVIRONMENT` for React 18 tests

Comments suppressed due to low confidence (1)

packages/react/src/RelativeTime/RelativeTime.test.tsx:3

Accessibility tests using axe were removed during this migration. Consider re-adding an axe-based test (e.g. expect(await axe.run(container)).toHaveNoViolations()) to maintain accessibility coverage for .

import {render} from '@testing-library/react'

packages/react/src/Textarea/Textarea.test.tsx

Copilot · 2025-05-22T19:17:27Z

packages/react/src/RadioGroup/RadioGroup.test.tsx

-  checkExports('RadioGroup', {
-    default: RadioGroup,
-    RadioGroupContext,
+    vi.clearAllMocks()


The afterAll block clears mock calls but does not restore the original console.warn implementation. Consider using vi.restoreAllMocks() or calling mockRestore() on the spy to prevent stubbing console.warn in other tests.

Suggested change

vi.clearAllMocks()

vi.restoreAllMocks()

Copilot · 2025-05-22T19:17:28Z

packages/react/src/ProgressBar/__snapshots__/ProgressBar.test.tsx.snap

+{
+  "asFragment": [Function],
+  "baseElement": <body>
+
+

-exports[`ProgressBar respects the "progress" prop 1`] = `
-.c0 {
-  background-color: var(--bgColor-success-emphasis,var(--color-success-emphasis,#1f883d));
-}

-<span
-  className="ProgressBarContainer"
-  data-progress-bar-size="default"
-  data-progress-display="block"
->
-  <span
-    aria-label="Upload test.png"
-    aria-valuemax={100}
-    aria-valuemin={0}
-    aria-valuenow={80}
-    className="c0 ProgressBarItem"
-    role="progressbar"
-    style={
-      {
-        "--progress-bg": "var(--bgColor-success-emphasis)",
-        "--progress-width": "80%",
-      }
-    }
-  />
-</span>
+    <div>
+      <span
+        class="_ProgressBarContainer_1bos7_27"
+        data-progress-bar-size="default"
+        data-progress-display="block"
+      >
+        <span
+          aria-label="Upload test.png"
+          aria-valuemax="100"
+          aria-valuemin="0"
+          aria-valuenow="80"
+          class="sc-aXZVg lfjCwU _ProgressBarItem_1bos7_11"
+          role="progressbar"
+          style="--progress-width: 80%; --progress-bg: var(--bgColor-success-emphasis);"
+        />
+      </span>
+    </div>
+  </body>,
+  "container": <div>


[nitpick] The snapshot includes the full Testing Library API, making it very verbose. Consider switching to a DOM-only snapshot (e.g. via asFragment() or toJSON()) to keep snapshots concise and easier to review.

Copilot · 2025-05-22T19:17:28Z

packages/react/src/ScrollableRegion/ScrollableRegion.test.tsx

+    expect(screen.getByTestId('container')).toHaveStyle('overflow: auto')
+    expect(screen.getByTestId('container')).toHaveStyle('position: relative')


The toHaveStyle matcher only checks inline style attributes, but overflow and position come from CSS. Use getComputedStyle(container).overflow (and similarly for position) to assert these style rules reliably.

Suggested change

expect(screen.getByTestId('container')).toHaveStyle('overflow: auto')

expect(screen.getByTestId('container')).toHaveStyle('position: relative')

const containerStyles = getComputedStyle(screen.getByTestId('container'));

expect(containerStyles.overflow).toBe('auto');

expect(containerStyles.position).toBe('relative');

hectahertz

🙌🏻

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

This reverts commit d349619.

This reverts commit bf3b9cd.

This reverts commit bdf4e72.

joshblack added 7 commits May 22, 2025 12:47

refactor(test): update Textarea tests from Jest to Vitest

03c713c

refactor(test): update ScrollableRegion tests from Jest to Vitest

4b7d768

refactor(test): update RelativeTime test files from Jest to Vitest

63f9d68

refactor(test): update RadioGroup tests from Jest to Vitest

c4bc8f4

refactor(test): update Radio tests from Jest to Vitest

4d98135

chore: update test setup for React act()

9a4fc31

refactor(test): update ProgressBar tests from Jest to Vitest

f621f48

github-actions bot added staff Author is a staff member integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm labels May 22, 2025

joshblack deployed to github-pages May 22, 2025 18:52 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6112 May 22, 2025 18:53 Inactive

chore: update textarea tests

86badc1

joshblack added the skip changeset This change does not need a changelog label May 22, 2025

joshblack marked this pull request as ready for review May 22, 2025 19:14

Copilot AI review requested due to automatic review settings May 22, 2025 19:14

joshblack requested a review from a team as a code owner May 22, 2025 19:14

joshblack requested a review from hectahertz May 22, 2025 19:14

Merge branch 'main' into refactor/update-tests-to-vitest-may-22-2025

3b68619

Copilot AI reviewed May 22, 2025

View reviewed changes

github-actions bot requested a deployment to storybook-preview-6112 May 22, 2025 19:18 Abandoned

joshblack deployed to github-pages May 22, 2025 19:32 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6112 May 22, 2025 19:32 Inactive

jonrohan approved these changes May 23, 2025

View reviewed changes

chore: fix eslint error

8c3f9d2

joshblack enabled auto-merge May 23, 2025 16:29

joshblack deployed to github-pages May 23, 2025 16:42 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6112 May 23, 2025 16:42 Inactive

hectahertz approved these changes May 27, 2025

View reviewed changes

Update packages/react/src/Textarea/Textarea.test.tsx

bdf4e72

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

joshblack deployed to github-pages May 27, 2025 14:56 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6112 May 27, 2025 14:57 Inactive

refactor: update name of module.css

bf3b9cd

joshblack had a problem deploying to github-pages May 27, 2025 15:05 — with GitHub Actions Failure

github-actions bot requested a deployment to storybook-preview-6112 May 27, 2025 15:06 Abandoned

chore: update casing for textarea.module.css

d349619

joshblack deployed to github-pages May 27, 2025 15:38 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6112 May 27, 2025 15:38 Inactive

Merge branch 'main' into refactor/update-tests-to-vitest-may-22-2025

6f99c60

joshblack deployed to github-pages May 27, 2025 15:56 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6112 May 27, 2025 15:57 Inactive

joshblack added 3 commits May 27, 2025 15:21

Revert " chore: update casing for textarea.module.css"

d13e9e8

This reverts commit d349619.

Revert "refactor: update name of module.css"

91d4920

This reverts commit bf3b9cd.

Revert "Update packages/react/src/Textarea/Textarea.test.tsx"

89c0ae5

This reverts commit bdf4e72.

joshblack deployed to github-pages May 27, 2025 20:35 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6112 May 27, 2025 20:35 Inactive

Merge branch 'main' into refactor/update-tests-to-vitest-may-22-2025

a0cc40e

joshblack added this pull request to the merge queue May 28, 2025

primer bot deployed to github-pages May 28, 2025 16:49 View deployment

github-actions bot deployed to storybook-preview-6112 May 28, 2025 16:50 View deployment

auto-merge was automatically disabled May 28, 2025 16:53
Pull Request is not mergeable

Merged via the queue into main with commit 41b4bdb May 28, 2025
35 checks passed

joshblack deleted the refactor/update-tests-to-vitest-may-22-2025 branch May 28, 2025 16:59

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Update tests from Jest to Vitest #6112

Update tests from Jest to Vitest #6112

joshblack commented May 22, 2025 •

edited

Loading

Uh oh!

changeset-bot bot commented May 22, 2025 •

edited

Loading

Uh oh!

github-actions bot commented May 22, 2025

Uh oh!

github-actions bot commented May 22, 2025 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Copilot AI May 22, 2025

Uh oh!

Copilot AI May 22, 2025

Uh oh!

Copilot AI May 22, 2025

Uh oh!

hectahertz left a comment

Uh oh!

Uh oh!

Uh oh!

		expect(screen.getByTestId('container')).toHaveStyle('overflow: auto')
		expect(screen.getByTestId('container')).toHaveStyle('position: relative')

-    expect(screen.getByTestId('container')).toHaveStyle('overflow: auto')
-    expect(screen.getByTestId('container')).toHaveStyle('position: relative')
+    const containerStyles = getComputedStyle(screen.getByTestId('container'));
+    expect(containerStyles.overflow).toBe('auto');
+    expect(containerStyles.position).toBe('relative');

Update tests from Jest to Vitest #6112

Update tests from Jest to Vitest #6112

Conversation

joshblack commented May 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Changelog

New

Changed

Removed

Uh oh!

changeset-bot bot commented May 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ No Changeset found

Uh oh!

github-actions bot commented May 22, 2025

Uh oh!

github-actions bot commented May 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

size-limit report 📦

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Uh oh!

Copilot AI May 22, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI May 22, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI May 22, 2025

Choose a reason for hiding this comment

Uh oh!

hectahertz left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

joshblack commented May 22, 2025 •

edited

Loading

changeset-bot bot commented May 22, 2025 •

edited

Loading

github-actions bot commented May 22, 2025 •

edited

Loading