@lynx-js/web-core-canary 0.18.0 → 0.18.1-canary-20251016-70a18fce

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @lynx-js/web-core
 
+## 0.18.1-canary-20251016065218-70a18fce0083743e4516eefc91c0392d748b855f
+
+### Patch Changes
+
+- fix: mts freeze after reload() ([#1892](https://github.com/lynx-family/lynx-stack/pull/1892))
+
+  The mts may be freezed after reload() called.
+
+  We fixed it by waiting until the all-on-ui Javascript realm implementation, an iframe, to be fully loaded.
+
+- Updated dependencies [[`df5ebcf`](https://github.com/lynx-family/lynx-stack/commit/df5ebcf0408950d0380b6d53ad0b9d43eacf36b6), [`e500bc6`](https://github.com/lynx-family/lynx-stack/commit/e500bc6ee865fe1ab17c2ace77c3bcf8462f74c5), [`70a18fc`](https://github.com/lynx-family/lynx-stack/commit/70a18fce0083743e4516eefc91c0392d748b855f), [`e42b906`](https://github.com/lynx-family/lynx-stack/commit/e42b906ae0d771739e0e1897def646ad159274eb)]:
+  - @lynx-js/web-elements@0.8.9-canary-20251016065218-70a18fce0083743e4516eefc91c0392d748b855f
+  - @lynx-js/web-mainthread-apis@0.18.1-canary-20251016065218-70a18fce0083743e4516eefc91c0392d748b855f
+  - @lynx-js/web-worker-runtime@0.18.1-canary-20251016065218-70a18fce0083743e4516eefc91c0392d748b855f
+  - @lynx-js/web-constants@0.18.1-canary-20251016065218-70a18fce0083743e4516eefc91c0392d748b855f
+  - @lynx-js/web-worker-rpc@0.18.1-canary-20251016065218-70a18fce0083743e4516eefc91c0392d748b855f
+
 ## 0.18.0
 
 ### Minor Changes
@@ -352,25 +369,25 @@
   lynxView.initI18nResources = [
     {
       options: {
-        locale: 'en',
-        channel: '1',
-        fallback_url: '',
+        locale: "en",
+        channel: "1",
+        fallback_url: "",
       },
       resource: {
-        hello: 'hello',
-        lynx: 'lynx web platform1',
+        hello: "hello",
+        lynx: "lynx web platform1",
       },
     },
   ];
-  lynxView.addEventListener('i18nResourceMissed', (e) => {
+  lynxView.addEventListener("i18nResourceMissed", (e) => {
     console.log(e);
   });
 
   // mts
   _I18nResourceTranslation({
-    locale: 'en',
-    channel: '1',
-    fallback_url: '',
+    locale: "en",
+    channel: "1",
+    fallback_url: "",
   });
   ```
 
@@ -778,8 +795,8 @@
       }
     };`,
         ],
-        { type: 'text/javascript' },
-      ),
+        { type: "text/javascript" }
+      )
     ),
   };
   lynxView.nativeModulesMap = nativeModulesMap;
@@ -894,8 +911,8 @@
     };
   };`,
       ],
-      { type: 'text/javascript' },
-    ),
+      { type: "text/javascript" }
+    )
   );
 
   const color_methods = URL.createObjectURL(
@@ -910,8 +927,8 @@
     };
   };`,
       ],
-      { type: 'text/javascript' },
-    ),
+      { type: "text/javascript" }
+    )
   );
 
   lynxView.napiModuleMap = {
@@ -928,7 +945,7 @@
 
   ```js
   lynxView.onNapiModulesCall = (name, data, moduleName) => {
-    if (name === 'getColor' && moduleName === 'color_methods') {
+    if (name === "getColor" && moduleName === "color_methods") {
       return data.color;
     }
   };
@@ -1007,8 +1024,8 @@
     }
   };`,
       ],
-      { type: 'text/javascript' },
-    ),
+      { type: "text/javascript" }
+    )
   );
   ```
 
@@ -1020,7 +1037,7 @@
 
   ```js
   lynxView.onNativeModulesCall = (name, data, callback) => {
-    if (name === 'getColor') {
+    if (name === "getColor") {
       callback(data.color);
     }
   };
@@ -1030,7 +1047,7 @@
 
   ```js
   lynxView.onNativeModulesCall = (name, data, moduleName) => {
-    if (name === 'getColor' && moduleName === 'bridge') {
+    if (name === "getColor" && moduleName === "bridge") {
       return data.color;
     }
   };
@@ -1388,7 +1405,7 @@
   This flag changes the behaviour of cascading. It provide a way to do this
 
   ```jsx
-  <view class='class-a class-b' />;
+  <view class="class-a class-b" />
   ```
 
   The class-b will override (cascading) styles of class-a.
@@ -1488,11 +1505,11 @@
   There is also a simple way to use this feature
 
   ```javascript
-  import { LynxCard } from '@lynx-js/web-core';
-  import { loadElement } from '@lynx-js/web-elements/lazy';
-  import '@lynx-js/web-elements/index.css';
-  import '@lynx-js/web-core/index.css';
-  import './index.css';
+  import { LynxCard } from "@lynx-js/web-core";
+  import { loadElement } from "@lynx-js/web-elements/lazy";
+  import "@lynx-js/web-elements/index.css";
+  import "@lynx-js/web-core/index.css";
+  import "./index.css";
 
   const lynxcard = new LynxCard({
     ...beforeConfigs,

package/dist/uiThread/createRenderAllOnUI.js

@@ -16,27 +16,30 @@ const { prepareMainThreadAPIs, } = await import(
  * Creates a isolated JavaScript context for executing mts code.
  * This context has its own global variables and functions.
  */
-function createIFrameRealm(parent) {
+async function createIFrameRealm(parent) {
     const iframe = document.createElement('iframe');
+    const iframeReadyPromise = new Promise((resolve) => {
+        const listener = (event) => {
+            if (event.data === 'lynx:mtsready' && event.source === iframe.contentWindow) {
+                resolve();
+                globalThis.removeEventListener('message', listener);
+            }
+        };
+        globalThis.addEventListener('message', listener);
+    });
     iframe.style.display = 'none';
     iframe.srcdoc =
-        '<!DOCTYPE html><html><head></head><body style="display:none"></body></html>';
+        '<!DOCTYPE html><html><head><script>parent.postMessage("lynx:mtsready","*")</script></head><body style="display:none"></body></html>';
     iframe.sandbox = 'allow-same-origin allow-scripts'; // Restrict capabilities for security
     iframe.loading = 'eager';
     parent.appendChild(iframe);
+    await iframeReadyPromise;
     const iframeWindow = iframe.contentWindow;
     const loadScript = async (url) => {
         const script = iframe.contentDocument.createElement('script');
         script.fetchPriority = 'high';
         script.defer = true;
         script.async = false;
-        if (!iframe.contentDocument.head) {
-            await new Promise((resolve) => {
-                iframe.onload = () => resolve();
-                // In case iframe is already loaded, wait a macro task
-                setTimeout(() => resolve(), 0);
-            });
-        }
         iframe.contentDocument.head.appendChild(script);
         return new Promise(async (resolve, reject) => {
             script.onload = () => {
@@ -82,14 +85,12 @@ export function createRenderAllOnUI(mainToBackgroundRpc, shadowRoot, loadTemplat
     const i18nResources = new I18nResources();
     const { exposureChangedCallback } = createExposureMonitor(shadowRoot);
     const mtsRealm = createIFrameRealm(shadowRoot);
-    const mtsGlobalThis = mtsRealm.globalWindow;
     const { startMainThread, handleUpdatedData } = prepareMainThreadAPIs(mainToBackgroundRpc, shadowRoot, document, mtsRealm, exposureChangedCallback, markTimingInternal, flushMarkTimingInternal, (err, _, release) => {
         callbacks.onError?.(err, release, 'lepus.js');
     }, triggerI18nResourceFallback, (initI18nResources) => {
         i18nResources.setData(initI18nResources);
         return i18nResources;
     }, loadTemplate);
-    const pendingUpdateCalls = [];
     const start = async (configs) => {
         if (ssrDumpInfo) {
             const lynxUniqueIdToElement = [];
@@ -124,20 +125,9 @@ export function createRenderAllOnUI(mainToBackgroundRpc, shadowRoot, loadTemplat
         else {
             await startMainThread(configs);
         }
-        // Process any pending update calls that were queued while mtsGlobalThis was undefined
-        for (const [newData, options] of pendingUpdateCalls) {
-            handleUpdatedData(newData, options);
-        }
-        pendingUpdateCalls.length = 0;
     };
     const updateDataMainThread = async (newData, options) => {
-        if (mtsGlobalThis) {
-            return handleUpdatedData(newData, options);
-        }
-        else {
-            // Cache the call if mtsGlobalThis is not yet initialized
-            pendingUpdateCalls.push([newData, options]);
-        }
+        return handleUpdatedData(newData, options);
     };
     const updateI18nResourcesMainThread = (data) => {
         i18nResources.setData(data);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lynx-js/web-core-canary",
-  "version": "0.18.0",
+  "version": "0.18.1-canary-20251016-70a18fce",
   "private": false,
   "description": "",
   "keywords": [],
@@ -25,14 +25,14 @@
   ],
   "dependencies": {
     "@lynx-js/offscreen-document": "npm:@lynx-js/offscreen-document-canary@0.1.4",
-    "@lynx-js/web-constants": "npm:@lynx-js/web-constants-canary@0.18.0",
-    "@lynx-js/web-mainthread-apis": "npm:@lynx-js/web-mainthread-apis-canary@0.18.0",
-    "@lynx-js/web-worker-rpc": "npm:@lynx-js/web-worker-rpc-canary@0.18.0",
-    "@lynx-js/web-worker-runtime": "npm:@lynx-js/web-worker-runtime-canary@0.18.0"
+    "@lynx-js/web-constants": "npm:@lynx-js/web-constants-canary@0.18.1-canary-20251016-70a18fce",
+    "@lynx-js/web-mainthread-apis": "npm:@lynx-js/web-mainthread-apis-canary@0.18.1-canary-20251016-70a18fce",
+    "@lynx-js/web-worker-rpc": "npm:@lynx-js/web-worker-rpc-canary@0.18.1-canary-20251016-70a18fce",
+    "@lynx-js/web-worker-runtime": "npm:@lynx-js/web-worker-runtime-canary@0.18.1-canary-20251016-70a18fce"
   },
   "devDependencies": {
     "@lynx-js/lynx-core": "0.1.3",
-    "@lynx-js/web-elements": "npm:@lynx-js/web-elements-canary@0.8.8"
+    "@lynx-js/web-elements": "npm:@lynx-js/web-elements-canary@0.8.9-canary-20251016-70a18fce"
   },
   "peerDependencies": {
     "@lynx-js/lynx-core": "0.1.3",