1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-10 21:33:27 +00:00

add data-testids to address and tax inputs (#15637)

This commit is contained in:
Ned Thompson
2025-07-16 15:01:40 -04:00
committed by GitHub
parent 24e8f0d75d
commit 2086e7ae87
3 changed files with 86 additions and 16 deletions

View File

@@ -38,7 +38,7 @@ type Scenario =
<div class="tw-col-span-6"> <div class="tw-col-span-6">
<bit-form-field [disableMargin]="true"> <bit-form-field [disableMargin]="true">
<bit-label>{{ "country" | i18n }}</bit-label> <bit-label>{{ "country" | i18n }}</bit-label>
<bit-select [formControl]="group.controls.country"> <bit-select [formControl]="group.controls.country" data-testid="country">
@for (selectableCountry of selectableCountries; track selectableCountry.value) { @for (selectableCountry of selectableCountries; track selectableCountry.value) {
<bit-option <bit-option
[value]="selectableCountry.value" [value]="selectableCountry.value"
@@ -57,6 +57,7 @@ type Scenario =
type="text" type="text"
[formControl]="group.controls.postalCode" [formControl]="group.controls.postalCode"
autocomplete="postal-code" autocomplete="postal-code"
data-testid="postal-code"
/> />
</bit-form-field> </bit-form-field>
</div> </div>
@@ -68,6 +69,7 @@ type Scenario =
type="text" type="text"
[formControl]="group.controls.line1" [formControl]="group.controls.line1"
autocomplete="address-line1" autocomplete="address-line1"
data-testid="address-line1"
/> />
</bit-form-field> </bit-form-field>
</div> </div>
@@ -79,6 +81,7 @@ type Scenario =
type="text" type="text"
[formControl]="group.controls.line2" [formControl]="group.controls.line2"
autocomplete="address-line2" autocomplete="address-line2"
data-testid="address-line2"
/> />
</bit-form-field> </bit-form-field>
</div> </div>
@@ -90,6 +93,7 @@ type Scenario =
type="text" type="text"
[formControl]="group.controls.city" [formControl]="group.controls.city"
autocomplete="address-level2" autocomplete="address-level2"
data-testid="city"
/> />
</bit-form-field> </bit-form-field>
</div> </div>
@@ -101,6 +105,7 @@ type Scenario =
type="text" type="text"
[formControl]="group.controls.state" [formControl]="group.controls.state"
autocomplete="address-level1" autocomplete="address-level1"
data-testid="state"
/> />
</bit-form-field> </bit-form-field>
</div> </div>
@@ -108,7 +113,12 @@ type Scenario =
<div class="tw-col-span-6"> <div class="tw-col-span-6">
<bit-form-field [disableMargin]="true"> <bit-form-field [disableMargin]="true">
<bit-label>{{ "taxIdNumber" | i18n }}</bit-label> <bit-label>{{ "taxIdNumber" | i18n }}</bit-label>
<input bitInput type="text" [formControl]="group.controls.taxId" /> <input
bitInput
type="text"
[formControl]="group.controls.taxId"
data-testid="tax-id"
/>
</bit-form-field> </bit-form-field>
</div> </div>
} }

View File

@@ -3,7 +3,7 @@
<div class="tw-col-span-6"> <div class="tw-col-span-6">
<bit-form-field> <bit-form-field>
<bit-label>{{ "country" | i18n }}</bit-label> <bit-label>{{ "country" | i18n }}</bit-label>
<bit-select formControlName="country" autocomplete="country"> <bit-select formControlName="country" autocomplete="country" data-testid="country">
<bit-option <bit-option
*ngFor="let country of countryList" *ngFor="let country of countryList"
[value]="country.value" [value]="country.value"
@@ -16,37 +16,67 @@
<div class="tw-col-span-6"> <div class="tw-col-span-6">
<bit-form-field> <bit-form-field>
<bit-label>{{ "zipPostalCode" | i18n }}</bit-label> <bit-label>{{ "zipPostalCode" | i18n }}</bit-label>
<input bitInput type="text" formControlName="postalCode" autocomplete="postal-code" /> <input
bitInput
type="text"
formControlName="postalCode"
autocomplete="postal-code"
data-testid="postal-code"
/>
</bit-form-field> </bit-form-field>
</div> </div>
<div class="tw-col-span-6" *ngIf="isTaxSupported"> <div class="tw-col-span-6" *ngIf="isTaxSupported">
<bit-form-field> <bit-form-field>
<bit-label>{{ "address1" | i18n }}</bit-label> <bit-label>{{ "address1" | i18n }}</bit-label>
<input bitInput type="text" formControlName="line1" autocomplete="address-line1" /> <input
bitInput
type="text"
formControlName="line1"
autocomplete="address-line1"
data-testid="address-line1"
/>
</bit-form-field> </bit-form-field>
</div> </div>
<div class="tw-col-span-6" *ngIf="isTaxSupported"> <div class="tw-col-span-6" *ngIf="isTaxSupported">
<bit-form-field> <bit-form-field>
<bit-label>{{ "address2" | i18n }}</bit-label> <bit-label>{{ "address2" | i18n }}</bit-label>
<input bitInput type="text" formControlName="line2" autocomplete="address-line2" /> <input
bitInput
type="text"
formControlName="line2"
autocomplete="address-line2"
data-testid="address-line2"
/>
</bit-form-field> </bit-form-field>
</div> </div>
<div class="tw-col-span-6" *ngIf="isTaxSupported"> <div class="tw-col-span-6" *ngIf="isTaxSupported">
<bit-form-field> <bit-form-field>
<bit-label for="addressCity">{{ "cityTown" | i18n }}</bit-label> <bit-label for="addressCity">{{ "cityTown" | i18n }}</bit-label>
<input bitInput type="text" formControlName="city" autocomplete="address-level2" /> <input
bitInput
type="text"
formControlName="city"
autocomplete="address-level2"
data-testid="city"
/>
</bit-form-field> </bit-form-field>
</div> </div>
<div class="tw-col-span-6" *ngIf="isTaxSupported"> <div class="tw-col-span-6" *ngIf="isTaxSupported">
<bit-form-field> <bit-form-field>
<bit-label>{{ "stateProvince" | i18n }}</bit-label> <bit-label>{{ "stateProvince" | i18n }}</bit-label>
<input bitInput type="text" formControlName="state" autocomplete="address-level1" /> <input
bitInput
type="text"
formControlName="state"
autocomplete="address-level1"
data-testid="state"
/>
</bit-form-field> </bit-form-field>
</div> </div>
<div class="tw-col-span-6" *ngIf="isTaxSupported && showTaxIdField"> <div class="tw-col-span-6" *ngIf="isTaxSupported && showTaxIdField">
<bit-form-field> <bit-form-field>
<bit-label>{{ "taxIdNumber" | i18n }}</bit-label> <bit-label>{{ "taxIdNumber" | i18n }}</bit-label>
<input bitInput type="text" formControlName="taxId" /> <input bitInput type="text" formControlName="taxId" data-testid="tax-id" />
</bit-form-field> </bit-form-field>
</div> </div>
</div> </div>

View File

@@ -3,7 +3,7 @@
<div class="tw-col-span-6"> <div class="tw-col-span-6">
<bit-form-field disableMargin> <bit-form-field disableMargin>
<bit-label>{{ "country" | i18n }}</bit-label> <bit-label>{{ "country" | i18n }}</bit-label>
<bit-select formControlName="country"> <bit-select formControlName="country" data-testid="country">
<bit-option <bit-option
*ngFor="let country of countries" *ngFor="let country of countries"
[value]="country.value" [value]="country.value"
@@ -16,38 +16,68 @@
<div class="tw-col-span-6"> <div class="tw-col-span-6">
<bit-form-field disableMargin> <bit-form-field disableMargin>
<bit-label>{{ "zipPostalCode" | i18n }}</bit-label> <bit-label>{{ "zipPostalCode" | i18n }}</bit-label>
<input bitInput type="text" formControlName="postalCode" autocomplete="postal-code" /> <input
bitInput
type="text"
formControlName="postalCode"
autocomplete="postal-code"
data-testid="postal-code"
/>
</bit-form-field> </bit-form-field>
</div> </div>
<ng-container *ngIf="isTaxSupported"> <ng-container *ngIf="isTaxSupported">
<div class="tw-col-span-6"> <div class="tw-col-span-6">
<bit-form-field disableMargin> <bit-form-field disableMargin>
<bit-label>{{ "address1" | i18n }}</bit-label> <bit-label>{{ "address1" | i18n }}</bit-label>
<input bitInput type="text" formControlName="line1" autocomplete="address-line1" /> <input
bitInput
type="text"
formControlName="line1"
autocomplete="address-line1"
data-testid="address-line1"
/>
</bit-form-field> </bit-form-field>
</div> </div>
<div class="tw-col-span-6"> <div class="tw-col-span-6">
<bit-form-field disableMargin> <bit-form-field disableMargin>
<bit-label>{{ "address2" | i18n }}</bit-label> <bit-label>{{ "address2" | i18n }}</bit-label>
<input bitInput type="text" formControlName="line2" autocomplete="address-line2" /> <input
bitInput
type="text"
formControlName="line2"
autocomplete="address-line2"
data-testid="address-line2"
/>
</bit-form-field> </bit-form-field>
</div> </div>
<div class="tw-col-span-6"> <div class="tw-col-span-6">
<bit-form-field disableMargin> <bit-form-field disableMargin>
<bit-label>{{ "cityTown" | i18n }}</bit-label> <bit-label>{{ "cityTown" | i18n }}</bit-label>
<input bitInput type="text" formControlName="city" autocomplete="address-level2" /> <input
bitInput
type="text"
formControlName="city"
autocomplete="address-level2"
data-testid="city"
/>
</bit-form-field> </bit-form-field>
</div> </div>
<div class="tw-col-span-6"> <div class="tw-col-span-6">
<bit-form-field disableMargin> <bit-form-field disableMargin>
<bit-label>{{ "stateProvince" | i18n }}</bit-label> <bit-label>{{ "stateProvince" | i18n }}</bit-label>
<input bitInput type="text" formControlName="state" autocomplete="address-level1" /> <input
bitInput
type="text"
formControlName="state"
autocomplete="address-level1"
data-testid="state"
/>
</bit-form-field> </bit-form-field>
</div> </div>
<div class="tw-col-span-6" *ngIf="showTaxIdField"> <div class="tw-col-span-6" *ngIf="showTaxIdField">
<bit-form-field disableMargin> <bit-form-field disableMargin>
<bit-label>{{ "taxIdNumber" | i18n }}</bit-label> <bit-label>{{ "taxIdNumber" | i18n }}</bit-label>
<input bitInput type="text" formControlName="taxId" /> <input bitInput type="text" formControlName="taxId" data-testid="tax-id" />
</bit-form-field> </bit-form-field>
</div> </div>
</ng-container> </ng-container>