Flow: Theme issues in Vaadin 14

Created on 8 May 2019  路  11Comments  路  Source: vaadin/flow

Upgrading from 13 to 14 alpha (currently alpha3) leads to issues with themes: at first app load or forced refresh, all is fine; navigating in app between views, some components lose their theme (i.e. Lumo).

For example, this is a grid after refresh:

Screen Shot 2019-05-08 at 14 55 27

and this when navigating to the same view in-app:

Screen Shot 2019-05-08 at 14 55 17

bug nodnppnpm

Most helpful comment

I heard rumors at DevDays about an altar in Turku's HQ where developers make offerings to @Artur- and, sometimes, they get a PR back.

All 11 comments

Just for clarity - the project is running using html-imports, p2 and webjars (aka bowerMode) instead of npm & Polymer 3 ?

My guess would be that there is an issue with the ordering of how things are loaded.

The project is running in bowerMode. Since P3 mode was introduced in alpha3 (I guess), it's worth noting that the issue is present also with alpha2.

Worth also noting the issue is not present in production mode.

@pleku were you able to investigate on this? Would be great to have this fixed in next V14 pre-release!

This still affects 14.0.0.beta1, quite unexpectedly since that means theming doesn't work in the first beta; I mean, does it? Is this confirmed by the team?

Sorry for the lack of response.
There seems to be some issues with the ordering of imports, effecting theming and components #5696.
We are looking into this.

Thank you @pleku for the update. This happens to me not only with Grid but also other components, e.g. it happens I have unstyled notifications and dialogs.

Ok. I'll be honest I'm not then 100 % sure it is covered by the refactoring and fixes that we have WIP for beta 2, targeted this mid-week.

I have to ask you to sit tight until beta2 and retest then. If it reproduces, then it would be nice to get a simple test case for us to replicate it easily.

Thank you @pleku for the feedback. Am I wrong if I say that right now V14 has theming broken for any component in Bower mode?

This is a demo project which replicates the issue: https://github.com/heruan/vaadin-issues

  1. run with
mvn clean spring-boot:run -Dspring-boot.run.jvmArguments="-Dserver.port=9990 -Dvaadin.bowerMode=true"
  1. go to http://localhost:9990

  2. click the "Other" link.

You will see a button not styled, clicking the button it will appear an unstyled notification; forcing a browser refresh, all styles load fine.

To simplify debugging, I've removed Spring from the sample project which can now be run simply with:

mvn clean jetty:run -DbowerMode=true

The problem is that unthemed component versions are loaded on every second navigation... should be fixed by #5730

I heard rumors at DevDays about an altar in Turku's HQ where developers make offerings to @Artur- and, sometimes, they get a PR back.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

vlukashov picture vlukashov  路  3Comments

rucko24 picture rucko24  路  3Comments

Artur- picture Artur-  路  4Comments

mstahv picture mstahv  路  3Comments

anezthes picture anezthes  路  4Comments