diff --git a/src/cdk/overlay/scroll/block-scroll-strategy.ts b/src/cdk/overlay/scroll/block-scroll-strategy.ts index 68e74f04762..00cd0642e40 100644 --- a/src/cdk/overlay/scroll/block-scroll-strategy.ts +++ b/src/cdk/overlay/scroll/block-scroll-strategy.ts @@ -16,8 +16,11 @@ export class BlockScrollStrategy implements ScrollStrategy { private _previousHTMLStyles = { top: '', left: '' }; private _previousScrollPosition: { top: number, left: number }; private _isEnabled = false; + private _document: Document; - constructor(private _viewportRuler: ViewportRuler) { } + constructor(private _viewportRuler: ViewportRuler, document: any) { + this._document = document; + } /** Attaches this scroll strategy to an overlay. */ attach() { } @@ -25,7 +28,7 @@ export class BlockScrollStrategy implements ScrollStrategy { /** Blocks page-level scroll while the attached overlay is open. */ enable() { if (this._canBeEnabled()) { - const root = document.documentElement; + const root = this._document.documentElement; this._previousScrollPosition = this._viewportRuler.getViewportScrollPosition(); @@ -45,8 +48,8 @@ export class BlockScrollStrategy implements ScrollStrategy { /** Unblocks page-level scroll while the attached overlay is open. */ disable() { if (this._isEnabled) { - const html = document.documentElement; - const body = document.body; + const html = this._document.documentElement; + const body = this._document.body; const previousHtmlScrollBehavior = html.style['scrollBehavior'] || ''; const previousBodyScrollBehavior = body.style['scrollBehavior'] || ''; @@ -71,11 +74,13 @@ export class BlockScrollStrategy implements ScrollStrategy { // Since the scroll strategies can't be singletons, we have to use a global CSS class // (`cdk-global-scrollblock`) to make sure that we don't try to disable global // scrolling multiple times. - if (document.documentElement.classList.contains('cdk-global-scrollblock') || this._isEnabled) { + const html = this._document.documentElement; + + if (html.classList.contains('cdk-global-scrollblock') || this._isEnabled) { return false; } - const body = document.body; + const body = this._document.body; const viewport = this._viewportRuler.getViewportSize(); return body.scrollHeight > viewport.height || body.scrollWidth > viewport.width; } diff --git a/src/cdk/overlay/scroll/scroll-strategy-options.ts b/src/cdk/overlay/scroll/scroll-strategy-options.ts index 18fcd6e38c9..ae06645c2af 100644 --- a/src/cdk/overlay/scroll/scroll-strategy-options.ts +++ b/src/cdk/overlay/scroll/scroll-strategy-options.ts @@ -5,12 +5,13 @@ * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.io/license */ -import {Injectable, NgZone} from '@angular/core'; +import {Injectable, NgZone, Inject} from '@angular/core'; import {CloseScrollStrategy, CloseScrollStrategyConfig} from './close-scroll-strategy'; import {NoopScrollStrategy} from './noop-scroll-strategy'; import {BlockScrollStrategy} from './block-scroll-strategy'; import {ScrollDispatcher} from '@angular/cdk/scrolling'; import {ViewportRuler} from '@angular/cdk/scrolling'; +import {DOCUMENT} from '@angular/common'; import { RepositionScrollStrategy, RepositionScrollStrategyConfig, @@ -25,10 +26,15 @@ import { */ @Injectable() export class ScrollStrategyOptions { + private _document: Document; + constructor( private _scrollDispatcher: ScrollDispatcher, private _viewportRuler: ViewportRuler, - private _ngZone: NgZone) { } + private _ngZone: NgZone, + @Inject(DOCUMENT) document: any) { + this._document = document; + } /** Do nothing on scroll. */ noop = () => new NoopScrollStrategy(); @@ -41,7 +47,7 @@ export class ScrollStrategyOptions { this._ngZone, this._viewportRuler, config) /** Block scrolling. */ - block = () => new BlockScrollStrategy(this._viewportRuler); + block = () => new BlockScrollStrategy(this._viewportRuler, this._document); /** * Update the overlay's position on scroll.