withastro / astro

The web framework for content-driven websites. ⭐️ Star to support our work!
https://astro.build
Other
46.11k stars 2.44k forks source link

Scoped styles not being applied #9066

Closed hoqn closed 11 months ago

hoqn commented 11 months ago

Astro Info

Astro                    v3.5.2
Node                     v18.18.0
System                   Linux (x64)
Package Manager          unknown
Output                   static
Adapter                  none
Integrations             none

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

No response

Describe the Bug

Firstly, please forgive my lack of English as it is not my first language :)

After updating to version 3.5.2, the stylesheet is not being applied on some pages.

After taking a closer look at the problem, I realised that if there is any code that fetches content, such as getCollection, the style is not applied on that page. (I don't know if this is related, but it appears as <style>undefined</style> in the rendered html).

This issue appears to be the same in 3.5.1, and doesn't seem to be present in versions prior to 3.4.4.

I've reproduced the same situation in the stackblitz below. Thanks :)

What's the expected result?

Scoped styles must be applied

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-giqnfl?file=package.json

Participation

lilnasy commented 11 months ago

Thanks for the detailed investigation! This seems to be a regression caused by content collections related changes in 3.5.

lilnasy commented 11 months ago

I think I see what the issue is: https://github.com/withastro/astro/blob/astro3.5.0/packages/astro/src/content/vite-plugin-content-assets.ts#L147 Seems like a propagation issue instead.

Workaround (for static output only):

export default defineConfig({
  experimental: {
    contentCollectionCache: true
  }
})
natemoo-re commented 11 months ago

Sorry about this! I just opened a PR with a fix. https://github.com/withastro/astro/pull/9069

Just waiting on a review so we can merge and release this.