astro
astro copied to clipboard
withastro
Providing the HTML element from a component may make it's children fail to render
What version of astro are you using?
1.2.6
Are you using an SSR adapter? If so, which one?
None
What package manager are you using?
npm
What operating system are you using?
Mac
Describe the Bug
If you wrap your layout with an Astro component that provides the <html /> element, the direct children of that element won't render in the output. This usually ends up with both the <body /> & <head /> elements not existing... but their children are rendered as siblings rather than cousins which causes FOUC on most browsers, alongside just being semantically incorrect HTML.
This repo shows the issue as a minimum reproduction. This is the commit which creates the issue
~~Just tried to recreate in astro.new on StackBlitz and it didn't happen, but if I pull the latest version and run locally in both dev mode and after a build, the issue happens.~~ Correction, it was working, but I was grabbing the wrong url when I did view-source in the browser.
Link to Minimal Reproducible Example
https://stackblitz.com/edit/github-2hgchp?file=src/layouts/ThemeProvider.astro
^ you have to see the actual rendered HTML output, because it looks like dev-tools will add a body for you, but that's not what is actually sent over the wire
Participation
- [ ] I am willing to submit a pull request for this issue.
