diff --git a/src/lib/core/common-behaviors/common-module.ts b/src/lib/core/common-behaviors/common-module.ts index 23fe78b2c74b..9f47553ba425 100644 --- a/src/lib/core/common-behaviors/common-module.ts +++ b/src/lib/core/common-behaviors/common-module.ts @@ -1,7 +1,12 @@ -import {NgModule} from '@angular/core'; +import {NgModule, InjectionToken, Optional, Inject, isDevMode} from '@angular/core'; +import {DOCUMENT} from '@angular/platform-browser'; import {CompatibilityModule} from '../compatibility/compatibility'; +/** Injection token that configures whether the Material sanity checks are enabled. */ +export const MATERIAL_SANITY_CHECKS = new InjectionToken('md-sanity-checks'); + + /** * Module that captures anything that should be loaded and/or run for *all* Angular Material * components. This includes Bidi, compatibility mode, etc. @@ -11,5 +16,50 @@ import {CompatibilityModule} from '../compatibility/compatibility'; @NgModule({ imports: [CompatibilityModule], exports: [CompatibilityModule], + providers: [{ + provide: MATERIAL_SANITY_CHECKS, useValue: true, + }], }) -export class MdCommonModule { } +export class MdCommonModule { + /** Whether we've done the global sanity checks (e.g. a theme is loaded, there is a doctype). */ + private _hasDoneGlobalChecks = false; + + constructor( + @Optional() @Inject(DOCUMENT) private _document: any, + @Optional() @Inject(MATERIAL_SANITY_CHECKS) _sanityChecksEnabled: boolean) { + + if (_sanityChecksEnabled && !this._hasDoneGlobalChecks && _document && isDevMode()) { + this._checkDoctype(); + this._checkTheme(); + this._hasDoneGlobalChecks = true; + } + } + + private _checkDoctype(): void { + if (!this._document.doctype) { + console.warn( + 'Current document does not have a doctype. This may cause ' + + 'some Angular Material components not to behave as expected.' + ); + } + } + + private _checkTheme(): void { + if (typeof getComputedStyle === 'function') { + const testElement = this._document.createElement('div'); + + testElement.classList.add('mat-theme-loaded-marker'); + this._document.body.appendChild(testElement); + + if (getComputedStyle(testElement).display !== 'none') { + console.warn( + 'Could not find Angular Material core theme. Most Material ' + + 'components may not work as expected. For more info refer ' + + 'to the theming guide: https://material.angular.io/guide/theming' + ); + } + + this._document.body.removeChild(testElement); + } + } +} diff --git a/src/lib/core/compatibility/compatibility.ts b/src/lib/core/compatibility/compatibility.ts index d23d9bad36fb..0e71e122e279 100644 --- a/src/lib/core/compatibility/compatibility.ts +++ b/src/lib/core/compatibility/compatibility.ts @@ -1,19 +1,7 @@ -import { - NgModule, - Directive, - Inject, - Optional, - isDevMode, - ElementRef, - InjectionToken, -} from '@angular/core'; -import {DOCUMENT} from '@angular/platform-browser'; +import {NgModule, Directive, Inject, Optional, ElementRef, InjectionToken} from '@angular/core'; export const MATERIAL_COMPATIBILITY_MODE = new InjectionToken('md-compatibility-mode'); -/** Injection token that configures whether the Material sanity checks are enabled. */ -export const MATERIAL_SANITY_CHECKS = new InjectionToken('md-sanity-checks'); - /** * Returns an exception to be thrown if the consumer has used * an invalid Material prefix on a component. @@ -183,54 +171,8 @@ export class MdPrefixRejector { @NgModule({ declarations: [MatPrefixRejector, MdPrefixRejector], exports: [MatPrefixRejector, MdPrefixRejector], - providers: [{ - provide: MATERIAL_SANITY_CHECKS, useValue: true, - }], }) -export class CompatibilityModule { - /** Whether we've done the global sanity checks (e.g. a theme is loaded, there is a doctype). */ - private _hasDoneGlobalChecks = false; - - constructor( - @Optional() @Inject(DOCUMENT) private _document: any, - @Optional() @Inject(MATERIAL_SANITY_CHECKS) _sanityChecksEnabled: boolean) { - - if (_sanityChecksEnabled && !this._hasDoneGlobalChecks && _document && isDevMode()) { - // Delay running the check to allow more time for the user's styles to load. - this._checkDoctype(); - this._checkTheme(); - this._hasDoneGlobalChecks = true; - } - } - - private _checkDoctype(): void { - if (!this._document.doctype) { - console.warn( - 'Current document does not have a doctype. This may cause ' + - 'some Angular Material components not to behave as expected.' - ); - } - } - - private _checkTheme(): void { - if (typeof getComputedStyle === 'function') { - const testElement = this._document.createElement('div'); - - testElement.classList.add('mat-theme-loaded-marker'); - this._document.body.appendChild(testElement); - - if (getComputedStyle(testElement).display !== 'none') { - console.warn( - 'Could not find Angular Material core theme. Most Material ' + - 'components may not work as expected. For more info refer ' + - 'to the theming guide: https://material.angular.io/guide/theming' - ); - } - - this._document.body.removeChild(testElement); - } - } -} +export class CompatibilityModule {} /** diff --git a/src/lib/core/core.ts b/src/lib/core/core.ts index 9fbfec2b55bc..45a435fab78d 100644 --- a/src/lib/core/core.ts +++ b/src/lib/core/core.ts @@ -98,7 +98,7 @@ export {coerceNumberProperty} from './coercion/number-property'; export {CompatibilityModule, NoConflictStyleCompatibilityMode} from './compatibility/compatibility'; // Common material module -export {MdCommonModule} from './common-behaviors/common-module'; +export {MdCommonModule, MATERIAL_SANITY_CHECKS} from './common-behaviors/common-module'; // Datetime export * from './datetime/index';