From 2e2061e34ab0c909bb85547eccd6299dcbb3d076 Mon Sep 17 00:00:00 2001 From: Cesar Gonzalez Date: Thu, 13 Jun 2024 21:06:44 -0500 Subject: [PATCH] [PM-8869] Autofill features broken on Safari --- .../autofill/services/collect-autofill-content.service.ts | 5 +++-- apps/browser/src/autofill/utils/index.ts | 8 ++++++++ 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/apps/browser/src/autofill/services/collect-autofill-content.service.ts b/apps/browser/src/autofill/services/collect-autofill-content.service.ts index 8747065578..39e7571156 100644 --- a/apps/browser/src/autofill/services/collect-autofill-content.service.ts +++ b/apps/browser/src/autofill/services/collect-autofill-content.service.ts @@ -21,6 +21,7 @@ import { nodeIsFormElement, nodeIsInputElement, sendExtensionMessage, + requestIdleCallbackPolyfill, } from "../utils"; import { AutofillOverlayContentService } from "./abstractions/autofill-overlay-content.service"; @@ -1057,7 +1058,7 @@ class CollectAutofillContentService implements CollectAutofillContentServiceInte } if (!this.mutationsQueue.length) { - globalThis.requestIdleCallback(this.processMutations, { timeout: 500 }); + requestIdleCallbackPolyfill(this.processMutations, { timeout: 500 }); } this.mutationsQueue.push(mutations); }; @@ -1194,7 +1195,7 @@ class CollectAutofillContentService implements CollectAutofillContentServiceInte continue; } - globalThis.requestIdleCallback( + requestIdleCallbackPolyfill( // We are setting this item to a -1 index because we do not know its position in the DOM. // This value should be updated with the next call to collect page details. () => void this.buildAutofillFieldItem(node as ElementWithOpId, -1), diff --git a/apps/browser/src/autofill/utils/index.ts b/apps/browser/src/autofill/utils/index.ts index cbb0a862e3..ab01f517e3 100644 --- a/apps/browser/src/autofill/utils/index.ts +++ b/apps/browser/src/autofill/utils/index.ts @@ -1,6 +1,14 @@ import { AutofillPort } from "../enums/autofill-port.enums"; import { FillableFormFieldElement, FormFieldElement } from "../types"; +export function requestIdleCallbackPolyfill(callback: () => void, options?: Record) { + if ("requestIdleCallback" in globalThis) { + return globalThis.requestIdleCallback(() => callback(), options); + } + + return globalThis.setTimeout(() => callback(), 1); +} + /** * Generates a random string of characters that formatted as a custom element name. */