@lynx-js/web-constants 0.15.7 → 0.16.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @lynx-js/web-constants
 
+## 0.16.0
+
+### Minor Changes
+
+- refactor: provide the mts a real globalThis ([#1589](https://github.com/lynx-family/lynx-stack/pull/1589))
+
+  Before this change, We create a function wrapper and a fake globalThis for Javascript code.
+
+  This caused some issues.
+
+  After this change, we will create an iframe for createing an isolated Javascript context.
+
+  This means the globalThis will be the real one.
+
+### Patch Changes
+
+- refactor: add `:not([l-e-name])` at the end of selector for lazy component ([#1622](https://github.com/lynx-family/lynx-stack/pull/1622))
+
+- fix: the SystemInfo in bts should be assigned to the globalThis ([#1599](https://github.com/lynx-family/lynx-stack/pull/1599))
+
+- Updated dependencies [[`c1f8715`](https://github.com/lynx-family/lynx-stack/commit/c1f8715a81b2e69ff46fc363013626db4468c209)]:
+  - @lynx-js/web-worker-rpc@0.16.0
+
 ## 0.15.7
 
 ### Patch Changes

package/dist/constants.d.ts

@@ -2,6 +2,7 @@ export declare const lynxUniqueIdAttribute: "l-uid";
 export declare const cssIdAttribute: "l-css-id";
 export declare const componentIdAttribute: "l-comp-id";
 export declare const parentComponentUniqueIdAttribute: "l-p-comp-uid";
+export declare const lynxEntryNameAttribute: "l-e-name";
 export declare const lynxTagAttribute: "lynx-tag";
 export declare const lynxDatasetAttribute: "l-dset";
 export declare const lynxComponentConfigAttribute: "l-comp-cfg";
@@ -11,7 +12,5 @@ export declare const lynxPartIdAttribute: "l-part";
 export declare const lynxDefaultDisplayLinearAttribute: "lynx-default-display-linear";
 export declare const lynxDefaultOverflowVisibleAttribute: "lynx-default-overflow-visible";
 export declare const __lynx_timing_flag: "__lynx_timing_flag";
-export declare const globalMuteableVars: readonly ["registerDataProcessor", "registerWorkletInternal", "lynxWorkletImpl", "runWorklet"];
 export declare const systemInfo: Record<string, string | number>;
 export declare const inShadowRootStyles: string[];
-export declare const globalDisallowedVars: string[];

package/dist/constants.js

@@ -5,6 +5,7 @@ export const lynxUniqueIdAttribute = 'l-uid';
 export const cssIdAttribute = 'l-css-id';
 export const componentIdAttribute = 'l-comp-id';
 export const parentComponentUniqueIdAttribute = 'l-p-comp-uid';
+export const lynxEntryNameAttribute = 'l-e-name';
 export const lynxTagAttribute = 'lynx-tag';
 export const lynxDatasetAttribute = 'l-dset';
 export const lynxComponentConfigAttribute = 'l-comp-cfg';
@@ -14,12 +15,6 @@ export const lynxPartIdAttribute = 'l-part';
 export const lynxDefaultDisplayLinearAttribute = 'lynx-default-display-linear';
 export const lynxDefaultOverflowVisibleAttribute = 'lynx-default-overflow-visible';
 export const __lynx_timing_flag = '__lynx_timing_flag';
-export const globalMuteableVars = [
-    'registerDataProcessor',
-    'registerWorkletInternal',
-    'lynxWorkletImpl',
-    'runWorklet',
-];
 export const systemInfo = {
     platform: 'web',
     lynxSdkVersion: '3.0',
@@ -33,5 +28,4 @@ export const inShadowRootStyles = [
     overflow: visible;
   }`,
 ];
-export const globalDisallowedVars = ['navigator', 'postMessage'];
 //# sourceMappingURL=constants.js.map

package/dist/types/BackThreadStartConfigs.d.ts

@@ -2,7 +2,6 @@ import type { Cloneable } from './Cloneable.js';
 import type { LynxTemplate } from './LynxModule.js';
 import type { NapiModulesMap } from './NapiModules.js';
 import type { NativeModulesMap } from './NativeModules.js';
-import type { BrowserConfig } from './PageConfig.js';
 export interface BackMainThreadContextConfig {
     initData: unknown;
     globalProps: unknown;
@@ -11,5 +10,4 @@ export interface BackMainThreadContextConfig {
     customSections: Record<string, Cloneable>;
     nativeModulesMap: NativeModulesMap;
     napiModulesMap: NapiModulesMap;
-    browserConfig: BrowserConfig;
 }

package/dist/types/Element.d.ts

@@ -52,7 +52,7 @@ export interface WebFiberElementImpl {
     removeEventListener: (type: string, handler: (ev: Event) => void, options?: {
         capture?: boolean;
     }) => void;
-    innerHTML: string;
+    textContent: string;
     readonly tagName: string;
     readonly firstElementChild: WebFiberElementImpl | null;
     readonly children: WebFiberElementImpl[];

package/dist/types/JSRealm.d.ts

@@ -0,0 +1,5 @@
+export type JSRealm = {
+    globalWindow: typeof globalThis;
+    loadScript: (url: string) => Promise<unknown>;
+    loadScriptSync: (url: string) => unknown;
+};

package/dist/types/JSRealm.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=JSRealm.js.map

package/dist/types/LynxModule.d.ts

@@ -36,6 +36,7 @@ export interface LynxTemplate {
         [key: string]: string;
     };
     elementTemplate: Record<string, ElementTemplateData[]>;
+    version?: number;
 }
 export interface LynxJSModule {
     exports?: (lynx_runtime: any) => unknown;

package/dist/types/MainThreadGlobalThis.d.ts

@@ -161,11 +161,6 @@ export interface MainThreadGlobalThis {
     __FlushElementTree: (_subTree: unknown, options: FlushElementTreeOptions) => void;
     _I18nResourceTranslation: (options: I18nResourceTranslationOptions) => unknown | undefined;
     _AddEventListener: (...args: unknown[]) => void;
-    /**
-     * private fields
-     */
-    _updateVars: () => void;
-    __lynxGlobalBindingValues: Record<string, unknown>;
     renderPage: ((data: unknown) => void) | undefined;
     updatePage?: (data: Cloneable, options?: Record<string, string>) => void;
     runWorklet?: (obj: unknown, event: unknown) => void;

package/dist/types/MainThreadLynx.d.ts

@@ -9,4 +9,8 @@ export interface MainThreadLynx {
     getCustomSectionSync: (key: string) => Cloneable;
     markPipelineTiming: (pipelineId: string, timingKey: string) => void;
     SystemInfo: typeof systemInfo;
+    setTimeout: typeof setTimeout;
+    clearTimeout: typeof clearTimeout;
+    setInterval: typeof setInterval;
+    clearInterval: typeof clearInterval;
 }

package/dist/types/index.d.ts

@@ -19,3 +19,4 @@ export * from './I18n.js';
 export * from './BackThreadStartConfigs.js';
 export * from './MarkTiming.js';
 export * from './SSR.js';
+export * from './JSRealm.js';

package/dist/types/index.js

@@ -19,4 +19,5 @@ export * from './I18n.js';
 export * from './BackThreadStartConfigs.js';
 export * from './MarkTiming.js';
 export * from './SSR.js';
+export * from './JSRealm.js';
 //# sourceMappingURL=index.js.map

package/dist/utils/generateTemplate.js

@@ -1,118 +1,90 @@
 // Copyright 2023 The Lynx Authors. All rights reserved.
 // Licensed under the Apache License Version 2.0 that can be found in the
 // LICENSE file in the root directory of this source tree.
-import { globalDisallowedVars, globalMuteableVars } from '../constants.js';
-const mainThreadInjectVars = [
-    'lynx',
-    'globalThis',
-    '_ReportError',
-    '_SetSourceMapRelease',
-    '__AddConfig',
-    '__AddDataset',
-    '__GetAttributes',
-    '__GetComponentID',
-    '__GetDataByKey',
-    '__GetDataset',
-    '__GetElementConfig',
-    '__GetElementUniqueID',
-    '__GetID',
-    '__GetTag',
-    '__SetAttribute',
-    '__SetConfig',
-    '__SetDataset',
-    '__SetID',
-    '__UpdateComponentID',
-    '__UpdateComponentInfo',
-    '__GetConfig',
-    '__GetAttributeByName',
-    '__UpdateListCallbacks',
-    '__AppendElement',
-    '__ElementIsEqual',
-    '__FirstElement',
-    '__GetChildren',
-    '__GetParent',
-    '__InsertElementBefore',
-    '__LastElement',
-    '__NextElement',
-    '__RemoveElement',
-    '__ReplaceElement',
-    '__ReplaceElements',
-    '__SwapElement',
-    '__CreateComponent',
-    '__CreateElement',
-    '__CreatePage',
-    '__CreateView',
-    '__CreateText',
-    '__CreateRawText',
-    '__CreateImage',
-    '__CreateScrollView',
-    '__CreateWrapperElement',
-    '__CreateList',
-    '__AddEvent',
-    '__GetEvent',
-    '__GetEvents',
-    '__SetEvents',
-    '__AddClass',
-    '__SetClasses',
-    '__GetClasses',
-    '__AddInlineStyle',
-    '__SetInlineStyles',
-    '__SetCSSId',
-    '__OnLifecycleEvent',
-    '__FlushElementTree',
-    '__LoadLepusChunk',
-    'SystemInfo',
-    '_I18nResourceTranslation',
-    '_AddEventListener',
-    '__GetTemplateParts',
-    '__MarkPartElement',
-    '__MarkTemplateElement',
-    '__GetPageElement',
-    '__ElementFromBinary',
+const currentSupportedTemplateVersion = 2;
+const globalDisallowedVars = ['navigator', 'postMessage'];
+const templateUpgraders = [
+    (template) => {
+        const defaultInjectStr = [
+            'Card',
+            'setTimeout',
+            'setInterval',
+            'clearInterval',
+            'clearTimeout',
+            'NativeModules',
+            'Component',
+            'ReactLynx',
+            'nativeAppId',
+            'Behavior',
+            'LynxJSBI',
+            'lynx',
+            // BOM API
+            'window',
+            'document',
+            'frames',
+            'location',
+            'navigator',
+            'localStorage',
+            'history',
+            'Caches',
+            'screen',
+            'alert',
+            'confirm',
+            'prompt',
+            'fetch',
+            'XMLHttpRequest',
+            '__WebSocket__', // We would provide `WebSocket` using `ProvidePlugin`
+            'webkit',
+            'Reporter',
+            'print',
+            'global',
+            // Lynx API
+            'requestAnimationFrame',
+            'cancelAnimationFrame',
+        ].join(',');
+        /**
+         * The template version 1 has no module wrapper for bts code
+         */
+        template.manifest = Object.fromEntries(Object.entries(template.manifest).map(([key, value]) => [
+            key,
+            `{init: (lynxCoreInject) => { var {${defaultInjectStr}} = lynxCoreInject.tt; var module = {exports:null}; ${value}\n return module.exports; } }`,
+        ]));
+        template.lepusCode = Object.fromEntries(Object.entries(template.lepusCode).map(([key, value]) => [
+            key,
+            `(()=>{${value}\n})();`,
+        ]));
+        template.version = 2;
+        return template;
+    },
 ];
-const backgroundInjectVars = [
-    'NativeModules',
-    'globalThis',
-    'lynx',
-    'lynxCoreInject',
-    'SystemInfo',
-];
-const backgroundInjectWithBind = [
-    'Card',
-    'Component',
-];
-const generateModuleContent = (content, injectVars, injectWithBind, muteableVars, globalDisallowedVars, isESM) => [
+const generateModuleContent = (content) => [
     '//# allFunctionsCalledOnLoad\n',
-    isESM ? 'export default ' : 'globalThis.module.exports =',
-    'function(lynx_runtime) {',
-    'const module= {exports:{}};let exports = module.exports;',
-    'var {',
-    injectVars.join(','),
-    '} = lynx_runtime;',
-    ...injectWithBind.map(nm => `const ${nm} = lynx_runtime.${nm}?.bind(lynx_runtime);`),
-    ';var globDynamicComponentEntry = \'__Card__\';',
-    globalDisallowedVars.length !== 0
-        ? `var ${globalDisallowedVars.join('=')}=undefined;`
-        : '',
-    'var {__globalProps} = lynx;',
-    'lynx_runtime._updateVars=()=>{',
-    ...muteableVars.map(nm => `${nm} = lynx_runtime.__lynxGlobalBindingValues.${nm};`),
-    '};\n',
+    '"use strict";\n',
+    `(() => {const ${globalDisallowedVars.join('=void 0,')}=void 0;module.exports = `,
     content,
-    '\n return module.exports;}',
+    '\n})()',
 ].join('');
-async function generateJavascriptUrl(obj, injectVars, injectWithBind, muteableVars, globalDisallowedVars, createJsModuleUrl, isESM, templateName) {
+async function generateJavascriptUrl(obj, createJsModuleUrl, templateName) {
     const processEntry = async ([name, content]) => [
         name,
-        await createJsModuleUrl(generateModuleContent(content, injectVars.concat(muteableVars), injectWithBind, muteableVars, globalDisallowedVars, isESM), `${templateName}-${name.replaceAll('/', '')}.js`),
+        await createJsModuleUrl(generateModuleContent(content), `${templateName}-${name.replaceAll('/', '')}.js`),
     ];
     return Promise.all(Object.entries(obj).filter(([_, content]) => typeof content === 'string').map(processEntry)).then(Object.fromEntries);
 }
 export async function generateTemplate(template, createJsModuleUrl, templateName) {
+    template.version = template.version ?? 1;
+    if (template.version > currentSupportedTemplateVersion) {
+        throw new Error(`Unsupported template, please upgrade your web-platform dependencies`);
+    }
+    let upgrader;
+    while (template.version < currentSupportedTemplateVersion
+        && (upgrader = templateUpgraders[template.version - 1])) {
+        template = upgrader(template);
+    }
     return {
         ...template,
-        lepusCode: await generateJavascriptUrl(template.lepusCode, mainThreadInjectVars, [], globalMuteableVars, templateName ? [] : globalDisallowedVars, createJsModuleUrl, true, templateName),
-        manifest: await generateJavascriptUrl(template.manifest, backgroundInjectVars, backgroundInjectWithBind, [], templateName ? [] : globalDisallowedVars, createJsModuleUrl, false, templateName),
+        lepusCode: await generateJavascriptUrl(template.lepusCode, createJsModuleUrl, templateName),
+        manifest: await generateJavascriptUrl(template.manifest, createJsModuleUrl, templateName),
     };
 }
 //# sourceMappingURL=generateTemplate.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lynx-js/web-constants",
-  "version": "0.15.7",
+  "version": "0.16.0",
   "private": false,
   "description": "",
   "keywords": [],
@@ -23,9 +23,9 @@
     "**/*.css"
   ],
   "dependencies": {
-    "@lynx-js/web-worker-rpc": "0.15.7"
+    "@lynx-js/web-worker-rpc": "0.16.0"
   },
   "devDependencies": {
-    "@lynx-js/offscreen-document": "0.1.3"
+    "@lynx-js/offscreen-document": "0.1.4"
   }
 }