[loading] enforce javascript execution starting

src/popup/index.js

@@ -219,6 +219,9 @@ function loadPage(worker) {
     $('#reset').css('top', 5);
   };
 
+  // reset jQuery event handlers
+  $('body').find('*').addBack().off();
+
   worker.connectLocator
     .asRegistration()
     .then((input) => {
@@ -227,10 +230,6 @@ function loadPage(worker) {
       const connectCredentials = credentials;
       return { connectUrl, connectCredentials, ...input };
     })
-    // wait for the document to be ready
-    .then((input) => new Promise((resolve) => {
-      $(document).ready(() => resolve(input));
-    }))
     // remove the studio package name input if the feature flag is not set
     .then((input) => worker.developmentMode
       .isFeatureFlagSet('studio-package-name')
@@ -244,8 +243,6 @@ function loadPage(worker) {
     // eslint-disable-next-line no-unused-vars
     .then(({ connectUrl, connectCredentials, cookiesGranted }) => {
       const pendingPromises = [];
-      // reset jQuery event handlers
-      $('body').find('*').addBack().off();
       $('#connect-url-input').val(connectUrl);
 
       // Grant cookies permissions to connect if needed
@@ -984,6 +981,8 @@ function loadPage(worker) {
     .catch(stopLoading);
 }
 
-new ServiceWorkerBridge()
-  .bootstrap({ name: 'reloadPopup', entrypoint: loadPage })
-  .catch((error) => console.error(error));
+document.addEventListener('DOMContentLoaded', () => {
+  const worker = new ServiceWorkerBridge();
+  worker.bootstrap({ name: 'popup', entrypoint: loadPage })
+    .catch((error) => console.error(error));
+});