Reorder recaptchaVerifier params so auth is the first param

Author: ch5zzy

common/api-review/auth.api.md

@@ -681,7 +681,7 @@ export interface RecaptchaParameters {
 //
 // @public
 export class RecaptchaVerifier implements ApplicationVerifierInternal {
-    constructor(containerOrId: HTMLElement | string, parameters: RecaptchaParameters, authExtern: Auth);
+    constructor(authExtern: Auth, containerOrId: HTMLElement | string, parameters?: RecaptchaParameters);
     clear(): void;
     // Warning: (ae-forgotten-export) The symbol "ReCaptchaLoader" needs to be exported by the entry point index.d.ts
     //

packages/auth-compat/src/recaptcha_verifier.ts

@@ -37,13 +37,12 @@ export class RecaptchaVerifier
       appName: app.name
     });
     this._delegate = new exp.RecaptchaVerifier(
-      container,
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      parameters as any,
-
       // TODO: remove ts-ignore when moving types from auth-types to auth-compat
       // @ts-ignore
-      app.auth!()
+      app.auth!(),
+      container,
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      parameters as any
     );
     this.type = this._delegate.type;
   }

packages/auth/src/platform_browser/providers/phone.test.ts

@@ -45,9 +45,9 @@ describe('platform_browser/providers/phone', () => {
       });
 
       const verifier = new RecaptchaVerifier(
+        auth,
         document.createElement('div'),
-        {},
-        auth
+        {}
       );
       sinon
         .stub(verifier, 'verify')

packages/auth/src/platform_browser/recaptcha/recaptcha_verifier.test.ts

@@ -50,7 +50,7 @@ describe('platform_browser/recaptcha/recaptcha_verifier', () => {
     auth.languageCode = 'fr';
     container = document.createElement('div');
     parameters = {};
-    verifier = new RecaptchaVerifier(container, parameters, auth);
+    verifier = new RecaptchaVerifier(auth, container, parameters);
     // The verifier will have set the parameters.callback field to be the wrapped callback
 
     mockEndpoint(Endpoint.GET_RECAPTCHA_PARAM, {
@@ -134,7 +134,7 @@ describe('platform_browser/recaptcha/recaptcha_verifier', () => {
         }
       };
 
-      verifier = new RecaptchaVerifier(container, parameters, auth);
+      verifier = new RecaptchaVerifier(auth, container, parameters);
       const expected = await verifier.verify();
       expect(token).to.eq(expected);
     });
@@ -149,7 +149,7 @@ describe('platform_browser/recaptcha/recaptcha_verifier', () => {
         callback: 'callbackOnWindowObject'
       };
 
-      verifier = new RecaptchaVerifier(container, parameters, auth);
+      verifier = new RecaptchaVerifier(auth, container, parameters);
       const expected = await verifier.verify();
       expect(token).to.eq(expected);
 

packages/auth/src/platform_browser/recaptcha/recaptcha_verifier.ts

@@ -67,6 +67,13 @@ export class RecaptchaVerifier implements ApplicationVerifierInternal {
   private recaptcha: Recaptcha | null = null;
 
   /**
+   * @remarks
+   * Check the reCAPTCHA docs for a comprehensive list. All parameters are accepted except for
+   * the sitekey. Firebase Auth backend provisions a reCAPTCHA for each project and will
+   * configure this upon rendering. For an invisible reCAPTCHA, a size key must have the value
+   * 'invisible'.
+   *
+   * @param authExtern - The corresponding Firebase {@link Auth} instance.
    *
    * @param containerOrId - The reCAPTCHA container parameter.
    *
@@ -77,21 +84,13 @@ export class RecaptchaVerifier implements ApplicationVerifierInternal {
    * initialization.
    *
    * @param parameters - The optional reCAPTCHA parameters.
-   *
-   * @remarks
-   * Check the reCAPTCHA docs for a comprehensive list. All parameters are accepted except for
-   * the sitekey. Firebase Auth backend provisions a reCAPTCHA for each project and will
-   * configure this upon rendering. For an invisible reCAPTCHA, a size key must have the value
-   * 'invisible'.
-   *
-   * @param authExtern - The corresponding Firebase {@link Auth} instance.
    */
   constructor(
+    authExtern: Auth,
     containerOrId: HTMLElement | string,
     private readonly parameters: RecaptchaParameters = {
       ...DEFAULT_PARAMS
-    },
-    authExtern: Auth
+    }
   ) {
     this.auth = _castAuth(authExtern);
     this.isInvisible = this.parameters.size === 'invisible';

packages/auth/src/platform_browser/strategies/phone.test.ts

@@ -60,7 +60,7 @@ describe('platform_browser/strategies/phone', () => {
       sessionInfo: 'session-info'
     });
 
-    verifier = new RecaptchaVerifier(document.createElement('div'), {}, auth);
+    verifier = new RecaptchaVerifier(auth, document.createElement('div'), {});
     sinon.stub(verifier, 'verify').returns(Promise.resolve('recaptcha-token'));
   });
 

packages/auth/test/integration/flows/phone.test.ts

@@ -73,9 +73,9 @@ describe('Integration test: phone auth', () => {
     fakeRecaptchaContainer = document.createElement('div');
     document.body.appendChild(fakeRecaptchaContainer);
     verifier = new RecaptchaVerifier(
+      auth,
       fakeRecaptchaContainer,
-      undefined as any,
-      auth
+      undefined as any
     );
   });
 
@@ -87,9 +87,9 @@ describe('Integration test: phone auth', () => {
   function resetVerifier(): void {
     verifier.clear();
     verifier = new RecaptchaVerifier(
+      auth,
       fakeRecaptchaContainer,
-      undefined as any,
-      auth
+      undefined as any
     );
   }