Skip to content

Nested lists in wrong order when using slots #1096

@mthierman

Description

@mthierman

Astro Info

Astro                    v5.2.5
Node                     v22.14.0
System                   Windows (x64)
Package Manager          pnpm
Output                   static
Adapter                  none
Integrations             @astrojs/mdx
                         @astrojs/react

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

Using Astro components with slots results in lists items being generated outside of the slot

Menu.astro:

<menu><slot /></menu>

Nav.astro:

---
import Menu from "./Menu.astro";
---

<nav>
    <menu>
        <li>
            <Menu>
                <li>test</li>
            </Menu>
        </li>
    </menu>
</nav>

HTML output:

<body>
    <nav>
        <menu>
            <li><menu></menu></li>
            <li>test</li>
        </menu>
    </nav>
</body>

What's the expected result?

List items go inside the slot correctly

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-jtgsx6ty

Participation

  • I am willing to submit a pull request for this issue.

Metadata

Metadata

Assignees

No one assigned

    Labels

    - P4: importantViolate documented behavior or significantly improves performance (priority)

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions