From def92d1b8e9d373e2f6f27c366d578d97d8960c6 Mon Sep 17 00:00:00 2001 From: Daniel Baumann Date: Wed, 15 May 2024 05:34:50 +0200 Subject: Merging upstream version 126.0. Signed-off-by: Daniel Baumann --- .../translations/content/translations.mjs | 201 +++++---------------- 1 file changed, 41 insertions(+), 160 deletions(-) (limited to 'toolkit/components/translations/content/translations.mjs') diff --git a/toolkit/components/translations/content/translations.mjs b/toolkit/components/translations/content/translations.mjs index 478f854bb5..d5541408d4 100644 --- a/toolkit/components/translations/content/translations.mjs +++ b/toolkit/components/translations/content/translations.mjs @@ -10,6 +10,8 @@ AT_logError, AT_createTranslationsPort, AT_isHtmlTranslation, AT_isTranslationEngineSupported, AT_identifyLanguage */ +import { Translator } from "chrome://global/content/translations/Translator.mjs"; + // Allow tests to override this value so that they can run faster. // This is the delay in milliseconds. window.DEBOUNCE_DELAY = 200; @@ -66,7 +68,7 @@ class TranslationsState { * The translator is only valid for a single language pair, and needs * to be recreated if the language pair changes. * - * @type {null | Promise} + * @type {null | Translator} */ translator = null; @@ -133,42 +135,28 @@ class TranslationsState { onDebounce: async () => { // The contents of "this" can change between async steps, store a local variable // binding of these values. - const { - fromLanguage, - toLanguage, - messageToTranslate, - translator: translatorPromise, - } = this; + const { fromLanguage, toLanguage, messageToTranslate, translator } = this; if (!this.isTranslationEngineSupported) { // Never translate when the engine isn't supported. return; } - if ( - !fromLanguage || - !toLanguage || - !messageToTranslate || - !translatorPromise - ) { + if (!fromLanguage || !toLanguage || !messageToTranslate || !translator) { // Not everything is set for translation. this.ui.updateTranslation(""); return; } - const [translator] = await Promise.all([ - // Ensure the engine is ready to go. - translatorPromise, - // Ensure the previous translation has finished so that only the latest - // translation goes through. - this.translationRequest, - ]); + // Ensure the previous translation has finished so that only the latest + // translation goes through. + await this.translationRequest; if ( // Check if the current configuration has changed and if this is stale. If so // then skip this request, as there is already a newer request with more up to // date information. - this.translator !== translatorPromise || + this.translator !== translator || this.fromLanguage !== fromLanguage || this.toLanguage !== toLanguage || this.messageToTranslate !== messageToTranslate @@ -177,8 +165,10 @@ class TranslationsState { } const start = performance.now(); - - this.translationRequest = translator.translate(messageToTranslate); + this.translationRequest = this.translator.translate( + messageToTranslate, + AT_isHtmlTranslation() + ); const translation = await this.translationRequest; // The measure events will show up in the Firefox Profiler. @@ -236,15 +226,40 @@ class TranslationsState { `Creating a new translator for "${this.fromLanguage}" to "${this.toLanguage}"` ); - this.translator = Translator.create(this.fromLanguage, this.toLanguage); - this.maybeRequestTranslation(); + const translationPortPromise = (fromLanguage, toLanguage) => { + const { promise, resolve } = Promise.withResolvers(); + + const getResponse = ({ data }) => { + if ( + data.type == "GetTranslationsPort" && + data.fromLanguage === fromLanguage && + data.toLanguage === toLanguage + ) { + window.removeEventListener("message", getResponse); + resolve(data.port); + } + }; + + window.addEventListener("message", getResponse); + AT_createTranslationsPort(fromLanguage, toLanguage); + + return promise; + }; try { - await this.translator; + const translatorPromise = Translator.create( + this.fromLanguage, + this.toLanguage, + translationPortPromise + ); const duration = performance.now() - start; + // Signal to tests that the translator was created so they can exit. window.postMessage("translator-ready"); AT_log(`Created a new Translator in ${duration / 1000} seconds`); + + this.translator = await translatorPromise; + this.maybeRequestTranslation(); } catch (error) { this.ui.showInfo("about-translations-engine-error"); AT_logError("Failed to get the Translations worker", error); @@ -655,137 +670,3 @@ function debounce({ onDebounce, doEveryTime }) { }, timeLeft); }; } - -/** - * Perform transalations over a `MessagePort`. This class manages the communications to - * the translations engine. - */ -class Translator { - /** - * @type {MessagePort} - */ - #port; - - /** - * An id for each message sent. This is used to match up the request and response. - */ - #nextMessageId = 0; - - /** - * Tie together a message id to a resolved response. - * - * @type {Map} - */ - #requests = new Map(); - - engineStatus = "initializing"; - - /** - * @param {MessagePort} port - */ - constructor(port) { - this.#port = port; - - // Create a promise that will be resolved when the engine is ready. - let engineLoaded; - let engineFailed; - this.ready = new Promise((resolve, reject) => { - engineLoaded = resolve; - engineFailed = reject; - }); - - // Match up a response on the port to message that was sent. - port.onmessage = ({ data }) => { - switch (data.type) { - case "TranslationsPort:TranslationResponse": { - const { targetText, messageId } = data; - // A request may not match match a messageId if there is a race during the pausing - // and discarding of the queue. - this.#requests.get(messageId)?.resolve(targetText); - break; - } - case "TranslationsPort:GetEngineStatusResponse": { - if (data.status === "ready") { - engineLoaded(); - } else { - engineFailed(); - } - break; - } - default: - AT_logError("Unknown translations port message: " + data.type); - break; - } - }; - - port.postMessage({ type: "TranslationsPort:GetEngineStatusRequest" }); - } - - /** - * Opens up a port and creates a new translator. - * - * @param {string} fromLanguage - * @param {string} toLanguage - * @returns {Promise} - */ - static create(fromLanguage, toLanguage) { - return new Promise((resolve, reject) => { - AT_createTranslationsPort(fromLanguage, toLanguage); - - function getResponse({ data }) { - if ( - data.type == "GetTranslationsPort" && - fromLanguage === data.fromLanguage && - toLanguage === data.toLanguage - ) { - // The response matches, resolve the port. - const translator = new Translator(data.port); - - // Resolve the translator once it is ready, or propagate the rejection - // if it failed. - translator.ready.then(() => resolve(translator), reject); - window.removeEventListener("message", getResponse); - } - } - - // Listen for a response for the message port. - window.addEventListener("message", getResponse); - }); - } - - /** - * Send a request to translate text to the Translations Engine. If it returns `null` - * then the request is stale. A rejection means there was an error in the translation. - * This request may be queued. - * - * @param {string} sourceText - * @returns {Promise} - */ - translate(sourceText) { - return new Promise((resolve, reject) => { - const messageId = this.#nextMessageId++; - // Store the "resolve" for the promise. It will be matched back up with the - // `messageId` in #handlePortMessage. - const isHTML = AT_isHtmlTranslation(); - this.#requests.set(messageId, { - sourceText, - isHTML, - resolve, - reject, - }); - this.#port.postMessage({ - type: "TranslationsPort:TranslationRequest", - messageId, - sourceText, - isHTML, - }); - }); - } - - /** - * Close the port and remove any pending or queued requests. - */ - destroy() { - this.#port.close(); - } -} -- cgit v1.2.3