fix: support stylesheets with link tag and media/disable prop

[pd4d10]

closes #6748

Description

---

What is the purpose of this pull request?

• Bug fix
• New Feature
• Documentation update
• Other

Before submitting the PR, please make sure you do the following

• Read the Contributing Guidelines.
• Read the Pull Request Guidelines and follow the Commit Convention.
• Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
• Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
• Ideally, include relevant tests that fail without this PR but pass with it.

[patak-dev]

Thanks for the PR @pd4d10 (and for reviewing @tomayac)

@pd4d10 would you review if you could add a test case so we avoid future regressions? There is info about extending the Vite test suite here https://github.com/vitejs/vite/blob/main/CONTRIBUTING.md#extending-the-test-suite. And you could add it to the css playground.

One issue with the fix is that the CSS sources will not be processed by the Vite pipeline. This means that when media and disabled are used instead of being ignored, a user could see their app break because post CSS is no longer working for them.

I don't know if we should risk that, as this feature was not requested for a long time. @pd4d10 would you check what would be involved to make this change while respecting the CSS pipeline. What I imagine is that we could still convert the CSS file to an import but add suffixes to the path like ?media=...&disabled. The CSS file would go through the pipeline, get transpiled, minified, but we would avoid bundling later CSS files that don't share the same media and disable attrs.

[pd4d10]

The CSS file would go through the pipeline, get transpiled, minified, but we would avoid bundling later CSS files that don't share the same media and disable attrs.

Sounds reasonable. I'll look into it later

[bluwy]

Added tests. This should be good now, and can confirm this fixes the issue.

[patak-dev]

One issue with the fix is that the CSS sources will not be processed by the Vite pipeline. This means that when media and disabled are used instead of being ignored, a user could see their app break because post CSS is no longer working for them.

Given that apps using media and disabled are broken right now, I think we can merge this patch. I still think that we should make these scripts go through the pipeline later maybe as part of 3.1.
Thanks @pd4d10 and @bluwy!

[bluwy]

Given that apps using media and disabled are broken right now, I think we can merge this patch. I still think that we should make these scripts go through the pipeline later maybe as part of 3.1.

Oh that seems like something we should definitely support, and I've completely missed your message before 😅 Will get to this when I have time soon.

[tomayac]

Quick appreciation tweet. Thanks for fixing this! <3