fix(test): make story tests runnable and gate them in CI - #278
Open
maksimzinchuk wants to merge 1 commit into
Open
fix(test): make story tests runnable and gate them in CI#278maksimzinchuk wants to merge 1 commit into
maksimzinchuk wants to merge 1 commit into
Conversation
Storybook story tests never ran, so nothing executed story code: typecheck
excludes *.stories.ts, ESLint sees nothing wrong in an unimported identifier,
and storybook-build only compiles. Two independent causes:
- `Component`, `Ref` and `VNode` were imported from vue without `type` in 7
SFCs. In a plain .ts file esbuild drops a specifier that is unused in value
position, but in an SFC the Vue compiler emits the import verbatim, so the
type name survives into the runtime import of the prebundled vue and throws
"does not provide an export named 'Component'". Every story suite imports
.storybook/vitest.setup.ts, so all 77 suites failed to load with no tests.
- vitest 4 moved the browser providers into separate packages and takes a
provider factory instead of the "playwright" string.
With the suite running, axe reported 12 real accessibility failures, all fixed
here:
- WCAG 2.2 SC 2.5.8 target size, raised to 24px without resizing anything
visible: the multivalue clear icon stays centred, stacked radios gain a 24px
pitch so the spacing exception applies while the dial stays 16px, and
month-view event chips grow from 13px to 24px (fewer fit before the existing
"+N more" overflow, which is unchanged).
- WCAG 2.1.1 keyboard: the mobile card wrapper of VcDataTable scrolls but its
cards are not focusable, leaving the list unreachable by keyboard. This
regressed when mobile scrolling was restored; the gate caught it the same day.
Also:
- pin the story-test Storybook to port 6011 — the plugin reuses whatever answers
on storybookUrl, so a dev server left running from another checkout would
silently serve the stories under test
- the two useUser mocks construct-called an arrow implementation, which vitest 4
rejects ("is not a constructor"); they now use plain functions
- add the storybook-tests CI job, using the workspace playwright binary (yarn dlx
installs browsers under a revision @vitest/browser will not look for)
Suite result: 77 files, 616 tests, 28s, green from both cold and warm caches.
|
📦 Preview published for commit Install the preview with dist-tag: npm install @vc-shell/framework@pr-278Or pin to the exact commit: npm install @vc-shell/framework@2.3.0-pr278.27fa53aPublished packages (dist-tag
|
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
1 participant
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.
Closes VCST-5619.
yarn test:storybooknever ran a single assertion, so nothing in the repo executed story code —typecheckexcludes*.stories.ts, ESLint reports nothing for an unimported identifier, andstorybook-buildonly compiles. That is how a story referencing an undefined identifier shipped (VCST-5597).Why it did not run
All 77 suites failed to load with
does not provide an export named 'Component'while importing.storybook/vitest.setup.ts.Componentis a type: in a plain.tsfile esbuild drops a specifier that is unused in value position, but in an SFC the Vue compiler emits the import statement verbatim, so the type name survives into the runtime import of the prebundled vue and throws. Every story suite imports the setup file, so one bad import took out all of them. Fixed in the 7 SFCs that had it; the ~60.tsfiles that import vue types the same way are harmless and were left alone.Separately, vitest 4 moved the browser providers into their own packages and takes a provider factory instead of the
"playwright"string.What the gate then found
12 genuine accessibility failures, all fixed here:
VcDataTablescrolls but its cards are not focusable, leaving the list unreachable by keyboard. This regressed when mobile scrolling was restored (fix(vc-data-table): restore scrolling in the mobile card view #276) and the gate caught it the same day.Also
storybookUrl, so a dev server left running from another checkout would silently serve the stories under testuseUsermocks construct-called an arrow implementation, which vitest 4 rejects; they now use plain functionsstorybook-testsCI job. It uses the workspace playwright binary —yarn dlxresolves a different playwright and installs browsers under a revision@vitest/browserwill not look for.Verification
yarn checkstorybook-buildis left in place: it validates the production bundle, which the dev-server run does not. Worth revisiting whether one can replace the other.