From 941cb1d196f7b4218f66577e6739f56e01486f47 Mon Sep 17 00:00:00 2001 From: Adam Bradley Date: Fri, 1 Jul 2016 01:08:48 -0500 Subject: [PATCH] fix(backdrop): use raf when adding/removing disable-scroll css --- src/components/backdrop/backdrop.ts | 31 ++++++++++++++++------------- 1 file changed, 17 insertions(+), 14 deletions(-) diff --git a/src/components/backdrop/backdrop.ts b/src/components/backdrop/backdrop.ts index a875da428f..3610518a63 100644 --- a/src/components/backdrop/backdrop.ts +++ b/src/components/backdrop/backdrop.ts @@ -1,5 +1,7 @@ -import {Directive, ViewEncapsulation, HostListener, ElementRef, Input} from '@angular/core'; -import {isTrueProperty} from '../../util/util'; +import { Directive, ElementRef, Input } from '@angular/core'; + +import { isTrueProperty} from '../../util/util'; +import { nativeRaf} from '../../util/dom'; const DISABLE_SCROLL = 'disable-scroll'; @@ -19,23 +21,24 @@ export class Backdrop { private static push() { if (this.nuBackDrops === 0) { - console.debug('adding .disable-scroll to body'); - document.body.classList.add(DISABLE_SCROLL); - } else { - console.warn('several backdrops on screen? probably a bug'); + nativeRaf(() => { + console.debug('adding .disable-scroll to body'); + document.body.classList.add(DISABLE_SCROLL); + }); } this.nuBackDrops++; } private static pop() { - if (this.nuBackDrops === 0) { - console.error('pop requires a push'); - return; - } - this.nuBackDrops--; - if (this.nuBackDrops === 0) { - console.debug('removing .disable-scroll from body'); - document.body.classList.remove(DISABLE_SCROLL); + if (this.nuBackDrops > 0) { + this.nuBackDrops--; + + if (this.nuBackDrops === 0) { + nativeRaf(() => { + console.debug('removing .disable-scroll from body'); + document.body.classList.remove(DISABLE_SCROLL); + }); + } } }