-
Notifications
You must be signed in to change notification settings - Fork 6.8k
Description
Bug, feature request, or proposal:
The MdCommonModule._checkTheme function throws an error when the angular+material2 app is running inside an iframe that has CSS property display set to 'none'.
This is caused by a long outstanding bug in Firefox that seems unlikely to be fixed anytime soon; window.getComputedStyle() returns null inside an iframe with display: none
The behavior of MdCommonModule._checkTheme could be extended by doing a null-check on the result of window.getComputedStyle() and if true follow a more elaborate code path to detect an angular material theme, e.g. by iterating document.stylesheets.cssRules and trying to find the 'mat-theme-loaded-marker' rule. This approach will have an impact on the load time (I think) but as the app is hidden at this point it should not matter that much.
A simpler change could be to just log an error explaining the Firefox issue, as this should only occur in devMode.
What is the expected behavior?
The application bootstraps in the hidden iframe and is shown when the iframe is no longer hidden.
What is the current behavior?
The application fails to bootstrap.
What are the steps to reproduce?
See http://plnkr.co/WQ6BXarpPGQQ7kHoiRSg using Firefox
What is the use-case or motivation for changing an existing behavior?
Although there is a workaround (disable sanityChecks) it seems a bit harsh to not bootstrap the app at all.
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Firefox specific.