-
Notifications
You must be signed in to change notification settings - Fork 99
Element placed in slot called "undefined" #946
Copy link
Copy link
Open
Labels
- P3: minor bugAn edge case that only affects very specific usage (priority)An edge case that only affects very specific usage (priority)
Description
Astro Info
Astro v3.1.4
Node v18.18.0
System Linux (x64)
Package Manager unknown
Output static
Adapter none
Integrations @astrojs/mdx
@astrojs/sitemap
If this issue only occurs in one browser, which browser is a problem?
No response
Describe the Bug
Rendering elements inside a ternary with a slot renders the element in the slot, regardless of the condition:
// The second div will be rendered inside the "slotted" slot.
{false
? <div slot="slotted">Inside slot with red background</div>
: <div>Outside slot without background</div>
}When setting a slot to undefined, it also creates a slot in Astro called "undefined":
<div slot={false ? 'named-slot' : undefined}>
Added to slot named "undefined"
</div>Logging Astro.slots˛ to the console gives us the following:
Slots { slotted: [Getter], undefined: [Getter] }
What's the expected result?
- The condition should be taken into consideration, and the element should be placed outside of the slot
- If the value of the
slotprop is falsy (undefined,null, etc) the element should not be placed in a slot
Link to Minimal Reproducible Example
https://stackblitz.com/edit/withastro-astro-zfaobp?file=src%2Fpages%2Findex.astro
Participation
- I am willing to submit a pull request for this issue.
Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
- P3: minor bugAn edge case that only affects very specific usage (priority)An edge case that only affects very specific usage (priority)