Fix slot fallbacks unexpectedly showing up in some cases (#6819)

* test: add test fixture

* test: add test case

* test: revert unneeded changes in fixture

* fix

* chore: changeset
This commit is contained in:
Happydev 2023-04-12 12:23:14 +00:00 committed by GitHub
parent bdfbe000d8
commit 76dd53e3f6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 11 additions and 1 deletions

View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Fix fallback content showing unexpectedly in some cases

View file

@ -35,7 +35,7 @@ export async function* renderSlot(
yield* iterator;
}
if (fallback) {
if (fallback && !slotted) {
yield* renderSlot(result, fallback);
}
}

View file

@ -52,6 +52,7 @@ describe('Slots', () => {
const $ = cheerio.load(html);
expect($('#override')).to.have.lengthOf(1);
expect($('#fallback-2').text()).to.equal('Slotty slot.');
});
it('Slots work with multiple elements', async () => {

View file

@ -0,0 +1,2 @@
<!-- note: to make testing easier this was inlined -->
<div id="fallback-2"><slot name="override-2">Fallback should only show when no slot has been provided.</slot></div>

View file

@ -1,5 +1,6 @@
---
import Fallback from '../components/Fallback.astro';
import Fallback2 from '../components/Fallback2.astro';
---
<html>
@ -11,6 +12,7 @@ import Fallback from '../components/Fallback.astro';
<Fallback>
<div id="override" />
</Fallback>
<Fallback2><div slot="override-2">Slotty slot.</div></Fallback2>
</div>
</body>
</html>