-
Notifications
You must be signed in to change notification settings - Fork 474
Universal does not properly handle ViewEncapsulation (caching problem perhaps?) #626
Description
Create a similar issue before but closed it because most of the problems went away when I upgraded. But, it's back and this time in a different format. This error appears in 2.1.0-rc.1
As it says in the title it appears that Universal and ViewEncapsulation does not play nice together. I am getting a ton of errors where some components will receive the styles from another component, some styles are never included at all and potentially two components can receive the same encapsulation id (_nghost-xxxx-yy). It all also depends on what the first url loaded.
I have tested this running a few different setups. I have started from universal-starter, the universal fork of angular-cli and having just applied universal myself. The problem persists, so it seems to be something inside universal itself and not depending on the setup.
Some more in depth descriptions of the issues:
Depends on the first url loaded
All of these problems vary depending on what the very first url loaded after the server is started. I.e. if the first page you load after the server starts is /foo you will get one set of errors (an not just on /foo, on the entire site when you start navigating around). If the first page is instead /bar you get another set of errors.
The errors persist and are consistent if you reload the page, reload it on another url, or even use another browser. Only restarting the server and loading another url first will change the set of errors you get.
Wrong style applied
Some errors seem to be because the wrong style gets inserted (or because the components get the wrong id, semantics). E.g. the component gets the id _nghost-1234_1, but the style that gets inserted for that id is the style of an entirely different component that might not even be on the page.
No style applied
Some components will get an id, but their css never gets inserted into the dom. I have double checked that it's not inserted under the wrong id (as per above) and from what I can see that in some cases it's just not inserted at all.
Multiple components with the same id
E.g. you might get two components with the id _nghost-1234_1. I haven't seen this problem since I upgraded to 2.1.0-rc.1. I might just not have found the right trigger for it, or this one doesn't exist anymore.
If I where to hazard a guess I would assume that this is a caching problem. If individual components or css files got cached with their encapsulation id that could break things as ids can change as you load the page. That would explain why it depends on the first url loaded, that would set up the cache and determine how the problem would manifest.
Is there some caching going on and if so is there a way to turn it off? That would be an easy way to check if that is the cause.