feat(theming): log a warning if core theme isn't loaded

[crisbeto]

Checks the user's loaded stylesheets and logs a warning if the Material core theme isn't loaded.

Fixes #2828.

Note: I originally went with looping through the document.styleSheets to check whether the selector is defined, however I had to switch back to getComputedStyle, because browsers don't expose the document.styleSheets, if the CSS file is being loaded from another domain. This would've caused the warning to be logged if the user loads over a CDN.

[jelbourn]

What if instead we did something like

.mat-theme-load-test {
  width: 500px;
}

Then we create two elements (position absolute, min heights/width 1px), append them to body, and add the class to one of them then see if they have the same/different offsetWidth?

[crisbeto]

I think that it may end up being slower. Both getComputedStyle and offsetWidth cause a reflow, however we only need to call getComputedStyle once. As an aside, I tried doing some quick measurements between my initial approach (looping through the document.styleSheets) and the getComputedStyle approach. Both ended up taking about the same time on Chrome, but the latter was a bit faster in IE.

[jelbourn]

What if we roll this functionality into CompatibilityModule so we don't have to add another module on every components?

[crisbeto]

My reasoning for not adding it there is that, as far as I understand, it won't be a permanent module, but rather something that's there for a while until people have migrated completely to M2.

[crisbeto]

Closing this one and will re-submit something simpler that will do the check in the CompatibilityModule. Fixing all the merge conflicts here will take longer than redoing it from scratch.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}