Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

RangeError: Maximum call stack size exceeded (3.0.0-7, React 19) #1114

Open
iantrudell opened this issue Dec 6, 2024 · 0 comments
Open

RangeError: Maximum call stack size exceeded (3.0.0-7, React 19) #1114

iantrudell opened this issue Dec 6, 2024 · 0 comments

Comments

@iantrudell
Copy link

🐛 Bug Report

On React 19 using "next" (3.0.0-7), the following error now appears that did not appear on React 18, v2.x

Maximum call stack size exceeded
RangeError: Maximum call stack size exceeded
    at isSpecial (/node_modules/.vite/deps/react-joyride.js?v=d9fbf3fb:140:23)
    at Object.isMergeableObject2 [as isMergeableObject] (/node_modules/.vite/deps/react-joyride.js?v=d9fbf3fb:135:41)
    at mergeObject (/node_modules/.vite/deps/react-joyride.js?v=d9fbf3fb:187:19)
    at deepmerge4 (/node_modules/.vite/deps/react-joyride.js?v=d9fbf3fb:217:16)
    at cloneUnlessOtherwiseSpecified (/node_modules/.vite/deps/react-joyride.js?v=d9fbf3fb:153:76)
    at /node_modules/.vite/deps/react-joyride.js?v=d9fbf3fb:199:30
    at Array.forEach (<anonymous>)
    at mergeObject (/node_modules/.vite/deps/react-joyride.js?v=d9fbf3fb:192:23)
    at deepmerge4 (/node_modules/.vite/deps/react-joyride.js?v=d9fbf3fb:217:16)
    at cloneUnlessOtherwiseSpecified (/node_modules/.vite/deps/react-joyride.js?v=d9fbf3fb:153:76)

To Reproduce

Create state like this:

import { Step } from 'react-joyride'
interface JoyrideState {
    run: boolean
    steps: Step[]
    stepIndex?: number
}
export default JoyrideState

import Joyride, { CallBackProps, STATUS } from 'react-joyride'
import JoyrideState from '@/features/resources/components/JoyrideState'
const Home = () => {
    const [{ run, steps }, setJoyrideState] = useState<JoyrideState>({
        run: false,
        steps: [
            {
                content: (
                    <>
                        <div className='header'>Header</div>
                        <div className='body'>Body</div>
                    </>
                ),
                locale: { skip: <strong aria-label='skip'>Skip</strong> },
                floaterProps: {
                    disableAnimation: true,
                },
                target: '.some-target',
                disableBeacon: true,
            }
        ]
    })
}

Expected behavior

No stack overflow

Link to repl or repo (highly encouraged)

Will edit this later to create a sandbox

Run npx envinfo --system --binaries --npmPackages react-joyride

Paste the results here:

System:
    OS: Windows 10 10.0.19045
    CPU: (20) x64 12th Gen Intel(R) Core(TM) i7-12700H
    Memory: 37.44 GB / 63.64 GB
  Binaries:
    Node: 20.15.1 - C:\Program Files\nodejs\node.EXE
    npm: 10.7.0 - C:\Program Files\nodejs\npm.CMD
    bun: 1.1.38 - ~\.bun\bin\bun.EXE
  npmPackages:
    react-joyride: next => 3.0.0-7
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants