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

Simple content page completely freezes up Firefox/Chrome #2601

Open
kbrgmn opened this issue Apr 2, 2024 · 1 comment
Open

Simple content page completely freezes up Firefox/Chrome #2601

kbrgmn opened this issue Apr 2, 2024 · 1 comment

Comments

@kbrgmn
Copy link

kbrgmn commented Apr 2, 2024

Environment

  • Operating System: Linux
  • Node Version: v21.7.1
  • Nuxt Version: 3.11.1
  • CLI Version: 3.11.1
  • Nitro Version: 2.9.5
  • Package Manager: bun@1.1.0
  • Builder: -
  • User Config: devtools, modules
  • Runtime Modules: @nuxt/content@2.12.1, nuxt-icon@0.6.10
  • Build Modules: -

Reproduction

GitHub repo here: https://github.com/kbrgmn/nuxt-content-icon-reproduction (as the browser freezes/crashes, stackblitz does not work well here)

Very minimal reproduction:

  • a single page [...slug].vue:
<template>
    <ContentDoc/>
</template>`)
  • 2 components

the first of which is:

<template>
    <Icon name="heroicons:information-circle"/>
</template>

the second component is:

<template>
    <div>
        <p>Different component here</p>
        <div>
            <slot/>
        </div>
    </div>
</template>
  • 1 single simple content markdown page using the two components:
# Issue reproduction

First component (icon):
::ComponentWithIcon
::

::SecondComponent
We have some more content here
- nsetetur sadipscing elitr,
::

Describe the bug

When the page is visited (in dev mode with bun dev), it completely freezes up (both Firefox and Chrome),
with no text being selectable, developer console not opening if it hasn't already been opened or opening blank, browser not even closing properly, and this warning is printed hundreds of times repeatedly in the console:

Avoid app logic that relies on enumerating keys on a component instance.
The keys will be empty in production mode to avoid performance overhead.

(the reproduction does not have a single <script> tag in the whole repository)

However, this issue does not occur when a production build is being done with bun run build && node .output/server/index.mjs.

In the reproduction markdown page, there are three (/ 4) distinct components used:

  • the <h1> prose heading (by single '#')
  • the first component shown above (nuxt-icon)
  • the second component shown above
  • a single <li> prose element (by single '-')

When the first component (a nuxt-icon), or the list within the second comopnent (the <li> made with markdown - nsetetur sadipscing elitr,) is removed, the issue does not occur.

Additional context

No response

Logs

No warnings / errors are outputted in the terminal where nuxt dev is run.

@kbrgmn
Copy link
Author

kbrgmn commented Apr 3, 2024

L422Y from the Nuxt Discord checked that:

  • if the <slot/> from the one component is removed, it doesn't lock up
  • if the <slot/> stays, and - nsetetur sadipscing elitr, is removed, it doesn't lock up

seems like it might be definitely related to nuxt content and the MDC / lexing of children, and using markdown inside of component slots

like it doesn't know what to do with markdown inside the component

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant