Files
1966209483 chore(deps): upgrade vitest to v5 (#49994)
Upgrades Vitest from 4.1.4 to 5.0.0 across the monorepo, fixes the
handful of things v5 turned into hard errors, and drops the
`vi.clearAllMocks()` boilerplate that v5's `clearMocks` default makes
redundant.

**Changed:**
- `vitest`, `@vitest/ui`, `@vitest/coverage-v8` 4.1.4 → 5.0.0 (catalog)
- `vi.mock` calls that lived inside `beforeAll`/`beforeEach`/test bodies
moved to module scope (v5 throws on nested calls). Affects the Studio
and docs setup files and four Studio tests.
- `detectBrowser` test restores `navigator` via `vi.unstubAllGlobals()`
instead of assigning `global.navigator`, which now reaches jsdom's
getter-only property.
- `RowEditor.utils.test.ts` restores its `JSON.stringify` spy. It used
to leak a throwing mock for the rest of the file, which v5's coverage
provider now trips over. A later test in the same file had been
asserting the leak's side effect (valid JSON reported as invalid) and
now asserts the correct behavior.
- `@testing-library/jest-dom` 6.6 → 7.0.1. Its vitest type augmentation
resolves through a peer now, so it lands on each package's own `vitest`
instead of whichever copy pnpm hoisted. Fixes `toBeInTheDocument` type
errors in dev-tools after the reshuffle.
- `@testing-library/react` 16.0.0 → 16.3.3 for the React 19 peer range.
- `vite: catalog:` added to dev-tools, www, and common. Without it they
resolved a newer vite than the catalog pin, which forked a second vitest
instance in the lockfile. There's now one.
- ai-commands custom matcher types use v5's `Matchers<R, T>` form.
- 110 test files: `vi.clearAllMocks()` removed from
`beforeEach`/`afterEach` hooks, along with hooks that only did that and
the imports they left unused. Calls that also reset/restore mocks are
untouched. Second commit, mechanical.

**Added:**
- `.vitest/` to the root gitignore (v5 writes JSON/JUnit/HTML reporter
output there)

**Removed:**
- `vite-tsconfig-paths` catalog entry and deps. Vitest 5 resolves
tsconfig paths itself.

Release-age note: this sat in draft with a temporary
`minimumReleaseAgeExclude` entry for `vitest` and `@vitest/*` while
5.0.0 was inside the workspace's 3-day `minimumReleaseAge` window. That
window has closed, so the exclusion is gone and nothing bypasses the
release-age gate.

**Perf** (local, medians of 3 runs, same machine):

| Suite | v4.1.4 | v5.0.0 |
|---|---|---|
| studio | 144.1s | 141.7s (-2%) |
| studio `--coverage` | 156.9s | 146.4s (-7%) |
| ui-patterns | 6.27s | 5.07s (-19%) |
| ui `--coverage` | 3.35s | 2.14s (-36%) |
| www | 0.89s | 0.47s (-47%) |

Studio is dominated by jsdom environment setup per file, which v5
doesn't change. `vitest doctor` recommends keeping the current pool
config: the vm pools and `isolate: false` all break tests.

## To test

- `pnpm install --frozen-lockfile` succeeds with no
`minimumReleaseAgeExclude` entry for vitest.
- CI: Studio unit tests, ui, ui-patterns, www, docs, and typecheck/lint
should all be green. The lint ratchet was checked locally: warning
counts on touched Studio files are identical to master.
- `pnpm test:studio` locally passes with coverage (588 files, 6240
tests).
- Open a Studio test that uses `toBeInTheDocument` in your editor and
confirm no type errors on jest-dom matchers, in Studio and in
`packages/dev-tools`.
- Known pre-existing failures unrelated to this PR: one dev-tools test
(`getEventCountBadge` capped pill) fails on master too.


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

## Tests
- Improved test coverage for JSON validation and mobile navigation
behavior.
- Updated test setup, cleanup, environment configuration, and matcher
support across application and shared package suites.
- Removed obsolete coverage for alternate MCP transport selection.

## Chores
- Streamlined TypeScript path resolution and Vitest reporter output
handling.
- Updated testing libraries and Vitest tooling across documentation,
Studio, website, and shared packages.
- Added Vitest reporter output to ignored files.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-09-10 16:45:54 +08:00

263 lines
8.0 KiB
TypeScript

import { screen, waitFor } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import { beforeEach, describe, expect, test, vi } from 'vitest'
import { OrganizationInvite } from './OrganizationInvite'
import type { OrganizationInviteByToken } from '@/data/organization-members/organization-invitation-token-query'
import type { ProfileContextType } from '@/lib/profile'
import { render } from '@/tests/helpers'
import type { ResponseError } from '@/types'
const mocks = vi.hoisted(() => ({
isLoggedIn: vi.fn(),
useParams: vi.fn(),
useProfile: vi.fn(),
useProfileNameAndPicture: vi.fn(),
useIsFeatureEnabled: vi.fn(),
useInvitationQuery: vi.fn(),
useAcceptInvitationMutation: vi.fn(),
acceptInvitation: vi.fn(),
signOut: vi.fn(),
routerPush: vi.fn(),
routerReload: vi.fn(),
}))
vi.mock('common', async (importOriginal) => {
const actual = (await importOriginal()) as typeof import('common')
return {
...actual,
useIsLoggedIn: mocks.isLoggedIn,
useParams: mocks.useParams,
}
})
vi.mock('next/router', () => ({
useRouter: () => ({
isReady: true,
push: mocks.routerPush,
reload: mocks.routerReload,
}),
}))
vi.mock('@/lib/profile', () => ({
useProfile: mocks.useProfile,
useProfileNameAndPicture: mocks.useProfileNameAndPicture,
}))
vi.mock('@/lib/auth', () => ({
useSignOut: () => mocks.signOut,
}))
vi.mock('@/hooks/misc/useIsFeatureEnabled', () => ({
useIsFeatureEnabled: mocks.useIsFeatureEnabled,
}))
vi.mock('@/data/organization-members/organization-invitation-token-query', () => ({
useOrganizationInvitationTokenQuery: mocks.useInvitationQuery,
}))
vi.mock('@/data/organization-members/organization-invitation-accept-mutation', () => ({
useOrganizationAcceptInvitationMutation: mocks.useAcceptInvitationMutation,
}))
const READY_INVITE: OrganizationInviteByToken = {
authorized_user: true,
email_match: true,
expired_token: false,
invite_id: 42,
organization_name: 'Acme Corp',
sso_mismatch: false,
token_does_not_exist: false,
}
const PROFILE: ProfileContextType['profile'] = {
id: 1,
auth0_id: 'auth0|test',
gotrue_id: 'gotrue-test',
username: 'jane',
primary_email: 'jane@acmecorp.io',
first_name: null,
last_name: null,
mobile: null,
is_alpha_user: false,
is_sso_user: false,
disabled_features: [],
free_project_limit: null,
}
const responseError = (message: string, code = 500) => ({ message, code }) as ResponseError
function setSignedInDefaults() {
mocks.isLoggedIn.mockReturnValue(true)
mocks.useParams.mockReturnValue({ slug: 'acme-corp', token: 'invite-token' })
mocks.useProfile.mockReturnValue({
profile: PROFILE,
isLoading: false,
})
mocks.useProfileNameAndPicture.mockReturnValue({
username: 'jane',
primaryEmail: 'jane@acmecorp.io',
avatarUrl: undefined,
isLoading: false,
})
mocks.useIsFeatureEnabled.mockReturnValue(true)
mocks.useInvitationQuery.mockReturnValue({
data: READY_INVITE,
error: null,
isSuccess: true,
isError: false,
isPending: false,
})
mocks.useAcceptInvitationMutation.mockReturnValue({
mutate: mocks.acceptInvitation,
isPending: false,
})
}
describe('OrganizationInvite', () => {
beforeEach(() => {
setSignedInDefaults()
})
test('renders sign-in actions for signed-out users', () => {
mocks.isLoggedIn.mockReturnValue(false)
mocks.useProfile.mockReturnValue({ profile: null, isLoading: true })
mocks.useProfileNameAndPicture.mockReturnValue({
username: undefined,
primaryEmail: undefined,
avatarUrl: undefined,
isLoading: false,
})
render(<OrganizationInvite />)
expect(screen.getByText('View invitation')).toBeInTheDocument()
expect(
screen.getByText('Sign in or create an account to view this invitation')
).toBeInTheDocument()
expect(screen.getByRole('link', { name: 'Sign in' })).toHaveAttribute(
'href',
'/sign-in?returnTo=%2Fjoin%3Ftoken%3Dinvite-token%26slug%3Dacme-corp'
)
expect(screen.getByRole('link', { name: 'Sign up' })).toHaveAttribute(
'href',
'/sign-up?returnTo=%2Fjoin%3Ftoken%3Dinvite-token%26slug%3Dacme-corp'
)
})
test('renders a ready invite for the signed-in account', () => {
render(<OrganizationInvite />)
expect(screen.getByText('Join Acme Corp')).toBeInTheDocument()
expect(
screen.getByText('You have been invited to join this Supabase organization')
).toBeInTheDocument()
expect(screen.getByText('Signed in as')).toBeInTheDocument()
expect(screen.getByText('jane@acmecorp.io')).toBeInTheDocument()
expect(screen.getByRole('button', { name: 'Accept invite' })).toBeInTheDocument()
expect(screen.getByRole('link', { name: 'Decline' })).toHaveAttribute('href', '/organizations')
})
test('accepts an invite with the current slug and token', async () => {
const user = userEvent.setup()
render(<OrganizationInvite />)
await user.click(screen.getByRole('button', { name: 'Accept invite' }))
expect(mocks.acceptInvitation).toHaveBeenCalledWith({
slug: 'acme-corp',
token: 'invite-token',
})
})
test('renders an inline error when joining the organization fails', () => {
mocks.useAcceptInvitationMutation.mockReturnValue({
mutate: mocks.acceptInvitation,
isPending: false,
error: responseError('You are already a member of this organization'),
})
render(<OrganizationInvite />)
expect(screen.getByRole('alert')).toHaveTextContent(
'Failed to join organization: You are already a member of this organization'
)
})
test('renders a wrong-account warning and signs out', async () => {
const user = userEvent.setup()
mocks.useInvitationQuery.mockReturnValue({
data: { ...READY_INVITE, email_match: false },
error: null,
isSuccess: true,
isError: false,
isPending: false,
})
mocks.signOut.mockResolvedValue(undefined)
render(<OrganizationInvite />)
expect(screen.getByText('Wrong account')).toBeInTheDocument()
expect(screen.queryByText('Join Acme Corp')).not.toBeInTheDocument()
expect(
screen.queryByText('You have been invited to join this Supabase organization')
).not.toBeInTheDocument()
expect(screen.getByText(/jane@acmecorp\.io/)).toBeInTheDocument()
await user.click(screen.getByRole('button', { name: 'Sign out' }))
await waitFor(() => expect(mocks.signOut).toHaveBeenCalled())
expect(mocks.routerReload).toHaveBeenCalled()
})
test('renders no-longer-valid, invalid lookup, and generic error states', () => {
mocks.useInvitationQuery.mockReturnValueOnce({
data: undefined,
error: responseError('Failed to retrieve organization', 401),
isSuccess: false,
isError: true,
isPending: false,
})
const { rerender } = render(<OrganizationInvite />)
expect(screen.getByText('Invite no longer available')).toBeInTheDocument()
expect(
screen.getByText('This invite has already been accepted or declined.')
).toBeInTheDocument()
expect(screen.getByRole('link', { name: 'Back to dashboard' })).toHaveAttribute('href', '/')
mocks.useInvitationQuery.mockReturnValueOnce({
data: undefined,
error: responseError('Not Found', 404),
isSuccess: false,
isError: true,
isPending: false,
})
rerender(<OrganizationInvite />)
expect(screen.getByText('Invalid invitation')).toBeInTheDocument()
expect(
screen.getByText(
'Open the full invite link again, or ask the organization owner for a new invite.'
)
).toBeInTheDocument()
expect(screen.queryByText('Not Found')).not.toBeInTheDocument()
mocks.useInvitationQuery.mockReturnValueOnce({
data: undefined,
error: responseError('Failed to retrieve token', 500),
isSuccess: false,
isError: true,
isPending: false,
})
rerender(<OrganizationInvite />)
expect(screen.getByText('Unable to load invitation')).toBeInTheDocument()
expect(screen.getByText('Failed to retrieve token')).toBeInTheDocument()
})
})