fix: use rollup-plugin-postcss-lit with Vite

[web-padawan]

Description

Fixes #14142

Added rollup-plugin-postcss-lit and configured it to handle all CSS files except those under theme folder.
Note the extra entry with ? is necessary until umbopepato/rollup-plugin-postcss-lit#49 fixed.

Another entry added to excludes to workaround umbopepato/rollup-plugin-postcss-lit#52

Type of change

• Bugfix

[github-actions]

Unit Test Results

   916 files  +  9     916 suites  +9   50m 54s ⏱️ + 4m 4s
6 010 tests +11  5 956 ✔️ +11  54 💤 ±0  0 ❌ ±0 
6 221 runs   -   2  6 159 ✔️  -   1  62 💤  - 1  0 ❌ ±0 

Results for commit b7be221. ± Comparison against base commit 1bf5831.

♻️ This comment has been updated with latest results.

[mshabarov]

Tested with both flow-tests/test-themes and flow-tests/test-custom-frontend-directory/test-themes-custom-frontend-directory manually, works as expected: text field styles are taken from custom theme and lit component styles are takes from component CSS file.

[web-padawan]

There are two tests still failing:

Error:  Tests run: 1, Failures: 1, Errors: 0, Skipped: 0, Time elapsed: 0.844 s <<< FAILURE! - in com.vaadin.flow.uitest.ui.theme.ReusableThemeIT
Error:  applicationTheme_GlobalCss_isUsed[ANY_Chrome_](com.vaadin.flow.uitest.ui.theme.ReusableThemeIT)  Time elapsed: 0.844 s  <<< FAILURE!

Error:  Tests run: 1, Failures: 1, Errors: 0, Skipped: 0, Time elapsed: 0.791 s <<< FAILURE! - in com.vaadin.flow.webcomponent.ApplicationThemeComponentIT
Error:  applicationTheme_GlobalCss_isUsedOnlyInEmbeddeComponent[ANY_Chrome_](com.vaadin.flow.webcomponent.ApplicationThemeComponentIT)  Time elapsed: 0.791 s  <<< FAILURE!

[web-padawan]

@mshabarov Updated the PR to also add themeResourceFolder to exclude, this should fix remaining tests.

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
10 Code Smells

No Coverage information
0.0% Duplication

[vaadin-bot]

Hi @web-padawan and @mshabarov, when i performed cherry-pick to this commit to 23.1, i have encountered the following issue. Can you take a look and pick it manually?
Error Message:
Error: Command failed: git cherry-pick fccffb2
error: could not apply fccffb2... fix: use rollup-plugin-postcss-lit with Vite (#14295)
hint: After resolving the conflicts, mark them with
hint: "git add/rm ", then run
hint: "git cherry-pick --continue".
hint: You can instead skip this commit with "git cherry-pick --skip".
hint: To abort and get back to the state before "git cherry-pick",
hint: run "git cherry-pick --abort".

[vaadin-bot]

This ticket/PR has been released with Vaadin 23.2.0.beta1 and is also targeting the upcoming stable 23.2.0 version.