1
0
mirror of https://github.com/bitwarden/browser.git synced 2025-01-10 19:38:11 +01:00

[PM-5189] Fixing jest tests for AutofillOverlayContentService

This commit is contained in:
Cesar Gonzalez 2024-06-20 08:35:37 -05:00
parent 6e56f23e44
commit 8138309039
No known key found for this signature in database
GPG Key ID: 3381A5457F8CCECF

View File

@ -14,7 +14,7 @@ import AutofillForm from "../models/autofill-form";
import AutofillPageDetails from "../models/autofill-page-details";
import { createAutofillFieldMock } from "../spec/autofill-mocks";
import { flushPromises, postWindowMessage, sendMockExtensionMessage } from "../spec/testing-utils";
import { ElementWithOpId, FillableFormFieldElement, FormFieldElement } from "../types";
import { ElementWithOpId, FormFieldElement } from "../types";
import { AutoFillConstants } from "./autofill-constants";
import { AutofillOverlayContentService } from "./autofill-overlay-content.service";
@ -861,149 +861,13 @@ describe("AutofillOverlayContentService", () => {
});
describe("handleOverlayRepositionEvent", () => {
let checkShouldRepositionInlineMenuSpy: jest.SpyInstance;
beforeEach(() => {
document.body.innerHTML = `
<form id="validFormId">
<input type="text" id="username-field" placeholder="username" />
<input type="password" id="password-field" placeholder="password" />
</form>
`;
autofillOverlayContentService["mostRecentlyFocusedField"] = document.getElementById(
"username-field",
) as ElementWithOpId<HTMLInputElement>;
autofillOverlayContentService["setOverlayRepositionEventListeners"]();
checkShouldRepositionInlineMenuSpy = jest
.spyOn(autofillOverlayContentService as any, "checkShouldRepositionInlineMenu")
.mockResolvedValue(true);
jest
.spyOn(autofillOverlayContentService as any, "recentlyFocusedFieldIsCurrentlyFocused")
.mockReturnValue(true);
});
it("skips handling the overlay reposition event if the overlay button and list elements are not visible", async () => {
checkShouldRepositionInlineMenuSpy.mockResolvedValue(false);
globalThis.dispatchEvent(new Event(EVENTS.RESIZE));
const repositionEvents = [EVENTS.SCROLL, EVENTS.RESIZE];
repositionEvents.forEach((repositionEvent) => {
it(`sends a message trigger overlay reposition message to the background when a ${repositionEvent} event occurs`, async () => {
globalThis.dispatchEvent(new Event(repositionEvent));
await flushPromises();
expect(sendExtensionMessageSpy).not.toHaveBeenCalled();
});
it("hides the overlay elements", async () => {
globalThis.dispatchEvent(new Event(EVENTS.SCROLL));
await flushPromises();
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("toggleAutofillInlineMenuHidden", {
isInlineMenuHidden: true,
setTransparentInlineMenu: false,
});
});
it("removes the overlay completely if the field is not focused", async () => {
jest.useFakeTimers();
jest
.spyOn(autofillOverlayContentService as any, "recentlyFocusedFieldIsCurrentlyFocused")
.mockReturnValue(false);
autofillOverlayContentService["mostRecentlyFocusedField"] = undefined;
globalThis.dispatchEvent(new Event(EVENTS.SCROLL));
await flushPromises();
jest.advanceTimersByTime(800);
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("toggleAutofillInlineMenuHidden", {
isInlineMenuHidden: false,
setTransparentInlineMenu: true,
});
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("closeAutofillInlineMenu", {
forceCloseInlineMenu: true,
});
});
it("updates the overlay position if the most recently focused field is still within the viewport", async () => {
jest.useFakeTimers();
jest
.spyOn(autofillOverlayContentService as any, "updateMostRecentlyFocusedField")
.mockImplementation(() => {
autofillOverlayContentService["focusedFieldData"] = {
focusedFieldRects: {
top: 100,
},
focusedFieldStyles: {},
};
});
const clearUserInteractionEventTimeoutSpy = jest.spyOn(
autofillOverlayContentService as any,
"clearUserInteractionEventTimeout",
);
globalThis.dispatchEvent(new Event(EVENTS.SCROLL));
await flushPromises();
jest.advanceTimersByTime(750);
await flushPromises();
jest.advanceTimersByTime(50);
await flushPromises();
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("updateAutofillInlineMenuPosition", {
overlayElement: AutofillOverlayElement.Button,
});
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("updateAutofillInlineMenuPosition", {
overlayElement: AutofillOverlayElement.List,
});
expect(clearUserInteractionEventTimeoutSpy).toHaveBeenCalled();
});
it("removes the inline menu list if the focused field has a value", async () => {
jest.useFakeTimers();
jest
.spyOn(autofillOverlayContentService as any, "updateMostRecentlyFocusedField")
.mockImplementation(() => {
autofillOverlayContentService["focusedFieldData"] = {
focusedFieldRects: {
top: 100,
},
focusedFieldStyles: {},
};
});
(
autofillOverlayContentService["mostRecentlyFocusedField"] as FillableFormFieldElement
).value = "test";
globalThis.dispatchEvent(new Event(EVENTS.SCROLL));
await flushPromises();
jest.advanceTimersByTime(750);
await flushPromises();
jest.advanceTimersByTime(50);
await flushPromises();
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("closeAutofillInlineMenu", {
overlayElement: AutofillOverlayElement.List,
forceCloseInlineMenu: true,
});
});
it("removes the autofill inline menu if the focused field is outside of the viewport", async () => {
jest.useFakeTimers();
jest
.spyOn(autofillOverlayContentService as any, "updateMostRecentlyFocusedField")
.mockImplementation(() => {
autofillOverlayContentService["focusedFieldData"] = {
focusedFieldRects: {
top: 4000,
},
focusedFieldStyles: {},
};
});
globalThis.dispatchEvent(new Event(EVENTS.SCROLL));
await flushPromises();
jest.advanceTimersByTime(800);
await flushPromises();
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("closeAutofillInlineMenu", {
forceCloseInlineMenu: true,
expect(sendExtensionMessageSpy).toHaveBeenCalledWith("triggerAutofillOverlayReposition");
});
});
});