flow icon indicating copy to clipboard operation
flow copied to clipboard

CssImport javadoc should mention that it only works with webcomponents implementing ThemableMixin

Open mvysny opened this issue 3 months ago • 0 comments

Description of the bug

I tried to style the https://github.com/FlowingCode/GoogleMapsAddon . The webcomponent doesn't offer any themable parts and places the Google Map into a ShadowDOM, so I thought I could inject a css file using CssImport with themeFor="google-map". Unfortunately that didn't work, and there is no obvious reason as to why. Neither the documentation nor CssImport mentions the fact that the webcomponent needs to implement ThemableMixin in order for it to work.

CssImport mentions that it calls registerStyles() of vaadin-themable-mixin but I have no idea what that means, or how that is helping me.

Expected behavior

  1. CssImport should explicitly mention that it only works with webcomponents implementing the ThemableMixin.
  2. If I try to target a web element which doesn't implement ThemableMixin, there should be a JavaScript error logged in the JavaScript console, or even better, an exception/error log in the server log.

Minimal reproducible example

  1. Start with skeleton starter
  2. Add the GoogleMap addon
  3. Try to style it with @CssImport("./foo.css", themeFor="google-map")

Versions

  • Vaadin / Flow version: 24.3.6
  • Java version: 21
  • OS version: Ubuntu 22.04
  • Browser version (if applicable): Firefox
  • Application Server (if applicable):
  • IDE (if applicable):

mvysny avatar Mar 28 '24 12:03 mvysny