fix(checkbox): disable animations when using NoopAnimationsModule (#11249)

* Disables all checkbox animations when using the `NoopAnimationsModule`. Doesn't include ripples which were done in #11205.
* Removes a method that was only used once and inlines the logic.

Author: crisbeto

src/lib/checkbox/checkbox.scss

@@ -3,6 +3,7 @@
 @import '../core/style/checkbox-common';
 @import '../core/ripple/ripple';
 @import '../core/style/layout-common';
+@import '../core/style/noop-animation';
 
 // Manual calculation done on SVG
 $_mat-checkbox-mark-path-length: 22.910259;
@@ -179,6 +180,8 @@ $_mat-checkbox-mark-stroke-size: 2 / 15 * $mat-checkbox-size !default;
 }
 
 .mat-checkbox {
+  @include _noop-animation();
+
   // Animation
   transition: background $swift-ease-out-duration $swift-ease-out-timing-function,
               mat-elevation-transition-property-value();
@@ -234,6 +237,10 @@ $_mat-checkbox-mark-stroke-size: 2 / 15 * $mat-checkbox-size !default;
     width: $mat-checkbox-border-width;
     style: solid;
   }
+
+  ._mat-animation-noopable & {
+    transition: none;
+  }
 }
 
 .mat-checkbox-background {
@@ -245,6 +252,10 @@ $_mat-checkbox-mark-stroke-size: 2 / 15 * $mat-checkbox-size !default;
   transition: background-color $mat-checkbox-transition-duration
                   $mat-linear-out-slow-in-timing-function,
               opacity $mat-checkbox-transition-duration $mat-linear-out-slow-in-timing-function;
+
+  ._mat-animation-noopable & {
+    transition: none;
+  }
 }
 
 .mat-checkbox-checkmark {

src/lib/checkbox/checkbox.ts

@@ -39,6 +39,7 @@ import {
   RippleRef,
 } from '@angular/material/core';
 import {MAT_CHECKBOX_CLICK_ACTION, MatCheckboxClickAction} from './checkbox-config';
+import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations';
 
 
 // Increasing integer for generating unique ids for checkbox components.
@@ -108,6 +109,7 @@ export const _MatCheckboxMixinBase =
     '[class.mat-checkbox-checked]': 'checked',
     '[class.mat-checkbox-disabled]': 'disabled',
     '[class.mat-checkbox-label-before]': 'labelPosition == "before"',
+    '[class._mat-animation-noopable]': `_animationMode === 'NoopAnimations'`,
   },
   providers: [MAT_CHECKBOX_CONTROL_VALUE_ACCESSOR],
   inputs: ['disableRipple', 'color', 'tabIndex'],
@@ -184,7 +186,8 @@ export class MatCheckbox extends _MatCheckboxMixinBase implements ControlValueAc
               private _focusMonitor: FocusMonitor,
               @Attribute('tabindex') tabIndex: string,
               @Optional() @Inject(MAT_CHECKBOX_CLICK_ACTION)
-                  private _clickAction: MatCheckboxClickAction) {
+                  private _clickAction: MatCheckboxClickAction,
+              @Optional() @Inject(ANIMATION_MODULE_TYPE) public _animationMode?: string) {
     super(elementRef);
 
     this.tabIndex = parseInt(tabIndex) || 0;
@@ -322,7 +325,11 @@ export class MatCheckbox extends _MatCheckboxMixinBase implements ControlValueAc
     if (!this._focusRipple && focusOrigin === 'keyboard') {
       this._focusRipple = this.ripple.launch(0, 0, {persistent: true});
     } else if (!focusOrigin) {
-      this._removeFocusRipple();
+      if (this._focusRipple) {
+        this._focusRipple.fadeOut();
+        this._focusRipple = null;
+      }
+
       this._onTouched();
     }
   }
@@ -390,6 +397,11 @@ export class MatCheckbox extends _MatCheckboxMixinBase implements ControlValueAc
 
   private _getAnimationClassForCheckStateTransition(
       oldState: TransitionCheckState, newState: TransitionCheckState): string {
+    // Don't transition if animations are disabled.
+    if (this._animationMode === 'NoopAnimations') {
+      return '';
+    }
+
     let animSuffix: string = '';
 
     switch (oldState) {
@@ -420,12 +432,4 @@ export class MatCheckbox extends _MatCheckboxMixinBase implements ControlValueAc
 
     return `mat-checkbox-anim-${animSuffix}`;
   }
-
-  /** Fades out the focus state ripple. */
-  private _removeFocusRipple(): void {
-    if (this._focusRipple) {
-      this._focusRipple.fadeOut();
-      this._focusRipple = null;
-    }
-  }
 }