bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-14 23:33:31 +00:00
Code Issues Releases Wiki Activity

[CL-295] Use aria-disabled on buttons (#15009)

Browse Source 
* Use aria-disabled for button disabled state

* remove import from testing story

* use aria-disabled attr on bitLink button

* remove unnecessary story attrs

* remove disabled attr if on button element

* create caprture click util

* use caprture click util and fix tests

* fix lint errors

* fix event type

* combine click capture and attr modification

* fix lint error. Commit spec changes left out of last commit in error

* inject element ref

* move aria-disabled styles to common

* move disabled logic into util

* fix broken async actions stories

* fix broken tests asserting disabled attr

* have test check for string true vlalue

* fix Signal type

* fix form-field story import

* remove injector left in error

* aria-disable icon buttons

* update form component css selector to look for aria-disabled buttons

* use correct types. pass nativeElement directly

* add JSDoc comment for util function

---------

Co-authored-by: Will Martin <contact@willmartian.com>
This commit is contained in:
Bryan Cunningham
2025-07-08 16:13:25 -04:00
committed by GitHub
parent d5e7f3bd04
commit 682f1f83d9
12 changed files with 175 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
apps/browser/src/vault/popup/components/vault-v2/vault-generator-dialog/vault-generator-dialog.component.spec.ts
View File

@@ -76,10 +76,8 @@ describe("VaultGeneratorDialogComponent", () => {
component.onValueGenerated("test-password");
fixture.detectChanges();
const button = fixture.debugElement.query(
By.css("[data-testid='select-button']"),
).nativeElement;
expect(button.disabled).toBe(false);
const button = fixture.debugElement.query(By.css("[data-testid='select-button']"));
expect(button.attributes["aria-disabled"]).toBe(undefined);
});
it("should disable the button if no value has been generated", () => {
@@ -90,10 +88,8 @@ describe("VaultGeneratorDialogComponent", () => {
generator.algorithmSelected.emit({ useGeneratedValue: "Use Password" } as any);
fixture.detectChanges();
const button = fixture.debugElement.query(
By.css("[data-testid='select-button']"),
).nativeElement;
expect(button.disabled).toBe(true);
const button = fixture.debugElement.query(By.css("[data-testid='select-button']"));
expect(button.attributes["aria-disabled"]).toBe("true");
});
it("should disable the button if no algorithm is selected", () => {
@@ -104,10 +100,8 @@ describe("VaultGeneratorDialogComponent", () => {
generator.valueGenerated.emit("test-password");
fixture.detectChanges();
const button = fixture.debugElement.query(
By.css("[data-testid='select-button']"),
).nativeElement;
expect(button.disabled).toBe(true);
const button = fixture.debugElement.query(By.css("[data-testid='select-button']"));
expect(button.attributes["aria-disabled"]).toBe("true");
});
it("should update button text when algorithm is selected", () => {

18
apps/web/src/app/vault/components/web-generator-dialog/web-generator-dialog.component.spec.ts
View File

@@ -70,10 +70,8 @@ describe("WebVaultGeneratorDialogComponent", () => {
generator.valueGenerated.emit("test-password");
fixture.detectChanges();
const button = fixture.debugElement.query(
By.css("[data-testid='select-button']"),
).nativeElement;
expect(button.disabled).toBe(false);
const button = fixture.debugElement.query(By.css("[data-testid='select-button']"));
expect(button.attributes["aria-disabled"]).toBe(undefined);
});
it("should disable the button if no value has been generated", () => {
@@ -84,10 +82,8 @@ describe("WebVaultGeneratorDialogComponent", () => {
generator.algorithmSelected.emit({ useGeneratedValue: "Use Password" } as any);
fixture.detectChanges();
const button = fixture.debugElement.query(
By.css("[data-testid='select-button']"),
).nativeElement;
expect(button.disabled).toBe(true);
const button = fixture.debugElement.query(By.css("[data-testid='select-button']"));
expect(button.attributes["aria-disabled"]).toBe("true");
});
it("should disable the button if no algorithm is selected", () => {
@@ -98,10 +94,8 @@ describe("WebVaultGeneratorDialogComponent", () => {
generator.valueGenerated.emit("test-password");
fixture.detectChanges();
const button = fixture.debugElement.query(
By.css("[data-testid='select-button']"),
).nativeElement;
expect(button.disabled).toBe(true);
const button = fixture.debugElement.query(By.css("[data-testid='select-button']"));
expect(button.attributes["aria-disabled"]).toBe("true");
});
it("should close with selected value when confirmed", () => {