From 65fa65fc7765bc9a6557d3ce6f8bdcef5b5e0cf7 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sun, 18 Feb 2024 09:27:16 -0500 Subject: Application main updates (#708) * Move waitForBackendReady * Add option to wait for DOM before running main * Move script load to be earlier --- ext/js/app/content-script-main.js | 2 +- ext/js/application.js | 59 +++++++++++++++-------- ext/js/display/popup-main.js | 2 +- ext/js/display/search-main.js | 2 +- ext/js/pages/action-popup-main.js | 2 +- ext/js/pages/info-main.js | 2 +- ext/js/pages/permissions-main.js | 2 +- ext/js/pages/settings/popup-preview-frame-main.js | 2 +- ext/js/pages/settings/settings-main.js | 2 +- ext/js/pages/welcome-main.js | 2 +- 10 files changed, 48 insertions(+), 29 deletions(-) (limited to 'ext/js') diff --git a/ext/js/app/content-script-main.js b/ext/js/app/content-script-main.js index 34160fd1..c17acbfe 100644 --- a/ext/js/app/content-script-main.js +++ b/ext/js/app/content-script-main.js @@ -21,7 +21,7 @@ import {HotkeyHandler} from '../input/hotkey-handler.js'; import {Frontend} from './frontend.js'; import {PopupFactory} from './popup-factory.js'; -await Application.main(async (application) => { +await Application.main(false, async (application) => { const hotkeyHandler = new HotkeyHandler(); hotkeyHandler.prepare(application.crossFrame); diff --git a/ext/js/application.js b/ext/js/application.js index 350a4210..ec5c7e02 100644 --- a/ext/js/application.js +++ b/ext/js/application.js @@ -51,6 +51,41 @@ if (checkChromeNotAvailable()) { chrome = browser; } +/** + * @param {WebExtension} webExtension + */ +async function waitForBackendReady(webExtension) { + const {promise, resolve} = /** @type {import('core').DeferredPromiseDetails} */ (deferPromise()); + /** @type {import('application').ApiMap} */ + const apiMap = createApiMap([['applicationBackendReady', () => { resolve(); }]]); + /** @type {import('extension').ChromeRuntimeOnMessageCallback} */ + const onMessage = ({action, params}, _sender, callback) => invokeApiMapHandler(apiMap, action, params, [], callback); + chrome.runtime.onMessage.addListener(onMessage); + try { + await webExtension.sendMessagePromise({action: 'requestBackendReadySignal'}); + await promise; + } finally { + chrome.runtime.onMessage.removeListener(onMessage); + } +} + +/** + * @returns {Promise} + */ +function waitForDomContentLoaded() { + return new Promise((resolve) => { + if (document.readyState !== 'loading') { + resolve(); + return; + } + const onDomContentLoaded = () => { + document.removeEventListener('DOMContentLoaded', onDomContentLoaded); + resolve(); + }; + document.addEventListener('DOMContentLoaded', onDomContentLoaded); + }); +} + /** * The Yomitan class is a core component through which various APIs are handled and invoked. * @augments EventDispatcher @@ -151,18 +186,20 @@ export class Application extends EventDispatcher { } /** + * @param {boolean} waitForDom * @param {(application: Application) => (Promise)} mainFunction */ - static async main(mainFunction) { + static async main(waitForDom, mainFunction) { const webExtension = new WebExtension(); log.configure(webExtension.extensionName); const api = new API(webExtension); - await this.waitForBackendReady(webExtension); + await waitForBackendReady(webExtension); const {tabId, frameId} = await api.frameInformationGet(); const crossFrameApi = new CrossFrameAPI(api, tabId, frameId); crossFrameApi.prepare(); const application = new Application(api, crossFrameApi); application.prepare(); + if (waitForDom) { await waitForDomContentLoaded(); } try { await mainFunction(application); } catch (error) { @@ -172,24 +209,6 @@ export class Application extends EventDispatcher { } } - /** - * @param {WebExtension} webExtension - */ - static async waitForBackendReady(webExtension) { - const {promise, resolve} = /** @type {import('core').DeferredPromiseDetails} */ (deferPromise()); - /** @type {import('application').ApiMap} */ - const apiMap = createApiMap([['applicationBackendReady', () => { resolve(); }]]); - /** @type {import('extension').ChromeRuntimeOnMessageCallback} */ - const onMessage = ({action, params}, _sender, callback) => invokeApiMapHandler(apiMap, action, params, [], callback); - chrome.runtime.onMessage.addListener(onMessage); - try { - await webExtension.sendMessagePromise({action: 'requestBackendReadySignal'}); - await promise; - } finally { - chrome.runtime.onMessage.removeListener(onMessage); - } - } - // Private /** diff --git a/ext/js/display/popup-main.js b/ext/js/display/popup-main.js index 8f92aaa8..fe1d20dd 100644 --- a/ext/js/display/popup-main.js +++ b/ext/js/display/popup-main.js @@ -25,7 +25,7 @@ import {DisplayProfileSelection} from './display-profile-selection.js'; import {DisplayResizer} from './display-resizer.js'; import {Display} from './display.js'; -await Application.main(async (application) => { +await Application.main(true, async (application) => { const documentFocusController = new DocumentFocusController(); documentFocusController.prepare(); diff --git a/ext/js/display/search-main.js b/ext/js/display/search-main.js index fd90ee0e..c3c292a1 100644 --- a/ext/js/display/search-main.js +++ b/ext/js/display/search-main.js @@ -26,7 +26,7 @@ import {SearchActionPopupController} from './search-action-popup-controller.js'; import {SearchDisplayController} from './search-display-controller.js'; import {SearchPersistentStateController} from './search-persistent-state-controller.js'; -await Application.main(async (application) => { +await Application.main(true, async (application) => { const documentFocusController = new DocumentFocusController('#search-textbox'); documentFocusController.prepare(); diff --git a/ext/js/pages/action-popup-main.js b/ext/js/pages/action-popup-main.js index f58083a7..0a14c669 100644 --- a/ext/js/pages/action-popup-main.js +++ b/ext/js/pages/action-popup-main.js @@ -306,7 +306,7 @@ class DisplayController { } } -await Application.main(async (application) => { +await Application.main(true, async (application) => { application.api.logIndicatorClear(); const displayController = new DisplayController(application.api); diff --git a/ext/js/pages/info-main.js b/ext/js/pages/info-main.js index 0bc84d97..dda1c4e2 100644 --- a/ext/js/pages/info-main.js +++ b/ext/js/pages/info-main.js @@ -115,7 +115,7 @@ async function showDictionaryInfo(api) { container.appendChild(fragment); } -await Application.main(async (application) => { +await Application.main(true, async (application) => { const documentFocusController = new DocumentFocusController(); documentFocusController.prepare(); diff --git a/ext/js/pages/permissions-main.js b/ext/js/pages/permissions-main.js index 3be97b78..40dbceb2 100644 --- a/ext/js/pages/permissions-main.js +++ b/ext/js/pages/permissions-main.js @@ -86,7 +86,7 @@ function setupPermissionsToggles() { } } -await Application.main(async (application) => { +await Application.main(true, async (application) => { const documentFocusController = new DocumentFocusController(); documentFocusController.prepare(); diff --git a/ext/js/pages/settings/popup-preview-frame-main.js b/ext/js/pages/settings/popup-preview-frame-main.js index c6c694cd..978b102e 100644 --- a/ext/js/pages/settings/popup-preview-frame-main.js +++ b/ext/js/pages/settings/popup-preview-frame-main.js @@ -21,7 +21,7 @@ import {Application} from '../../application.js'; import {HotkeyHandler} from '../../input/hotkey-handler.js'; import {PopupPreviewFrame} from './popup-preview-frame.js'; -await Application.main(async (application) => { +await Application.main(true, async (application) => { const hotkeyHandler = new HotkeyHandler(); hotkeyHandler.prepare(application.crossFrame); diff --git a/ext/js/pages/settings/settings-main.js b/ext/js/pages/settings/settings-main.js index 0b115246..82fc91a5 100644 --- a/ext/js/pages/settings/settings-main.js +++ b/ext/js/pages/settings/settings-main.js @@ -58,7 +58,7 @@ async function setupGenericSettingController(genericSettingController) { await genericSettingController.refresh(); } -await Application.main(async (application) => { +await Application.main(true, async (application) => { const documentFocusController = new DocumentFocusController(); documentFocusController.prepare(); diff --git a/ext/js/pages/welcome-main.js b/ext/js/pages/welcome-main.js index 9990b4e7..d1d1a6b2 100644 --- a/ext/js/pages/welcome-main.js +++ b/ext/js/pages/welcome-main.js @@ -49,7 +49,7 @@ async function setupGenericSettingsController(genericSettingController) { await genericSettingController.refresh(); } -await Application.main(async (application) => { +await Application.main(true, async (application) => { const documentFocusController = new DocumentFocusController(); documentFocusController.prepare(); -- cgit v1.2.3