blaise-io / live-reload

Browser extension for web devs. Monitors source files on a page and reloads page or source file when a change is detected.
MIT License
60 stars 9 forks source link

link[rel=stylesheet] in inject.ts doesn't pick up preloaded stylesheets #28

Closed rotkohlsuppe closed 3 years ago

rotkohlsuppe commented 3 years ago

const selector = document.querySelectorAll("link[rel=stylesheet]");

I'd suggest to use a broader selector like: document.querySelectorAll("link[rel*=stylesheet], link[rel=preload][as=style]") for all possiblities, like <link rel="preload stylesheet" href="...css"> and <link rel="preload" as="style" href="...css">.

Preload @MDN

blaise-io commented 3 years ago

Thanks, good suggestion, I will fix this soon.

blaise-io commented 3 years ago

@rotkohlsuppe I'm now supporting <link rel="preload stylesheet" href="...css"> when inline reloading css resources. However, it doesn't make sense to support <link rel="preload" as="style" href="...css"> because the document is already past the preloading phase when reloading inline resources. Note that the selector is not used to detect which resources are monitored, for this I intercept http requests.

blaise-io commented 3 years ago

This will be in 1.8.4