Update auth compat polyfill to use composition instead of inheritance (#3900)

* Auth compat index

* Go back to old way

* Switch to compositional compat layer instead of inheritance-based

* Formatting

* Comment formatting

* Fix linter issues

* PR feedback

* Pull auth from service instead of instantiating directly

* Make compat script work (#3916)

* expose modular APIs from compat

* build compat script that works with exp packages

* Fix linter issues

Co-authored-by: Feiyang <[email protected]>

Author: sam-gc

common/api-review/auth-exp.api.md

@@ -10,6 +10,7 @@ import { ErrorFn } from '@firebase/util';
 import * as externs from '@firebase/auth-types-exp';
 import { FirebaseApp } from '@firebase/app-types-exp';
 import { FirebaseError } from '@firebase/util';
+import { NextFn } from '@firebase/util';
 import { ProviderId } from '@firebase/auth-types-exp';
 import { Unsubscribe } from '@firebase/util';
 import { UserCredential } from '@firebase/auth-types-exp';
@@ -39,17 +40,17 @@ export function applyActionCode(auth: externs.Auth, oobCode: string): Promise<vo
 // @public (undocumented)
 export class AuthCredential {
     protected constructor(providerId: string, signInMethod: string);
-    // Warning: (ae-forgotten-export) The symbol "AuthCore" needs to be exported by the entry point index.d.ts
+    // Warning: (ae-forgotten-export) The symbol "Auth" needs to be exported by the entry point index.d.ts
     // Warning: (ae-forgotten-export) The symbol "PhoneOrOauthTokenResponse" needs to be exported by the entry point index.d.ts
     //
     // (undocumented)
-    _getIdTokenResponse(_auth: AuthCore): Promise<PhoneOrOauthTokenResponse>;
+    _getIdTokenResponse(_auth: Auth_2): Promise<PhoneOrOauthTokenResponse>;
     // (undocumented)
-    _getReauthenticationResolver(_auth: AuthCore): Promise<IdTokenResponse>;
+    _getReauthenticationResolver(_auth: Auth_2): Promise<IdTokenResponse>;
     // Warning: (ae-forgotten-export) The symbol "IdTokenResponse" needs to be exported by the entry point index.d.ts
     //
     // (undocumented)
-    _linkToIdToken(_auth: AuthCore, _idToken: string): Promise<IdTokenResponse>;
+    _linkToIdToken(_auth: Auth_2, _idToken: string): Promise<IdTokenResponse>;
     // (undocumented)
     readonly providerId: string;
     // (undocumented)
@@ -90,11 +91,11 @@ export class EmailAuthCredential extends AuthCredential implements externs.AuthC
     // (undocumented)
     static fromJSON(json: object | string): EmailAuthCredential | null;
     // (undocumented)
-    _getIdTokenResponse(auth: AuthCore): Promise<IdTokenResponse>;
+    _getIdTokenResponse(auth: Auth_2): Promise<IdTokenResponse>;
     // (undocumented)
-    _getReauthenticationResolver(auth: AuthCore): Promise<IdTokenResponse>;
+    _getReauthenticationResolver(auth: Auth_2): Promise<IdTokenResponse>;
     // (undocumented)
-    _linkToIdToken(auth: AuthCore, idToken: string): Promise<IdTokenResponse>;
+    _linkToIdToken(auth: Auth_2, idToken: string): Promise<IdTokenResponse>;
     // (undocumented)
     readonly password: string;
     // (undocumented)
@@ -154,7 +155,7 @@ export function getIdTokenResult(externUser: externs.User, forceRefresh?: boolea
 export function getMultiFactorResolver(auth: externs.Auth, errorExtern: externs.MultiFactorError): externs.MultiFactorResolver;
 
 // @public (undocumented)
-export function getRedirectResult(authExtern: externs.Auth, resolverExtern: externs.PopupRedirectResolver): Promise<externs.UserCredential | null>;
+export function getRedirectResult(authExtern: externs.Auth, resolverExtern?: externs.PopupRedirectResolver): Promise<externs.UserCredential | null>;
 
 // @public (undocumented)
 export class GithubAuthProvider extends OAuthProvider {
@@ -209,10 +210,10 @@ export function linkWithCredential(userExtern: externs.User, credentialExtern: e
 export function linkWithPhoneNumber(userExtern: externs.User, phoneNumber: string, appVerifier: externs.ApplicationVerifier): Promise<externs.ConfirmationResult>;
 
 // @public (undocumented)
-export function linkWithPopup(userExtern: externs.User, provider: externs.AuthProvider, resolverExtern: externs.PopupRedirectResolver): Promise<externs.UserCredential>;
+export function linkWithPopup(userExtern: externs.User, provider: externs.AuthProvider, resolverExtern?: externs.PopupRedirectResolver): Promise<externs.UserCredential>;
 
 // @public (undocumented)
-export function linkWithRedirect(userExtern: externs.User, provider: externs.AuthProvider, resolverExtern: externs.PopupRedirectResolver): Promise<never>;
+export function linkWithRedirect(userExtern: externs.User, provider: externs.AuthProvider, resolverExtern?: externs.PopupRedirectResolver): Promise<never>;
 
 // @public (undocumented)
 export function multiFactor(user: externs.User): externs.MultiFactorUser;
@@ -228,13 +229,13 @@ export class OAuthCredential extends AuthCredential implements externs.OAuthCred
     // (undocumented)
     static _fromParams(params: OAuthCredentialParams): OAuthCredential;
     // (undocumented)
-    _getIdTokenResponse(auth: AuthCore): Promise<IdTokenResponse>;
+    _getIdTokenResponse(auth: Auth_2): Promise<IdTokenResponse>;
     // (undocumented)
-    _getReauthenticationResolver(auth: AuthCore): Promise<IdTokenResponse>;
+    _getReauthenticationResolver(auth: Auth_2): Promise<IdTokenResponse>;
     // (undocumented)
     idToken?: string;
     // (undocumented)
-    _linkToIdToken(auth: AuthCore, idToken: string): Promise<IdTokenResponse>;
+    _linkToIdToken(auth: Auth_2, idToken: string): Promise<IdTokenResponse>;
     // (undocumented)
     nonce?: string;
     // (undocumented)
@@ -288,11 +289,11 @@ export class PhoneAuthCredential extends AuthCredential implements externs.Phone
     // (undocumented)
     static _fromVerification(verificationId: string, verificationCode: string): PhoneAuthCredential;
     // (undocumented)
-    _getIdTokenResponse(auth: AuthCore): Promise<PhoneOrOauthTokenResponse>;
+    _getIdTokenResponse(auth: Auth_2): Promise<PhoneOrOauthTokenResponse>;
     // (undocumented)
-    _getReauthenticationResolver(auth: AuthCore): Promise<IdTokenResponse>;
+    _getReauthenticationResolver(auth: Auth_2): Promise<IdTokenResponse>;
     // (undocumented)
-    _linkToIdToken(auth: AuthCore, idToken: string): Promise<IdTokenResponse>;
+    _linkToIdToken(auth: Auth_2, idToken: string): Promise<IdTokenResponse>;
     // Warning: (ae-forgotten-export) The symbol "SignInWithPhoneNumberRequest" needs to be exported by the entry point index.d.ts
     //
     // (undocumented)
@@ -303,7 +304,7 @@ export class PhoneAuthCredential extends AuthCredential implements externs.Phone
 
 // @public (undocumented)
 export class PhoneAuthProvider implements externs.PhoneAuthProvider {
-    constructor(auth: AuthCore);
+    constructor(auth: externs.Auth);
     // (undocumented)
     static credential(verificationId: string, verificationCode: string): PhoneAuthCredential;
     // (undocumented)
@@ -331,17 +332,17 @@ export function reauthenticateWithCredential(userExtern: externs.User, credentia
 export function reauthenticateWithPhoneNumber(userExtern: externs.User, phoneNumber: string, appVerifier: externs.ApplicationVerifier): Promise<externs.ConfirmationResult>;
 
 // @public (undocumented)
-export function reauthenticateWithPopup(userExtern: externs.User, provider: externs.AuthProvider, resolverExtern: externs.PopupRedirectResolver): Promise<externs.UserCredential>;
+export function reauthenticateWithPopup(userExtern: externs.User, provider: externs.AuthProvider, resolverExtern?: externs.PopupRedirectResolver): Promise<externs.UserCredential>;
 
 // @public (undocumented)
-export function reauthenticateWithRedirect(userExtern: externs.User, provider: externs.AuthProvider, resolverExtern: externs.PopupRedirectResolver): Promise<never>;
+export function reauthenticateWithRedirect(userExtern: externs.User, provider: externs.AuthProvider, resolverExtern?: externs.PopupRedirectResolver): Promise<never>;
 
 // Warning: (ae-forgotten-export) The symbol "ApplicationVerifier" needs to be exported by the entry point index.d.ts
 //
 // @public (undocumented)
 export class RecaptchaVerifier implements externs.RecaptchaVerifier, ApplicationVerifier {
     // Warning: (ae-forgotten-export) The symbol "Parameters" needs to be exported by the entry point index.d.ts
-    constructor(containerOrId: HTMLElement | string, parameters: Parameters_2, auth: AuthCore);
+    constructor(containerOrId: HTMLElement | string, parameters: Parameters_2, authExtern: externs.Auth);
     // (undocumented)
     clear(): void;
     // Warning: (ae-forgotten-export) The symbol "ReCaptchaLoader" needs to be exported by the entry point index.d.ts
@@ -392,10 +393,10 @@ export function signInWithEmailLink(auth: externs.Auth, email: string, emailLink
 export function signInWithPhoneNumber(auth: externs.Auth, phoneNumber: string, appVerifier: externs.ApplicationVerifier): Promise<externs.ConfirmationResult>;
 
 // @public (undocumented)
-export function signInWithPopup(auth: externs.Auth, provider: externs.AuthProvider, resolverExtern: externs.PopupRedirectResolver): Promise<externs.UserCredential>;
+export function signInWithPopup(authExtern: externs.Auth, provider: externs.AuthProvider, resolverExtern?: externs.PopupRedirectResolver): Promise<externs.UserCredential>;
 
 // @public (undocumented)
-export function signInWithRedirect(auth: externs.Auth, provider: externs.AuthProvider, resolverExtern: externs.PopupRedirectResolver): Promise<never>;
+export function signInWithRedirect(authExtern: externs.Auth, provider: externs.AuthProvider, resolverExtern?: externs.PopupRedirectResolver): Promise<never>;
 
 // @public (undocumented)
 export function signOut(auth: externs.Auth): Promise<void>;

packages-exp/app-compat/src/firebaseNamespaceCore.ts

@@ -26,15 +26,7 @@ import {
   FirebaseService,
   FirebaseServiceNamespace
 } from '@firebase/app-types/private';
-import {
-  SDK_VERSION,
-  initializeApp,
-  registerVersion,
-  onLog,
-  setLogLevel,
-  _registerComponent,
-  _DEFAULT_ENTRY_NAME
-} from '@firebase/app-exp';
+import * as modularAPIs from '@firebase/app-exp';
 import { _FirebaseAppInternal } from '@firebase/app-types-exp';
 import { Component, ComponentType } from '@firebase/component';
 
@@ -66,16 +58,17 @@ export function createFirebaseNamespaceCore(
     initializeApp: initializeAppCompat,
     // @ts-ignore
     app,
-    registerVersion,
-    setLogLevel,
-    onLog,
+    registerVersion: modularAPIs.registerVersion,
+    setLogLevel: modularAPIs.setLogLevel,
+    onLog: modularAPIs.onLog,
     // @ts-ignore
     apps: null,
-    SDK_VERSION,
+    SDK_VERSION: modularAPIs.SDK_VERSION,
     INTERNAL: {
       registerComponent: registerComponentCompat,
       removeApp,
-      useAsService
+      useAsService,
+      modularAPIs
     }
   };
 
@@ -109,7 +102,7 @@ export function createFirebaseNamespaceCore(
    * Get the App object for a given name (or DEFAULT).
    */
   function app(name?: string): FirebaseApp {
-    name = name || _DEFAULT_ENTRY_NAME;
+    name = name || modularAPIs._DEFAULT_ENTRY_NAME;
     if (!contains(apps, name)) {
       throw ERROR_FACTORY.create(AppError.NO_APP, { appName: name });
     }
@@ -126,7 +119,10 @@ export function createFirebaseNamespaceCore(
     options: FirebaseOptions,
     rawConfig = {}
   ): FirebaseApp {
-    const app = initializeApp(options, rawConfig) as _FirebaseAppInternal;
+    const app = modularAPIs.initializeApp(
+      options,
+      rawConfig
+    ) as _FirebaseAppInternal;
     const appCompat = new firebaseAppImpl(app, namespace as _FirebaseNamespace);
     apps[app.name] = appCompat;
     return appCompat;
@@ -145,7 +141,7 @@ export function createFirebaseNamespaceCore(
   ): FirebaseServiceNamespace<FirebaseService> | null {
     const componentName = component.name;
     if (
-      _registerComponent(component) &&
+      modularAPIs._registerComponent(component) &&
       component.type === ComponentType.PUBLIC
     ) {
       // create service namespace for public components

packages-exp/auth-compat-exp/demo/package.json

@@ -10,11 +10,11 @@
     "lint:fix": "eslint --fix -c .eslintrc.js '**/*.ts' --ignore-path '../../../.gitignore'",
     "demo": "rollup -c && firebase serve",
     "build": "rollup -c",
-    "build:deps": "lerna run --scope @firebase/'{app-exp,auth-compat-exp}' --include-dependencies build",
+    "build:deps": "lerna run --scope @firebase/'{app-compat,app-exp,auth-compat-exp}' --include-dependencies build",
     "dev": "rollup -c -w"
   },
   "peerDependencies": {
-    "@firebase/app": "0.x",
+    "@firebase/app-compat": "0.x",
     "@firebase/auth-types": "0.x",
     "@firebase/auth-exp": "0.x"
   },

packages-exp/auth-compat-exp/demo/rollup.config.js

@@ -41,7 +41,7 @@ const umdBuilds = [
    * App UMD Builds
    */
   {
-    input: '../../../packages/firebase/app/index.ts',
+    input: '../../firebase-exp/compat/app/index.ts',
     output: {
       file: 'public/dist/firebase-app.js',
       sourcemap: true,
@@ -59,7 +59,8 @@ const umdBuilds = [
       extend: true,
       name: 'firebase',
       globals: {
-        '@firebase/app': 'firebase'
+        '@firebase/app-compat': 'firebase',
+        '@firebase/app-exp': 'firebase.INTERNAL.modularAPIs'
       },
       /**
        * use iife to avoid below error in the old Safari browser
@@ -81,7 +82,7 @@ const umdBuilds = [
           }`
     },
     plugins: [...plugins],
-    external: ['@firebase/app']
+    external: ['@firebase/app-compat', '@firebase/app-exp']
   }
 ];
 

packages-exp/auth-compat-exp/index.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import firebase from '@firebase/app';
+import firebase from '@firebase/app-compat';
 import { _FirebaseNamespace } from '@firebase/app-types/private';
 import * as impl from '@firebase/auth-exp/internal';
 import * as externs from '@firebase/auth-types-exp';
@@ -28,20 +28,23 @@ import {
 import { version } from './package.json';
 import { Auth } from './src/auth';
 import { Persistence } from './src/persistence';
+import { PhoneAuthProvider } from './src/phone_auth_provider';
+import { _getClientPlatform } from './src/platform';
 import { RecaptchaVerifier } from './src/recaptcha_verifier';
 
 const AUTH_TYPE = 'auth';
 
 // Create auth components to register with firebase.
 // Provides Auth public APIs.
-function registerAuth(instance: _FirebaseNamespace): void {
+function registerAuthCompat(instance: _FirebaseNamespace): void {
   instance.INTERNAL.registerComponent(
     new Component(
       AUTH_TYPE,
       container => {
         // getImmediate for FirebaseApp will always succeed
         const app = container.getProvider('app').getImmediate();
-        return new Auth(app);
+        const auth = container.getProvider('auth-exp').getImmediate();
+        return new Auth(app, auth as impl.AuthImpl);
       },
       ComponentType.PUBLIC
     )
@@ -63,7 +66,7 @@ function registerAuth(instance: _FirebaseNamespace): void {
         GoogleAuthProvider: impl.GoogleAuthProvider,
         OAuthProvider: impl.OAuthProvider,
         //   SAMLAuthProvider,
-        PhoneAuthProvider: impl.PhoneAuthProvider,
+        PhoneAuthProvider,
         PhoneMultiFactorGenerator: impl.PhoneMultiFactorGenerator,
         RecaptchaVerifier,
         TwitterAuthProvider: impl.TwitterAuthProvider,
@@ -80,4 +83,5 @@ function registerAuth(instance: _FirebaseNamespace): void {
   instance.registerVersion('auth', version);
 }
 
-registerAuth(firebase as _FirebaseNamespace);
+impl.registerAuth(_getClientPlatform());
+registerAuthCompat(firebase as _FirebaseNamespace);

packages-exp/auth-compat-exp/package.json

@@ -25,7 +25,7 @@
     "prepare": "yarn build"
   },
   "peerDependencies": {
-    "@firebase/app": "0.x",
+    "@firebase/app-compat": "0.x",
     "@firebase/app-types": "0.x"
   },
   "dependencies": {
@@ -38,7 +38,7 @@
   },
   "license": "Apache-2.0",
   "devDependencies": {
-    "@firebase/app": "0.6.11",
+    "@firebase/app-compat": "0.x",
     "rollup": "2.29.0",
     "rollup-plugin-json": "4.0.0",
     "rollup-plugin-replace": "2.2.0",

packages-exp/auth-compat-exp/rollup.config.js

@@ -73,7 +73,7 @@ const es5Builds = [
       extend: true,
       name: 'firebase',
       globals: {
-        '@firebase/app': 'firebase'
+        '@firebase/app-compat': 'firebase'
       },
       /**
        * use iife to avoid below error in the old Safari browser
@@ -95,7 +95,7 @@ const es5Builds = [
           }`
     },
     plugins: [...es5BuildPlugins, uglify()],
-    external: ['@firebase/app']
+    external: ['@firebase/app-compat']
   }
 ];