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

[PM-5189] Adjusting jest tests for AutofillService to facilitate observable behavior

Browse Source
This commit is contained in:
Cesar Gonzalez
2024-04-16 16:54:05 -05:00
parent a5824584ae
commit 49299204e4
9 changed files with 31 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/browser/src/autofill/background/abstractions/overlay.background.ts
View File

@@ -98,7 +98,7 @@ type OverlayBackgroundExtensionMessageHandlers = {
autofillOverlayAddNewVaultItem: ({ message, sender }: BackgroundOnMessageHandlerParams) => void;
getInlineMenuVisibilitySetting: () => void;
checkAutofillOverlayMenuFocused: () => void;
focusAutofillOverlayList: () => void;
focusAutofillOverlayMenuList: () => void;
updateAutofillOverlayMenuPosition: ({
message,
sender,

8
apps/browser/src/autofill/background/overlay.background.spec.ts
View File

@@ -698,8 +698,8 @@ describe("OverlayBackground", () => {
});
});
describe("focusAutofillOverlayList message handler", () => {
it("will send a `focusOverlayList` message to the overlay list port", async () => {
describe("focusAutofillOverlayMenuList message handler", () => {
it("will send a `focusOverlayMenuList` message to the overlay list port", async () => {
await initOverlayElementPorts({
initList: true,
initButton: false,
@@ -707,9 +707,9 @@ describe("OverlayBackground", () => {
initListMessageConnectorSpy: false,
});
sendMockExtensionMessage({ command: "focusAutofillOverlayList" });
sendMockExtensionMessage({ command: "focusAutofillOverlayMenuList" });
expect(listPortSpy.postMessage).toHaveBeenCalledWith({ command: "focusOverlayList" });
expect(listPortSpy.postMessage).toHaveBeenCalledWith({ command: "focusOverlayMenuList" });
});
});

6
apps/browser/src/autofill/background/overlay.background.ts
View File

@@ -70,7 +70,7 @@ class OverlayBackground implements OverlayBackgroundInterface {
autofillOverlayAddNewVaultItem: ({ message, sender }) => this.addNewVaultItem(message, sender),
getInlineMenuVisibilitySetting: () => this.getInlineMenuVisibility(),
checkAutofillOverlayMenuFocused: () => this.checkOverlayMenuFocused(),
focusAutofillOverlayList: () => this.focusOverlayList(),
focusAutofillOverlayMenuList: () => this.focusOverlayMenuList(),
updateAutofillOverlayMenuPosition: ({ message, sender }) =>
this.updateOverlayMenuPosition(message, sender),
updateAutofillOverlayMenuHidden: ({ message, sender }) =>
@@ -736,8 +736,8 @@ class OverlayBackground implements OverlayBackgroundInterface {
/**
* Facilitates redirecting focus to the overlay list.
*/
private focusOverlayList() {
this.overlayListPort?.postMessage({ command: "focusOverlayList" });
private focusOverlayMenuList() {
this.overlayListPort?.postMessage({ command: "focusOverlayMenuList" });
}
/**

2
apps/browser/src/autofill/overlay/abstractions/autofill-overlay-list.ts
View File

@@ -22,7 +22,7 @@ type OverlayListWindowMessageHandlers = {
initAutofillOverlayList: ({ message }: { message: InitAutofillOverlayListMessage }) => void;
checkAutofillOverlayListFocused: () => void;
updateOverlayListCiphers: ({ message }: { message: UpdateOverlayListCiphersMessage }) => void;
focusOverlayList: () => void;
focusOverlayMenuList: () => void;
};
export {

8
apps/browser/src/autofill/overlay/pages/list/autofill-overlay-list.spec.ts
View File

@@ -330,7 +330,7 @@ describe("AutofillOverlayList", () => {
"setAttribute",
);
postWindowMessage({ command: "focusOverlayList" });
postWindowMessage({ command: "focusOverlayMenuList" });
expect(overlayContainerSetAttributeSpy).toHaveBeenCalledWith("role", "dialog");
expect(overlayContainerSetAttributeSpy).toHaveBeenCalledWith("aria-modal", "true");
@@ -348,7 +348,7 @@ describe("AutofillOverlayList", () => {
autofillOverlayList["overlayListContainer"].querySelector("#unlock-button");
jest.spyOn(unlockButton as HTMLElement, "focus");
postWindowMessage({ command: "focusOverlayList" });
postWindowMessage({ command: "focusOverlayMenuList" });
expect((unlockButton as HTMLElement).focus).toBeCalled();
});
@@ -360,7 +360,7 @@ describe("AutofillOverlayList", () => {
autofillOverlayList["overlayListContainer"].querySelector("#new-item-button");
jest.spyOn(newItemButton as HTMLElement, "focus");
postWindowMessage({ command: "focusOverlayList" });
postWindowMessage({ command: "focusOverlayMenuList" });
expect((newItemButton as HTMLElement).focus).toBeCalled();
});
@@ -371,7 +371,7 @@ describe("AutofillOverlayList", () => {
autofillOverlayList["overlayListContainer"].querySelector(".fill-cipher-button");
jest.spyOn(firstCipherItem as HTMLElement, "focus");
postWindowMessage({ command: "focusOverlayList" });
postWindowMessage({ command: "focusOverlayMenuList" });
expect((firstCipherItem as HTMLElement).focus).toBeCalled();
});

4
apps/browser/src/autofill/overlay/pages/list/autofill-overlay-list.ts
View File

@@ -26,7 +26,7 @@ class AutofillOverlayList extends AutofillOverlayPageElement {
initAutofillOverlayList: ({ message }) => this.initAutofillOverlayList(message),
checkAutofillOverlayListFocused: () => this.checkOverlayListFocused(),
updateOverlayListCiphers: ({ message }) => this.updateListItems(message.ciphers),
focusOverlayList: () => this.focusOverlayList(),
focusOverlayMenuList: () => this.focusOverlayMenuList(),
};
constructor() {
@@ -486,7 +486,7 @@ class AutofillOverlayList extends AutofillOverlayPageElement {
* determined by the presence of the unlock button, new item button, or
* the first cipher button.
*/
private focusOverlayList() {
private focusOverlayMenuList() {
this.overlayListContainer.setAttribute("role", "dialog");
this.overlayListContainer.setAttribute("aria-modal", "true");

6
apps/browser/src/autofill/services/autofill-overlay-content.service.spec.ts
View File

@@ -375,11 +375,11 @@ describe("AutofillOverlayContentService", () => {
expect(updateMostRecentlyFocusedFieldSpy).toHaveBeenCalledWith(autofillFieldElement);
expect(openAutofillOverlaySpy).toHaveBeenCalledWith({ isOpeningFullOverlay: true });
expect(sendExtensionMessageSpy).not.toHaveBeenCalledWith("focusAutofillOverlayList");
expect(sendExtensionMessageSpy).not.toHaveBeenCalledWith("focusAutofillOverlayMenuList");
jest.advanceTimersByTime(150);
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("focusAutofillOverlayList");
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("focusAutofillOverlayMenuList");
});
it("focuses the overlay list when the `ArrowDown` key is pressed", async () => {
@@ -390,7 +390,7 @@ describe("AutofillOverlayContentService", () => {
autofillFieldElement.dispatchEvent(new KeyboardEvent("keyup", { code: "ArrowDown" }));
await flushPromises();
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("focusAutofillOverlayList");
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("focusAutofillOverlayMenuList");
});
});

8
apps/browser/src/autofill/services/autofill-overlay-content.service.ts
View File

@@ -319,7 +319,7 @@ class AutofillOverlayContentService implements AutofillOverlayContentServiceInte
event.preventDefault();
event.stopPropagation();
void this.focusOverlayList();
void this.focusOverlayMenuList();
}
};
@@ -328,15 +328,15 @@ class AutofillOverlayContentService implements AutofillOverlayContentServiceInte
* the overlay will be opened and the list will be focused after a short delay. Ensures
* that the overlay list is focused when the user presses the down arrow key.
*/
private async focusOverlayList() {
private async focusOverlayMenuList() {
if (this.mostRecentlyFocusedField && !(await this.isInlineMenuListVisible())) {
await this.updateMostRecentlyFocusedField(this.mostRecentlyFocusedField);
this.openAutofillOverlayMenu({ isOpeningFullOverlay: true });
setTimeout(() => this.sendExtensionMessage("focusAutofillOverlayList"), 125);
setTimeout(() => this.sendExtensionMessage("focusAutofillOverlayMenuList"), 125);
return;
}
void this.sendExtensionMessage("focusAutofillOverlayList");
void this.sendExtensionMessage("focusAutofillOverlayMenuList");
}
/**

13
apps/browser/src/autofill/services/autofill.service.spec.ts
View File

@@ -1,13 +1,14 @@
import { mock, mockReset } from "jest-mock-extended";
import { of } from "rxjs";
import { mock, MockProxy, mockReset } from "jest-mock-extended";
import { BehaviorSubject, of } from "rxjs";
import { UserVerificationService } from "@bitwarden/common/auth/services/user-verification/user-verification.service";
import { AutofillOverlayVisibility } from "@bitwarden/common/autofill/constants";
import { AutofillSettingsService } from "@bitwarden/common/autofill/services/autofill-settings.service";
import { AutofillSettingsServiceAbstraction } from "@bitwarden/common/autofill/services/autofill-settings.service";
import {
DefaultDomainSettingsService,
DomainSettingsService,
} from "@bitwarden/common/autofill/services/domain-settings.service";
import { InlineMenuVisibilitySetting } from "@bitwarden/common/autofill/types";
import { BillingAccountProfileStateService } from "@bitwarden/common/billing/abstractions/account/billing-account-profile-state.service";
import { EventType } from "@bitwarden/common/enums";
import { UriMatchStrategy } from "@bitwarden/common/models/domain/domain-service";
@@ -62,7 +63,7 @@ const mockEquivalentDomains = [
describe("AutofillService", () => {
let autofillService: AutofillService;
const cipherService = mock<CipherService>();
const autofillSettingsService = mock<AutofillSettingsService>();
let autofillSettingsService: MockProxy<AutofillSettingsServiceAbstraction>;
const mockUserId = Utils.newGuid() as UserId;
const accountService: FakeAccountService = mockAccountServiceWith(mockUserId);
const fakeStateProvider: FakeStateProvider = new FakeStateProvider(accountService);
@@ -72,8 +73,12 @@ describe("AutofillService", () => {
const logService = mock<LogService>();
const userVerificationService = mock<UserVerificationService>();
const billingAccountProfileStateService = mock<BillingAccountProfileStateService>();
let inlineMenuVisibilitySettingMock$!: BehaviorSubject<InlineMenuVisibilitySetting>;
beforeEach(() => {
inlineMenuVisibilitySettingMock$ = new BehaviorSubject(AutofillOverlayVisibility.OnFieldFocus);
autofillSettingsService = mock<AutofillSettingsServiceAbstraction>();
autofillSettingsService.inlineMenuVisibility$ = inlineMenuVisibilitySettingMock$;
autofillService = new AutofillService(
cipherService,
autofillSettingsService,