pnpm exec vitest run
(node:4166) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)
Re-optimizing dependencies because lockfile has changed
RUN v2.0.5 /Users/kasperpeulen/code/github/rsc-demo
Browser runner started at http://localhost:5173/
4:05:10 PM [vite] ✨ new dependencies optimized: @storybook/experimental-addon-test/internal/test-utils, react/jsx-dev-runtime, next/image, next/dist/compiled/react, sb-original/default-loader, sb-original/image-context
4:05:10 PM [vite] ✨ optimized dependencies changed. reloading
stderr | components/sidebar.stories.tsx > NoteChangedAnimation
Warning: The current testing environment is not configured to support act(...)
✓ components/auth-button.stories.tsx (2)
✓ components/logout-button.stories.tsx (1)
✓ components/note-editor.stories.tsx (2)
✓ components/note-list-skeleton.stories.tsx (1)
✓ components/note-list.stories.tsx (2)
✓ components/note-preview.stories.tsx (1)
✓ components/note-ui.stories.tsx (3)
✓ components/search.stories.tsx (3)
❯ components/sidebar.stories.tsx (5) 15035ms
✓ Default
✓ Empty
✓ NotesExpanded
× NoteChangedAnimation 15002ms
× ToggleSidebarOnMobile
✓ app/note/edit/page.stories.tsx (3) 731ms
✓ app/note/[id]/page.stories.tsx (7) 748ms
✓ app/note/edit/[id]/page.stories.tsx (4) 1076ms
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Failed Tests 2 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
FAIL components/sidebar.stories.tsx > NoteChangedAnimation
Error: Test timed out in 15000ms.
If this is a long-running test, pass a timeout value as the last argument or configure it globally with "testTimeout".
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/2]⎯
FAIL components/sidebar.stories.tsx > ToggleSidebarOnMobile
TestingLibraryElementError: Unable to find an accessible element with the role "menubar"
There are no accessible roles. But there might be some inaccessible roles. If you wish to access them, then set the `hidden` option to `true`. Learn more about this here: https://testing-library.com/docs/dom-testing-library/api-queries#byrole
Ignored nodes: comments, script, style
<div />
❯ play components/sidebar.stories.tsx:69:31
67| },
68| play: async ({ canvas, step, userEvent }) => {
69| const searchInput = canvas.getByRole('menubar')
| ^
70|
71| await step('Sidebar is initially visible', async () => {
❯ ../../../../../node_modules/.vite/deps/@storybook_experimental-addon-test_internal_test-utils.js:51:98
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[2/2]⎯
Test Files 1 failed | 11 passed (12)
Tests 2 failed | 32 passed (34)
Start at 16:05:06
Duration 21.76s (transform 13ms, setup 6.60s, collect 1.71s, tests 18.35s, environment 0ms, prepare 2.52s)
It is hard to debug, because the errors goes away when running with headless: false.
My suspicion is that it is related to viewports. Because the element that is not found, is only visible in the mobile viewport.
We have an issue in the rsc demo.
To reproduce, check out this PR: https://github.com/storybookjs/storybook-rsc-demo/pull/15
And run:
pnpm exec vitest runYou will get the following error:
It is hard to debug, because the errors goes away when running with headless: false.
My suspicion is that it is related to viewports. Because the element that is not found, is only visible in the mobile viewport.