Skip to content

Problem with pattern { true && <fragment>{...}</fragment> } #16463

@fweth

Description

@fweth

Astro Info

Astro                    v6.1.9
Vite                     v7.3.2
Node                     v25.8.1
System                   Linux (x64)
Package Manager          npm
Output                   static
Adapter                  none
Integrations             none

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

Firefox

Describe the Bug

There seems to be a problem with code like this:

<Test>
  {
    true && (
      <fragment slot="block">
        {({ test }) => <div>Block: {test}</div>}
      </fragment>
    )
  }
</Test>

The error is Cannot destructure property 'test' of 'undefined' as it is undefined.

My component looks like this:

---
let html = '';
if (Astro.slots.has('block') || Astro.slots.has('mark')) {
  html = await Astro.slots.render('block', [{ test: 'block' }]);
}
---
<Fragment set:html={html} />

Calling

<Test>
  <fragment slot="block">
    {({ test }) => <div>Block: {test}</div>}
  </fragment>
</Test>

and

<Test>
</Test>

both works fine.

What's the expected result?

I see no reason why this should not work.

If possible, tell me where I could start to look for a fix, this is really inconvenient for me!

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-e1ymv21o?file=src%2Fpages%2Findex.astro

Participation

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    - P3: minor bugAn edge case that only affects very specific usage (priority)pkg: astroRelated to the core `astro` package (scope)

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions