fix(animations): only use the WA-polyfill alongside AnimationBuilder (#22143)

This patch removes the need to include the Web Animations API Polyfill
(web-animations-js) as a dependency. Angular will now fallback to using
CSS Keyframes in the event that `element.animate` is no longer supported
by the browser.

In the event that an application does use `AnimationBuilder` then the
web-animations-js polyfill is required to enable programmatic,
position-based access to an animation.

Closes #17496

PR Close #22143

packages/animations/browser/src/util.ts

@@ -235,6 +235,30 @@ export function allowPreviousPlayerStylesMerge(duration: number, delay: number)
   return duration === 0 || delay === 0;
 }
 
+export function balancePreviousStylesIntoKeyframes(
+    element: any, keyframes: {[key: string]: any}[], previousStyles: {[key: string]: any}) {
+  const previousStyleProps = Object.keys(previousStyles);
+  if (previousStyleProps.length && keyframes.length) {
+    let startingKeyframe = keyframes[0];
+    let missingStyleProps: string[] = [];
+    previousStyleProps.forEach(prop => {
+      if (!startingKeyframe.hasOwnProperty(prop)) {
+        missingStyleProps.push(prop);
+      }
+      startingKeyframe[prop] = previousStyles[prop];
+    });
+
+    if (missingStyleProps.length) {
+      // tslint:disable-next-line
+      for (var i = 1; i < keyframes.length; i++) {
+        let kf = keyframes[i];
+        missingStyleProps.forEach(function(prop) { kf[prop] = computeStyle(element, prop); });
+      }
+    }
+  }
+  return keyframes;
+}
+
 export function visitDslNode(
     visitor: AnimationDslVisitor, node: AnimationMetadata, context: any): any;
 export function visitDslNode(
@@ -271,3 +295,7 @@ export function visitDslNode(visitor: any, node: any, context: any): any {
       throw new Error(`Unable to resolve animation metadata node #${node.type}`);
   }
 }
+
+export function computeStyle(element: any, prop: string): string {
+  return (<any>window.getComputedStyle(element))[prop];
+}