Migrate analytics to component platform (#220)

* migrate analytics

* minor analytics refactoring

* interface merge

* [AUTOMATED]: Prettier Code Styling

* [AUTOMATED]: License Headers

Author: Feiyang1

packages/analytics-interop-types/README.md

@@ -0,0 +1,3 @@
+# @firebase/analytics-interop-types
+
+**This package is not intended for direct usage, and should only be used via the officially supported [firebase](https://www.npmjs.com/package/firebase) package.**

packages/analytics-interop-types/index.d.ts

@@ -0,0 +1,50 @@
+/**
+ * @license
+ * Copyright 2019 Google Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export interface FirebaseAnalyticsInternal {
+  /**
+   * Sends analytics event with given `eventParams`. This method
+   * automatically associates this logged event with this Firebase web
+   * app instance on this device.
+   * List of official event parameters can be found in
+   * {@link https://developers.google.com/gtagjs/reference/event
+   * the gtag.js reference documentation}.
+   */
+  logEvent(
+    eventName: string,
+    eventParams?: { [key: string]: unknown },
+    options?: AnalyticsCallOptions
+  ): void;
+}
+
+export interface AnalyticsCallOptions {
+  /**
+   * If true, this config or event call applies globally to all
+   * analytics properties on the page.
+   */
+  global: boolean;
+}
+
+declare module '@firebase/component' {
+  interface ComponentContainer {
+    getProvider(
+      name: 'analytics-internal'
+    ): Provider<FirebaseAnalyticsInternal>;
+  }
+
+  interface Provider<T> {}
+}

packages/analytics-interop-types/package.json

@@ -0,0 +1,24 @@
+{
+  "name": "@firebase/analytics-interop-types",
+  "version": "0.1.0",
+  "description": "@firebase/analytics Types",
+  "author": "Firebase <[email protected]> (https://firebase.google.com/)",
+  "license": "Apache-2.0",
+  "scripts": {
+    "test": "tsc"
+  },
+  "files": [
+    "index.d.ts"
+  ],
+  "repository": {
+    "directory": "packages/analytics-interop-types",
+    "type": "git",
+    "url": "https://github.com/firebase/firebase-js-sdk.git"
+  },
+  "bugs": {
+    "url": "https://github.com/firebase/firebase-js-sdk/issues"
+  },
+  "devDependencies": {
+    "typescript": "3.6.4"
+  }
+}

packages/analytics-interop-types/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "../../config/tsconfig.base.json",
+  "compilerOptions": {
+    "noEmit": true
+  },
+  "exclude": [
+    "dist/**/*"
+  ]
+}

packages/analytics/index.test.ts

@@ -41,12 +41,12 @@ const customDataLayerName = 'customDataLayer';
 describe('FirebaseAnalytics instance tests', () => {
   it('Throws if no analyticsId in config', () => {
     const app = getFakeApp();
-    expect(() => analyticsFactory(app, () => {})).to.throw('field is empty');
+    expect(() => analyticsFactory(app)).to.throw('field is empty');
   });
   it('Throws if creating an instance with already-used analytics ID', () => {
     const app = getFakeApp(analyticsId);
     resetGlobalVars(false, { [analyticsId]: Promise.resolve() });
-    expect(() => analyticsFactory(app, () => {})).to.throw('already exists');
+    expect(() => analyticsFactory(app)).to.throw('already exists');
   });
   describe('Standard app, page already has user gtag script', () => {
     let app: FirebaseApp = {} as FirebaseApp;
@@ -55,7 +55,7 @@ describe('FirebaseAnalytics instance tests', () => {
       app = getFakeApp(analyticsId);
       window['gtag'] = gtagStub;
       window['dataLayer'] = [];
-      analyticsInstance = analyticsFactory(app, () => {});
+      analyticsInstance = analyticsFactory(app);
     });
     after(() => {
       delete window['gtag'];
@@ -121,7 +121,7 @@ describe('FirebaseAnalytics instance tests', () => {
         dataLayerName: customDataLayerName,
         gtagName: customGtagName
       });
-      analyticsInstance = analyticsFactory(app, () => {});
+      analyticsInstance = analyticsFactory(app);
     });
     after(() => {
       delete window[customGtagName];
@@ -164,7 +164,7 @@ describe('FirebaseAnalytics instance tests', () => {
     before(() => {
       resetGlobalVars();
       const app = getFakeApp(analyticsId);
-      analyticsInstance = analyticsFactory(app, () => {});
+      analyticsInstance = analyticsFactory(app);
     });
     after(() => {
       delete window['gtag'];

packages/analytics/index.ts

@@ -16,12 +16,11 @@
  */
 import firebase from '@firebase/app';
 import { FirebaseAnalytics } from '@firebase/analytics-types';
-import {
-  FirebaseServiceFactory,
-  _FirebaseNamespace
-} from '@firebase/app-types/private';
+import { _FirebaseNamespace } from '@firebase/app-types/private';
 import { factory, settings, resetGlobalVars } from './src/factory';
 import { EventName } from './src/constants';
+import { Component, ComponentType } from '@firebase/component';
+import { ERROR_FACTORY, AnalyticsError } from './src/errors';
 
 declare global {
   interface Window {
@@ -35,17 +34,41 @@ declare global {
 const ANALYTICS_TYPE = 'analytics';
 
 export function registerAnalytics(instance: _FirebaseNamespace): void {
-  instance.INTERNAL.registerService(
-    ANALYTICS_TYPE,
-    factory as FirebaseServiceFactory,
-    {
+  instance.INTERNAL.registerComponent(
+    new Component(
+      ANALYTICS_TYPE,
+      container => {
+        // getImmediate for FirebaseApp will always succeed
+        const app = container.getProvider('app').getImmediate()!;
+        return factory(app);
+      },
+      ComponentType.PUBLIC
+    ).setServiceProps({
       settings,
       EventName
-    },
-    // We don't need to wait on any AppHooks.
-    undefined,
-    // Allow multiple analytics instances per app.
-    false
+    })
+  );
+
+  instance.INTERNAL.registerComponent(
+    new Component(
+      'analytics-internal',
+      container => {
+        try {
+          const analytics = container
+            .getProvider(ANALYTICS_TYPE)
+            .getImmediate();
+          return {
+            logEvent: analytics.logEvent
+          };
+        } catch (e) {
+          throw ERROR_FACTORY.create(
+            AnalyticsError.INTEROP_COMPONENT_REG_FAILED,
+            { reason: e }
+          );
+        }
+      },
+      ComponentType.PRIVATE
+    )
   );
 }
 
@@ -64,3 +87,11 @@ declare module '@firebase/app-types' {
     analytics(): FirebaseAnalytics;
   }
 }
+
+declare module '@firebase/component' {
+  interface ComponentContainer {
+    getProvider(name: typeof ANALYTICS_TYPE): Provider<FirebaseAnalytics>;
+  }
+
+  interface Provider<T> {}
+}

packages/analytics/package.json

@@ -25,6 +25,7 @@
   "dependencies": {
     "@firebase/analytics-types": "0.2.1",
     "@firebase/installations": "0.3.0",
+    "@firebase/component": "0.1.0",
     "@firebase/util": "0.2.29",
     "tslib": "1.10.0"
   },

packages/analytics/src/errors.ts

@@ -21,7 +21,8 @@ import { ANALYTICS_ID_FIELD } from './constants';
 export const enum AnalyticsError {
   NO_GA_ID = 'no-ga-id',
   ALREADY_EXISTS = 'already-exists',
-  ALREADY_INITIALIZED = 'already-initialized'
+  ALREADY_INITIALIZED = 'already-initialized',
+  INTEROP_COMPONENT_REG_FAILED = 'interop-component-reg-failed'
 }
 
 const ERRORS: ErrorMap<AnalyticsError> = {
@@ -36,11 +37,14 @@ const ERRORS: ErrorMap<AnalyticsError> = {
   [AnalyticsError.ALREADY_INITIALIZED]:
     'Firebase Analytics has already been initialized.' +
     'settings() must be called before initializing any Analytics instance' +
-    'or it will have no effect.'
+    'or it will have no effect.',
+  [AnalyticsError.INTEROP_COMPONENT_REG_FAILED]:
+    'Firebase Analytics Interop Component failed to instantiate'
 };
 
 interface ErrorParams {
   [AnalyticsError.ALREADY_EXISTS]: { id: string };
+  [AnalyticsError.INTEROP_COMPONENT_REG_FAILED]: { reason: Error };
 }
 
 export const ERROR_FACTORY = new ErrorFactory<AnalyticsError, ErrorParams>(

packages/analytics/src/factory.ts

@@ -15,7 +15,6 @@
  * limitations under the License.
  */
 
-import { FirebaseApp } from '@firebase/app-types';
 import {
   FirebaseAnalytics,
   Gtag,
@@ -38,6 +37,7 @@ import {
 } from './helpers';
 import { ANALYTICS_ID_FIELD } from './constants';
 import { AnalyticsError, ERROR_FACTORY } from './errors';
+import { FirebaseApp } from '@firebase/app-types';
 
 /**
  * Maps gaId to FID fetch promises.
@@ -102,11 +102,7 @@ export function settings(options: SettingsOptions): void {
   }
 }
 
-export function factory(
-  app: FirebaseApp,
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  extendApp: (props: { [prop: string]: any }) => void
-): FirebaseAnalytics {
+export function factory(app: FirebaseApp): FirebaseAnalytics {
   if (!app.options[ANALYTICS_ID_FIELD]) {
     throw ERROR_FACTORY.create(AnalyticsError.NO_GA_ID);
   }
@@ -162,13 +158,5 @@ export function factory(
       setAnalyticsCollectionEnabled(app.options[ANALYTICS_ID_FIELD], enabled)
   };
 
-  extendApp({
-    INTERNAL: {
-      analytics: {
-        logEvent: analyticsInstance.logEvent
-      }
-    }
-  });
-
   return analyticsInstance;
 }