[SG-656] Use a captcha bypass during registration (#3531)

* Use a captcha bypass during registration

The trial initiation flow has a registration step that automatically
does a login in the background. This has Captcha problems, namely that
it can spawn two captchas in a row - one during registration and one
during login. This is not ideal UX, so we've added a bypass token that
returns from the registration endpoint that can be used to skip the next
captcha.

* [review] Introduce ICaptcheProtectedResponse

libs/angular/src/components/register.component.ts

@@ -21,6 +21,7 @@ import { PasswordLogInCredentials } from "@bitwarden/common/models/domain/logInC
 import { KeysRequest } from "@bitwarden/common/models/request/keysRequest";
 import { ReferenceEventRequest } from "@bitwarden/common/models/request/referenceEventRequest";
 import { RegisterRequest } from "@bitwarden/common/models/request/registerRequest";
+import { RegisterResponse } from "@bitwarden/common/models/response/authentication/registerResponse";
 
 import { PasswordColorText } from "../shared/components/password-strength/password-strength.component";
 
@@ -32,7 +33,7 @@ export class RegisterComponent extends CaptchaProtectedComponent implements OnIn
   @Output() createdAccount = new EventEmitter<string>();
 
   showPassword = false;
-  formPromise: Promise<any>;
+  formPromise: Promise<RegisterResponse>;
   referenceData: ReferenceEventRequest;
   showTerms = true;
   showErrorSummary = false;
@@ -70,6 +71,8 @@ export class RegisterComponent extends CaptchaProtectedComponent implements OnIn
 
   protected accountCreated = false;
 
+  protected captchaBypassToken: string = null;
+
   constructor(
     protected formValidationErrorService: FormValidationErrorsService,
     protected formBuilder: UntypedFormBuilder,
@@ -107,6 +110,7 @@ export class RegisterComponent extends CaptchaProtectedComponent implements OnIn
         if (!registerResponse.successful) {
           return;
         }
+        this.captchaBypassToken = registerResponse.captchaBypassToken;
         this.accountCreated = true;
       }
       if (this.isInTrialFlow) {
@@ -117,7 +121,7 @@ export class RegisterComponent extends CaptchaProtectedComponent implements OnIn
             this.i18nService.t("trialAccountCreated")
           );
         }
-        const loginResponse = await this.logIn(email, masterPassword, this.captchaToken);
+        const loginResponse = await this.logIn(email, masterPassword, this.captchaBypassToken);
         if (loginResponse.captchaRequired) {
           return;
         }
@@ -258,14 +262,14 @@ export class RegisterComponent extends CaptchaProtectedComponent implements OnIn
   private async registerAccount(
     request: RegisterRequest,
     showToast: boolean
-  ): Promise<{ successful: boolean }> {
+  ): Promise<{ successful: boolean; captchaBypassToken?: string }> {
     if (!(await this.validateRegistration(showToast)).isValid) {
       return { successful: false };
     }
     this.formPromise = this.apiService.postRegister(request);
     try {
-      await this.formPromise;
-      return { successful: true };
+      const response = await this.formPromise;
+      return { successful: true, captchaBypassToken: response.captchaBypassToken };
     } catch (e) {
       if (this.handleCaptchaRequired(e)) {
         return { successful: false };

libs/common/src/abstractions/api.service.ts

@@ -96,6 +96,7 @@ import { VerifyEmailRequest } from "../models/request/verifyEmailRequest";
 import { ApiKeyResponse } from "../models/response/apiKeyResponse";
 import { AttachmentResponse } from "../models/response/attachmentResponse";
 import { AttachmentUploadDataResponse } from "../models/response/attachmentUploadDataResponse";
+import { RegisterResponse } from "../models/response/authentication/registerResponse";
 import { BillingHistoryResponse } from "../models/response/billingHistoryResponse";
 import { BillingPaymentResponse } from "../models/response/billingPaymentResponse";
 import { BillingResponse } from "../models/response/billingResponse";
@@ -208,7 +209,7 @@ export abstract class ApiService {
   postSecurityStamp: (request: SecretVerificationRequest) => Promise<any>;
   getAccountRevisionDate: () => Promise<number>;
   postPasswordHint: (request: PasswordHintRequest) => Promise<any>;
-  postRegister: (request: RegisterRequest) => Promise<any>;
+  postRegister: (request: RegisterRequest) => Promise<RegisterResponse>;
   postPremium: (data: FormData) => Promise<PaymentResponse>;
   postIapCheck: (request: IapCheckRequest) => Promise<any>;
   postReinstatePremium: () => Promise<any>;

libs/common/src/models/response/authentication/ICaptchaProtectedResponse.ts

@@ -0,0 +1,3 @@
+export interface ICaptchaProtectedResponse {
+  captchaBypassToken: string;
+}

libs/common/src/models/response/authentication/registerResponse.ts

@@ -0,0 +1,12 @@
+import { BaseResponse } from "../baseResponse";
+
+import { ICaptchaProtectedResponse } from "./ICaptchaProtectedResponse";
+
+export class RegisterResponse extends BaseResponse implements ICaptchaProtectedResponse {
+  captchaBypassToken: string;
+
+  constructor(response: any) {
+    super(response);
+    this.captchaBypassToken = this.getResponseProperty("CaptchaBypassToken");
+  }
+}

libs/common/src/services/api.service.ts

@@ -104,6 +104,7 @@ import { VerifyEmailRequest } from "../models/request/verifyEmailRequest";
 import { ApiKeyResponse } from "../models/response/apiKeyResponse";
 import { AttachmentResponse } from "../models/response/attachmentResponse";
 import { AttachmentUploadDataResponse } from "../models/response/attachmentUploadDataResponse";
+import { RegisterResponse } from "../models/response/authentication/registerResponse";
 import { BillingHistoryResponse } from "../models/response/billingHistoryResponse";
 import { BillingPaymentResponse } from "../models/response/billingPaymentResponse";
 import { BillingResponse } from "../models/response/billingResponse";
@@ -356,17 +357,18 @@ export class ApiService implements ApiServiceAbstraction {
     return this.send("POST", "/accounts/password-hint", request, false, false);
   }
 
-  postRegister(request: RegisterRequest): Promise<any> {
-    return this.send(
+  async postRegister(request: RegisterRequest): Promise<RegisterResponse> {
+    const r = await this.send(
       "POST",
       "/accounts/register",
       request,
       false,
-      false,
+      true,
       this.platformUtilsService.isDev()
         ? this.environmentService.getIdentityUrl()
         : this.environmentService.getApiUrl()
     );
+    return new RegisterResponse(r);
   }
 
   async postPremium(data: FormData): Promise<PaymentResponse> {