@lynx-js/web-core-server 0.15.1 → 0.15.3

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @lynx-js/web-core-server
 
+## 0.15.3
+
+## 0.15.2
+
+### Patch Changes
+
+- feat: support SSR for all-on-ui ([#1029](https://github.com/lynx-family/lynx-stack/pull/1029))
+
+- feat: move SSR hydrate essential info to the ssr attribute ([#1292](https://github.com/lynx-family/lynx-stack/pull/1292))
+
+  We found that in browser there is no simple tool to decode a base64 string
+
+  Therefore we move the data to `ssr` attribute
+
+  Also fix some ssr issues
+
+- feat: dump the event info on ssr stage ([#1237](https://github.com/lynx-family/lynx-stack/pull/1237))
+
+- feat: mark template elements for SSR and update part ID handling ([#1286](https://github.com/lynx-family/lynx-stack/pull/1286))
+
 ## 0.15.1
 
 ## 0.15.0

package/dist/createLynxView.js

@@ -1,4 +1,4 @@
-import { I18nResources, inShadowRootStyles, lynxUniqueIdAttribute, } from '@lynx-js/web-constants';
+import { I18nResources, inShadowRootStyles, lynxPartIdAttribute, lynxUniqueIdAttribute, } from '@lynx-js/web-constants';
 import { Rpc } from '@lynx-js/web-worker-rpc';
 import { prepareMainThreadAPIs } from '@lynx-js/web-mainthread-apis';
 import { loadTemplate } from './utils/loadTemplate.js';
@@ -31,7 +31,8 @@ const builtinTagTransformMap = {
 // @ts-expect-error
 OffscreenElement.prototype.toJSON = function toJSON() {
     return {
-        ssrID: this[_attributes].get(lynxUniqueIdAttribute),
+        ssrID: this[_attributes].get(lynxPartIdAttribute)
+            ?? this[_attributes].get(lynxUniqueIdAttribute),
     };
 };
 export async function createLynxView(config) {
@@ -46,6 +47,7 @@ export async function createLynxView(config) {
         },
     });
     const i18nResources = new I18nResources();
+    const events = [];
     const { startMainThread } = prepareMainThreadAPIs(backgroundThreadRpc, offscreenDocument, offscreenDocument.createElement.bind(offscreenDocument), () => {
         firstPaintReady();
     }, () => {
@@ -59,6 +61,15 @@ export async function createLynxView(config) {
     }, (initI18nResources) => {
         i18nResources.setData(initI18nResources);
         return i18nResources;
+    }, {
+        __AddEvent(element, eventName, eventData, eventOptions) {
+            events.push([
+                Number(element.getAttribute(lynxUniqueIdAttribute)),
+                eventName,
+                eventData,
+                eventOptions,
+            ]);
+        },
     });
     const runtime = await startMainThread({
         template,
@@ -80,8 +91,12 @@ export async function createLynxView(config) {
     async function renderToString() {
         await firstPaintReadyPromise;
         const ssrEncodeData = runtime?.ssrEncode?.();
+        const ssrDumpInfo = {
+            ssrEncodeData,
+            events,
+        };
         const buffer = [];
-        buffer.push('<lynx-view url="', hydrateUrl, '" ssr ', 'thread-strategy="', threadStrategy, '"');
+        buffer.push('<lynx-view url="', hydrateUrl, '" ssr ="', encodeURI(JSON.stringify(ssrDumpInfo)), '" ', 'thread-strategy="', threadStrategy, '"');
         if (autoSize) {
             buffer.push(' height="auto" width="auto"');
         }
@@ -91,10 +106,6 @@ export async function createLynxView(config) {
         buffer.push('><template shadowrootmode="open">', '<style>', injectStyles, '\n', inShadowRootStyles.join('\n'), '</style>');
         dumpHTMLString(buffer, offscreenDocument, elementTemplates);
         buffer.push('</template>');
-        if (ssrEncodeData) {
-            const encodeDataEncoded = ssrEncodeData ? encodeURI(ssrEncodeData) : ''; // to avoid XSS
-            buffer.push('<!--', encodeDataEncoded, '-->');
-        }
         buffer.push('</lynx-view>');
         return buffer.join('');
     }

package/dist/dumpHTMLString.js

@@ -1,5 +1,6 @@
 import { _attributes, _children, innerHTML, _cssRuleContents, } from '@lynx-js/offscreen-document/webworker';
 import { escapeHtml } from './utils/escapeHtml.js';
+import { lynxPartIdAttribute, lynxUniqueIdAttribute, } from '@lynx-js/web-constants';
 function getInnerHTMLImpl(buffer, element, shadowrootTemplates) {
     const localName = element.localName;
     buffer.push('<');
@@ -7,10 +8,15 @@ function getInnerHTMLImpl(buffer, element, shadowrootTemplates) {
     for (const [key, value] of element[_attributes]) {
         buffer.push(' ');
         buffer.push(key);
-        buffer.push('="');
-        buffer.push(escapeHtml(value));
-        buffer.push('"');
+        if (value.length > 0) {
+            buffer.push('="');
+            buffer.push(escapeHtml(value));
+            buffer.push('"');
+        }
     }
+    const partId = element[_attributes].get(lynxPartIdAttribute)
+        ?? element[_attributes].get(lynxUniqueIdAttribute);
+    buffer.push(' ', lynxPartIdAttribute, '="', partId, '"');
     buffer.push('>');
     const templateImpl = shadowrootTemplates[localName];
     if (templateImpl) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lynx-js/web-core-server",
-  "version": "0.15.1",
+  "version": "0.15.3",
   "private": false,
   "description": "",
   "keywords": [],
@@ -23,9 +23,9 @@
   ],
   "devDependencies": {
     "@lynx-js/offscreen-document": "0.1.3",
-    "@lynx-js/web-constants": "0.15.1",
-    "@lynx-js/web-elements-template": "0.8.0",
-    "@lynx-js/web-mainthread-apis": "0.15.1",
-    "@lynx-js/web-worker-rpc": "0.15.1"
+    "@lynx-js/web-constants": "0.15.3",
+    "@lynx-js/web-elements-template": "0.8.2",
+    "@lynx-js/web-mainthread-apis": "0.15.3",
+    "@lynx-js/web-worker-rpc": "0.15.3"
   }
 }