-
-
Notifications
You must be signed in to change notification settings - Fork 9.8k
Description
Describe the bug
When the Cally date picker is used in Storybook, a "maximum call stack size" error occurs. This error does not occur outside of Storybook.
VM1030 cally.js:19 Uncaught RangeError: Maximum call stack size exceeded
Reproduction link
https://github.com/rdebeasi/cally-repro
Reproduction steps
- Check out the repro and run
npm i. - Run
npm run storybok. This command runs React + Vite + Storybook. - In a browser, open http://localhost:6006/iframe.html?globals=&id=example-datepicker--basic&viewMode=story
- Open browser dev tools and open the console tab.
- Click a date.
- Note that the follwoing error appears in console: "VM1030 cally.js:19 Uncaught RangeError: Maximum call stack size exceeded".
- Press an arrow key.
- Note that the highlighted date does not move.
This repro uses Storybook React, but I've also seen the issue when using Storybook Angular.
Viewing expected behavior
- Run
npm run dev. This command runs a React + Vite app. - Open the local dev site in a browser.
- Open browser dev tools and open the console tab.
- Click a date.
- Note that no errors appear in console.
- Press an arrow key.
- Note that the highlighted date moves in the direction of the arrow key that was pressed.
System
Storybook Environment Info:
System:
OS: macOS 15.6.1
CPU: (8) arm64 Apple M1 Pro
Shell: 5.9 - /bin/zsh
Binaries:
Node: 22.18.0 - ~/.local/state/fnm_multishells/48691_1759251509769/bin/node
npm: 10.9.3 - ~/.local/state/fnm_multishells/48691_1759251509769/bin/npm <----- active
Browsers:
Chrome: 140.0.7339.214
Edge: 140.0.3485.94
Safari: 18.6
npmPackages:
@storybook/react-vite: ^9.1.8 => 9.1.8
eslint-plugin-storybook: ^9.1.8 => 9.1.8
storybook: ^9.1.8 => 9.1.8Additional context
The "maximum call stack size" error appears when Cally attempts to focus to focus the button for currently selected date. This logic runs when the month is focused.
If focus events bubbled, then I could see why this error would occur. The button's focus event would bubble up to the month, which would trigger another button focus, which would trigger another month focus, which would trigger another button focus, etc.
My understanding is that focus events don't bubble, so I'm confused as to why this loop would occur. Is it possible that something in Storybook is causing focus events to bubble?
Thank you!!