mirror of
https://github.com/supabase/supabase.git
synced 2026-09-06 09:59:03 +08:00
5d3b84945e
"Switch to preview" in the delete flow read its refs from the selected project, so on the branching overview `parent_project_ref` was undefined and the handler bailed with a `console.error` — persistent branches couldn't be deleted. Both refs now come from the `branch` prop, and the not-ready state shows on the confirm button instead of the console. Covered by a new MSW test that fails against the old code. Fixes FE-4219 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Improved switching branches to Preview mode by using the selected branch’s project information. * Prevented confirmation when no branch is available. * Preserved success notifications and modal closing after a successful switch. * **Tests** * Added coverage for successful updates, API failures, error feedback, request details, and disabled confirmation states. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
104 lines
3.4 KiB
TypeScript
104 lines
3.4 KiB
TypeScript
import { screen, waitFor } from '@testing-library/react'
|
|
import userEvent from '@testing-library/user-event'
|
|
import { mockAnimationsApi } from 'jsdom-testing-mocks'
|
|
import { HttpResponse } from 'msw'
|
|
import { toast } from 'sonner'
|
|
import { describe, expect, test, vi } from 'vitest'
|
|
|
|
import { SwitchToPreviewModal } from './SwitchToPreviewModal'
|
|
import type { components } from '@/data/api'
|
|
import type { Branch } from '@/data/branches/branches-query'
|
|
import { customRender } from '@/tests/lib/custom-render'
|
|
import { addAPIMock, type APIErrorBody } from '@/tests/lib/msw'
|
|
|
|
mockAnimationsApi()
|
|
|
|
vi.mock('sonner', () => ({
|
|
toast: { success: vi.fn(), error: vi.fn() },
|
|
}))
|
|
|
|
type BranchUpdateResponse = components['schemas']['BranchUpdateResponse']
|
|
|
|
const PARENT_PROJECT_REF = 'parent-project-ref'
|
|
const BRANCH_PROJECT_REF = 'branch-project-ref'
|
|
|
|
const BRANCH: Branch = {
|
|
created_at: '2026-01-01T00:00:00.000Z',
|
|
id: '00000000-0000-0000-0000-000000000001',
|
|
is_default: false,
|
|
name: 'docs-local-staging',
|
|
parent_project_ref: PARENT_PROJECT_REF,
|
|
persistent: true,
|
|
project_ref: BRANCH_PROJECT_REF,
|
|
status: 'MIGRATIONS_PASSED',
|
|
updated_at: '2026-01-01T00:00:00.000Z',
|
|
with_data: false,
|
|
}
|
|
|
|
const mockBranchUpdate = () => {
|
|
const requests: Array<{ branchRef: string | undefined; body: unknown }> = []
|
|
|
|
addAPIMock({
|
|
method: 'patch',
|
|
path: '/v1/branches/:branch_id_or_ref',
|
|
response: async ({ request, params }) => {
|
|
requests.push({
|
|
branchRef: params.branch_id_or_ref as string | undefined,
|
|
body: await request.json(),
|
|
})
|
|
return HttpResponse.json<BranchUpdateResponse>({
|
|
message: 'ok',
|
|
workflow_run_id: 'workflow-run-1',
|
|
})
|
|
},
|
|
})
|
|
|
|
return requests
|
|
}
|
|
|
|
const renderModal = (overrides: { branch?: Branch; onClose?: () => void } = {}) => {
|
|
const onClose = overrides.onClose ?? vi.fn()
|
|
customRender(<SwitchToPreviewModal open branch={overrides.branch} onClose={onClose} />)
|
|
return { onClose }
|
|
}
|
|
|
|
describe('SwitchToPreviewModal', () => {
|
|
test('switches the branch to preview using the refs on the branch', async () => {
|
|
const requests = mockBranchUpdate()
|
|
|
|
const { onClose } = renderModal({ branch: BRANCH })
|
|
|
|
await userEvent.click(await screen.findByRole('button', { name: 'Switch to preview' }))
|
|
|
|
await waitFor(() => expect(onClose).toHaveBeenCalledOnce())
|
|
expect(requests).toEqual([{ branchRef: BRANCH_PROJECT_REF, body: { persistent: false } }])
|
|
expect(toast.success).toHaveBeenCalledWith('Successfully updated branch')
|
|
})
|
|
|
|
test('surfaces the error and keeps the modal open when the update fails', async () => {
|
|
addAPIMock({
|
|
method: 'patch',
|
|
path: '/v1/branches/:branch_id_or_ref',
|
|
response: () =>
|
|
HttpResponse.json<APIErrorBody>({ message: 'Something exploded' }, { status: 500 }),
|
|
})
|
|
|
|
const { onClose } = renderModal({ branch: BRANCH })
|
|
|
|
const confirm = await screen.findByRole('button', { name: 'Switch to preview' })
|
|
await userEvent.click(confirm)
|
|
|
|
await waitFor(() =>
|
|
expect(toast.error).toHaveBeenCalledWith('Failed to update branch: Something exploded')
|
|
)
|
|
expect(onClose).not.toHaveBeenCalled()
|
|
expect(confirm).toBeEnabled()
|
|
})
|
|
|
|
test('disables the confirm button while the branch is unavailable', async () => {
|
|
renderModal()
|
|
|
|
expect(await screen.findByRole('button', { name: 'Switch to preview' })).toBeDisabled()
|
|
})
|
|
})
|