fix(badge): disable animations when using NoopAnimationsModule

Fixes the badge transitions not being disabled when using the `NoopAnimationsModule`.

Relates to #10590.

Author: crisbeto

src/lib/badge/_badge-theme.scss

@@ -155,6 +155,11 @@ $mat-badge-large-size: $mat-badge-default-size + 6;
     pointer-events: none;
   }
 
+  .ng-animate-disabled .mat-badge-content,
+  .mat-badge-content._mat-animation-noopable {
+    transition: none;
+  }
+
   // The active class is added after the element is added
   // so it can animate scale to default
   .mat-badge-content.mat-badge-active {

src/lib/badge/badge.ts

@@ -20,6 +20,7 @@ import {
   Renderer2,
 } from '@angular/core';
 import {ThemePalette, mixinDisabled, CanDisableCtor, CanDisable} from '@angular/material/core';
+import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations';
 
 
 let nextId = 0;
@@ -122,9 +123,10 @@ export class MatBadge extends _MatBadgeMixinBase implements OnDestroy, CanDisabl
       private _elementRef: ElementRef<HTMLElement>,
       private _ariaDescriber: AriaDescriber,
       /** @breaking-change 8.0.0 Make _renderer a required param and remove _document. */
-      private _renderer?: Renderer2) {
-        super();
-      }
+      private _renderer?: Renderer2,
+      @Optional() @Inject(ANIMATION_MODULE_TYPE) private _animationMode?: string) {
+      super();
+    }
 
   /** Whether the badge is above the host or not */
   isAbove(): boolean {
@@ -163,14 +165,18 @@ export class MatBadge extends _MatBadgeMixinBase implements OnDestroy, CanDisabl
     badgeElement.classList.add('mat-badge-content');
     badgeElement.textContent = this.content;
 
+    if (this._animationMode === 'NoopAnimations') {
+      badgeElement.classList.add('_mat-animation-noopable');
+    }
+
     if (this.description) {
       badgeElement.setAttribute('aria-label', this.description);
     }
 
     this._elementRef.nativeElement.appendChild(badgeElement);
 
     // animate in after insertion
-    if (typeof requestAnimationFrame === 'function') {
+    if (typeof requestAnimationFrame === 'function' && this._animationMode !== 'NoopAnimations') {
       this._ngZone.runOutsideAngular(() => {
         requestAnimationFrame(() => {
           badgeElement.classList.add(activeClass);

src/lib/bottom-sheet/bottom-sheet.spec.ts

@@ -669,7 +669,7 @@ describe('MatBottomSheet with default options', () => {
     dispatchKeyboardEvent(document.body, 'keydown', ESCAPE);
 
     expect(overlayContainerElement.querySelector('mat-bottom-sheet-container')).toBeTruthy();
-    expect(document.activeElement.tagName).not.toBe('INPUT');
+    expect(document.activeElement!.tagName).not.toBe('INPUT');
   });
 
   it('should be overridable by open() options', fakeAsync(() => {