🐛 BUG: <link rel="stylesheet"> inside Svelte component breaks client:visible

[isaac-mcfadyen]

What version of astro are you using?

v1.0.0-rc.7

Are you using an SSR adapter? If so, which one?

None

What package manager are you using?

yarn

What operating system are you using?

macOS Ventura (don't think it's related)

Describe the Bug

When using a <link rel="stylesheet" ...> inside a Svelte component, client:visible seems to break.

Any component with a stylesheet anywhere inside it and using client:visible will no longer be hydrated, no matter where on the page you scroll and even if it's directly visible. Removing the stylesheet causes things to immediately work again.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-fv7dts?file=src/pages/index.astro

Participation

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

[natemoo-re]

Thanks for opening an issue! This is a strange one, we'll have to investigate what's going on here.

[pilcrowOnPaper]

I think this issue is resolved?

Reproduction: https://github.com/pilcrowOnPaper/astro-svelte-visible-hydrate

[PuruVJ]

Not resolved for me yet, getting the same problem

[pilcrowOnPaper]

@isaac-mcfadyen @PuruVJ @natemoo-re

2 things:

• The reproduction works fine on my local machine
• The reproduction on StackBlitz works fine when the stylesheet href is pointing to a local file (not external like https://unpkg.com/swiper/swiper-bundle.min.css)

From this, I think this is an issue with StackBlitz and network requests, and not Astro/Svelte.

[PuruVJ]

The reproduction is fine, but my local version with many MDX and Svelte files combined isn't working.

Update: It's not because of style. It's just not working at all 😅

[JerryWu1234]

@natemoo-re what's the latest news for this bug？ I want to found it

[bluwy]

Looks like this is working fine, but StackBlitz is blocking the unpkg request somehow causing it fail. If I run this locally, specify another external link that 404s, it renders fine too. Closing as fixed.