Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 19 additions & 8 deletions src/lib/core/compatibility/compatibility.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,16 @@ import {
Optional,
isDevMode,
ElementRef,
InjectionToken,
} from '@angular/core';
import {DOCUMENT} from '@angular/platform-browser';
import {MdError} from '../errors/error';

/** Whether we've done the global sanity checks (e.g. a theme is loaded, there is a doctype). */
let hasDoneGlobalChecks = false;

export const MATERIAL_COMPATIBILITY_MODE = new OpaqueToken('md-compatibility-mode');

/** Injection token that configures whether the Material sanity checks are enabled. */
export const MATERIAL_SANITY_CHECKS = new InjectionToken<boolean>('md-sanity-checks');

/**
* Exception thrown if the consumer has used an invalid Material prefix on a component.
* @docs-private
Expand Down Expand Up @@ -184,25 +185,35 @@ 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;

static forRoot(): ModuleWithProviders {
return {
ngModule: CompatibilityModule,
providers: [],
};
}

constructor(@Optional() @Inject(DOCUMENT) private _document: any) {
if (!hasDoneGlobalChecks && isDevMode()) {
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();
hasDoneGlobalChecks = true;
this._hasDoneGlobalChecks = true;
}
}

private _checkDoctype(): void {
if (this._document && !this._document.doctype) {
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.'
Expand All @@ -211,7 +222,7 @@ export class CompatibilityModule {
}

private _checkTheme(): void {
if (this._document && typeof getComputedStyle === 'function') {
if (typeof getComputedStyle === 'function') {
const testElement = this._document.createElement('div');

testElement.classList.add('mat-theme-loaded-marker');
Expand Down