Skip to content

fix(common): account for async hammer loader when checking whether hammer is defined #12933

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Sep 21, 2018
Merged

fix(common): account for async hammer loader when checking whether hammer is defined #12933

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
50 changes: 28 additions & 22 deletions src/lib/core/common-behaviors/common-module.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
*/

import {NgModule, InjectionToken, Optional, Inject, isDevMode} from '@angular/core';
import {HammerLoader, HAMMER_LOADER} from '@angular/platform-browser';
import {BidiModule} from '@angular/cdk/bidi';


Expand Down Expand Up @@ -44,7 +45,10 @@ export class MatCommonModule {
/** Reference to the global 'window' object. */
private _window = typeof window === 'object' && window ? window : null;

constructor(@Optional() @Inject(MATERIAL_SANITY_CHECKS) private _sanityChecksEnabled: boolean) {
constructor(
@Optional() @Inject(MATERIAL_SANITY_CHECKS) private _sanityChecksEnabled: boolean,
@Optional() @Inject(HAMMER_LOADER) private _hammerLoader?: HammerLoader) {

if (this._areChecksEnabled() && !this._hasDoneGlobalChecks) {
this._checkDoctypeIsDefined();
this._checkThemeIsPresent();
Expand Down Expand Up @@ -74,27 +78,29 @@ export class MatCommonModule {
private _checkThemeIsPresent(): void {
// We need to assert that the `body` is defined, because these checks run very early
// and the `body` won't be defined if the consumer put their scripts in the `head`.
if (this._document && this._document.body && typeof getComputedStyle === 'function') {
const testElement = this._document.createElement('div');

testElement.classList.add('mat-theme-loaded-marker');
this._document.body.appendChild(testElement);

const computedStyle = getComputedStyle(testElement);

// In some situations the computed style of the test element can be null. For example in
// Firefox, the computed style is null if an application is running inside of a hidden iframe.
// See: https://bugzilla.mozilla.org/show_bug.cgi?id=548397
if (computedStyle && computedStyle.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);
if (!this._document || !this._document.body || typeof getComputedStyle !== 'function') {
return;
}

const testElement = this._document.createElement('div');

testElement.classList.add('mat-theme-loaded-marker');
this._document.body.appendChild(testElement);

const computedStyle = getComputedStyle(testElement);

// In some situations the computed style of the test element can be null. For example in
// Firefox, the computed style is null if an application is running inside of a hidden iframe.
// See: https://bugzilla.mozilla.org/show_bug.cgi?id=548397
if (computedStyle && computedStyle.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);
}

/** Checks whether HammerJS is available. */
Expand All @@ -103,7 +109,7 @@ export class MatCommonModule {
return;
}

if (this._areChecksEnabled() && !this._window['Hammer']) {
if (this._areChecksEnabled() && !this._window['Hammer'] && !this._hammerLoader) {
console.warn(
'Could not find HammerJS. Certain Angular Material components may not work correctly.');
}
Expand Down