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

Code blocks in .mdx files display warnings in browser console #561

Open
justb3a opened this issue May 6, 2024 · 1 comment
Open

Code blocks in .mdx files display warnings in browser console #561

justb3a opened this issue May 6, 2024 · 1 comment
Labels
bug Something isn't working good first issue Good for newcomers

Comments

@justb3a
Copy link
Contributor

justb3a commented May 6, 2024

Create a .mdx file, add code block:

# Headline

Content

\```
some code
without the back slashes
\```

results in

Warning: A props object containing a "key" prop is being spread into JSX:
  let props = {key: someKey, className: ..., children: ..., style: ...};
  <span {...props} />
React keys must be passed directly to JSX without using spread:
  let props = {className: ..., children: ..., style: ...};
  <span key={someKey} {...props} />

Reproduction

https://stackblitz.com/edit/ladle-g4whwj?file=src%2Fmdx.stories.mdx

Open console in browser to see warning.

It is related to the latest react version starting with ^18.3.0. I could only reproduce it after pinning the version to the latest version we're using. Checking 18.2.0 works without warnings.

  "dependencies": {
    "react": "18.3.1",
  }
pnpm ladle dev

Navigate to the the story: Mdx > Welcome, check browser console.

image

Environment

  • OS: macOS
  • Browser: chrome, firefox (latest)
  • react/react-dom: 18.3.1
@justb3a justb3a added the needs triage needs to be reviewed label May 6, 2024
@StreakingMan
Copy link

It also occurred in the TSX file.

@tajo tajo added bug Something isn't working good first issue Good for newcomers and removed needs triage needs to be reviewed labels May 31, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working good first issue Good for newcomers
Projects
None yet
Development

No branches or pull requests

3 participants