fix: respect custom routes.api in alt-text, pages, and vercel-deployments#99
Open
fix: respect custom routes.api in alt-text, pages, and vercel-deployments#99
Conversation
The GenerateAltTextButton and BulkGenerateAltTextsButton hardcoded `/api/alt-text-plugin/...` for their fetch calls, so they broke for users who configured a non-default `routes.api`. Both now read the api route and serverURL from `useConfig()`. Also refactors AltTextHealthWidget to use Payload's `formatAdminURL` helper (matching how admin-search builds admin links), and adds a vitest + jsdom + @testing-library/react setup so the client components can be covered by failing-first tests.
DeploymentStatusPoller and TriggerFrontendDeploymentButton hardcoded `/api/vercel-deployments` for their polling and redeploy fetches, so they broke for users who configured a non-default `routes.api`. Both now read the api route and serverURL from `useConfig()`. Adds failing-first tests covering both components with a custom route, and fixes a preexisting build:swc ignore pattern that only excluded `.test.ts` (not `.test.tsx`) files from the published dist.
`fetchRestApi` (used by `getBreadcrumbs` when called from the PathField client component without a PayloadRequest) hardcoded `/api`, so it broke for users who configured a non-default `routes.api`. It now takes a `FetchRestApiConfig` argument that callers must supply. `getBreadcrumbs` exposes this via a new optional `restApiConfig` param and PathField forwards `config.routes.api` / `config.serverURL` from `useConfig()`.
Replace the FetchRestApiConfig indirection with a plain `apiURL` string
that the client caller (PathField) builds directly from useConfig().
The `fetchRestApi` helper is deleted and its logic is inlined in
getBreadcrumbs, since it was trivial once the URL is supplied by the
caller.
PathField now passes `apiURL: ${serverURL}${routes.api}` sourced from
useConfig() — no new config type is introduced, and getBreadcrumbs
stays a plain async function without needing to know anything about
Payload's config shape.
Trivial formatting-only fixes in two files touched by the routes.api PR: - alt-text/src/components/BulkGenerateAltTextsButton.test.tsx - pages/src/utils/getBreadcrumbs.ts Caught by the `format` CI check on PR #99.
jhb-dev
changed the title
The existing alt-text test step globbed `test/*.test.ts`, so it only picked up the legacy node:test health tests and skipped the new vitest component tests under `src/components/*.test.tsx`. Switch to `pnpm test`, which chains `test:health` (node:test) and `test:components` (vitest). The pages plugin had no unit-test job in CI at all — only the dev-app integration tests. Add a step that runs `pnpm test:unit` (vitest) so the client-side URL construction in `getBreadcrumbs` is exercised. Without this, a regression reintroducing a hardcoded `/api` in any of the client components touched by this PR would still pass CI.
…or test files
The new vitest test files use `vi.mock('@payloadcms/ui', ...)` to
stub hooks like `useConfig`, `useLocale`, `useRouter`, etc. The mock
arrow functions intentionally share names with the real hooks so the
mock matches the real export shape, which triggers
`@eslint-react/hooks-extra/no-useless-custom-hooks`.
The rule's intent doesn't apply to test mocks — they are supposed to
be plain functions that return canned values, not real hooks.
Disable it for `src/**/*.test.ts` / `*.test.tsx` in both plugins.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fixes three plugins where client components hardcoded
/api/...for theirfetchcalls, so they broke when the user configured a non-defaultroutes.api. All touched components now readroutes.apiandserverURLfrom Payload'suseConfig()(or from a caller that has it) and build the full URL at runtime.Per-plugin changes
alt-textGenerateAltTextButtonandBulkGenerateAltTextsButtonnow readconfig.routes.api/config.serverURLfromuseConfig()instead of hardcoding/api/alt-text-plugin/....AltTextHealthWidgetnow uses Payload'sformatAdminURLhelper frompayload/sharedwhen linking into the admin (replaces a manual${config.routes.admin}/collections/...concat, matching howadmin-searchalready builds admin URLs).@testing-library/reactinfra so client components can be covered by failing-first tests:AltTextHealthWidget.test.tsx— verifies links use both default/adminand a custom admin route.GenerateAltTextButton.test.tsxandBulkGenerateAltTextsButton.test.tsx— verifyfetchis called with the customroutes.api+serverURL.tsconfig.build.jsonand updated thebuild:swc--ignorepattern so.test.ts/.test.tsxfiles don't leak into the published dist.vercel-deploymentsDeploymentStatusPollerandTriggerFrontendDeploymentButtonnow readroutes.api/serverURLfromuseConfig()instead of hardcoding/api/vercel-deployments.DeploymentStatusPoller.test.tsxand added a newTriggerDeploymentButton.test.tsxto verify both default and custom API routes.build:swc --ignorepattern that only excluded.test.ts(not.test.tsx), so test files were being published to npm.pagesgetBreadcrumbsnow accepts an optionalapiURL: stringparam (required when called without areq, i.e. from client-side field components). ThePathFieldforwards${config.serverURL ?? ''}${config.routes.api}sourced fromuseConfig().fetchRestApi.tshelper — its logic is inlined intogetBreadcrumbsnow that the caller supplies the URL.test/getBreadcrumbs.test.tscovering the client-side URL construction (default/api, customroutes.api, and a clear error when called without eitherreqorapiURL).CI coverage
Updated
.github/workflows/ci.yml'stest-unitjob so the new tests actually run on CI:node --experimental-strip-types --test test/*.test.ts(which only picked up the legacy node:test files) topnpm test, which chains the node:test health tests with the new vitest component tests.pnpm test:unit(vitest). The pages plugin previously had no unit-test job in CI — only the dev-app integration tests.Without these, a regression reintroducing hardcoded
/apiin any of the affected client components would still pass CI.Test plan
cd alt-text && pnpm test— both node:test and vitest suites pass.cd vercel-deployments && pnpm test— vitest passes.cd pages && pnpm test:unit— new vitest suite passes.pnpm lintin each affected plugin — 0 errors.pnpm formatin each affected plugin — no diff.pnpm buildin each affected plugin —.test.tsxfiles excluded from dist.https://claude.ai/code/session_01YEgtR29SVbLQtSwbK7QWZh