@micro-zoe/micro-app 1.0.0-rc.20 → 1.0.0-rc.22

package/lib/index.d.ts

@@ -148,6 +148,7 @@ declare module '@micro-zoe/micro-app/libs/utils' {
     export function isAudioElement(target: unknown): target is HTMLAudioElement;
     export function isVideoElement(target: unknown): target is HTMLVideoElement;
     export function isLinkElement(target: unknown): target is HTMLLinkElement;
+    export function isBodyElement(target: unknown): target is HTMLBodyElement;
     export function isStyleElement(target: unknown): target is HTMLStyleElement;
     export function isScriptElement(target: unknown): target is HTMLScriptElement;
     export function isIFrameElement(target: unknown): target is HTMLIFrameElement;

package/lib/index.esm.js

@@ -1,4 +1,4 @@
-const version = '1.0.0-rc.20';
+const version = '1.0.0-rc.22';
 // do not use isUndefined
 const isBrowser = typeof window !== 'undefined';
 // do not use isUndefined
@@ -101,6 +101,9 @@ function isVideoElement(target) {
 function isLinkElement(target) {
     return toTypeString(target) === '[object HTMLLinkElement]';
 }
+function isBodyElement(target) {
+    return toTypeString(target) === '[object HTMLBodyElement]';
+}
 function isStyleElement(target) {
     return toTypeString(target) === '[object HTMLStyleElement]';
 }
@@ -1234,16 +1237,17 @@ function scopedCSS(styleElement, app, linkPath) {
         const prefix = createPrefix(app.name);
         if (!parser)
             parser = new CSSParser();
+        const escapeRegExp = (regStr) => regStr.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
         if (styleElement.textContent) {
             commonAction(styleElement, app.name, prefix, app.url, linkPath);
             const observer = new MutationObserver(() => {
-                const escapedPrefix = prefix.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+                const escapedPrefix = escapeRegExp(prefix);
                 const isPrefixed = styleElement.textContent && new RegExp(escapedPrefix).test(styleElement.textContent);
                 observer.disconnect();
                 if (!isPrefixed) {
                     styleElement.__MICRO_APP_HAS_SCOPED__ = false;
+                    scopedCSS(styleElement, app, linkPath);
                 }
-                scopedCSS(styleElement, app, linkPath);
             });
             observer.observe(styleElement, { childList: true, characterData: true });
         }
@@ -1678,6 +1682,8 @@ const BASE_SCOPE_WINDOW_EVENT = [
     'appstate-change',
     'statechange',
     'mounted',
+    'error'
+    // 'beforeunload', // remove at 2024.5.30 by cangdu
 ];
 // bind event of with sandbox
 const SCOPE_WINDOW_EVENT_OF_WITH = BASE_SCOPE_WINDOW_EVENT;
@@ -2124,7 +2130,7 @@ function execScripts(app, initHook) {
  * @param callback callback of module script
  */
 function runScript(address, app, scriptInfo, callback, replaceElement) {
-    var _a;
+    var _a, _b;
     try {
         actionsBeforeRunScript(app);
         const appSpaceData = scriptInfo.appSpace[app.name];
@@ -2164,9 +2170,16 @@ function runScript(address, app, scriptInfo, callback, replaceElement) {
         }
     }
     catch (e) {
-        console.error(`[micro-app from ${replaceElement ? 'runDynamicScript' : 'runScript'}] app ${app.name}: `, e, address);
+        console.warn(`[micro-app from ${replaceElement ? 'runDynamicScript' : 'runScript'}] app ${app.name}: `, e, address);
         // throw error in with sandbox to parent app
-        throw e;
+        const error = e;
+        let throwError = true;
+        if (typeof ((_b = microApp === null || microApp === void 0 ? void 0 : microApp.options) === null || _b === void 0 ? void 0 : _b.excludeRunScriptFilter) === 'function') {
+            throwError = microApp.options.excludeRunScriptFilter(address, error, app.name, app.url) !== true;
+        }
+        if (throwError) {
+            throw e;
+        }
     }
 }
 /**
@@ -2324,53 +2337,49 @@ function processCode(configs, code, address) {
 
 /**
  * Recursively process each child element
- * @param parent parent element
+ * @param body body element
  * @param app app
  * @param microAppHead micro-app-head element
  */
-function flatChildren(parent, app, microAppHead, fiberStyleTasks) {
-    const children = Array.from(parent.children);
-    children.length && children.forEach((child) => {
-        flatChildren(child, app, microAppHead, fiberStyleTasks);
-    });
-    for (const dom of children) {
-        if (isLinkElement(dom)) {
-            if (dom.hasAttribute('exclude') || checkExcludeUrl(dom.getAttribute('href'), app.name)) {
-                parent.replaceChild(document.createComment('link element with exclude attribute ignored by micro-app'), dom);
-            }
-            else if (!(dom.hasAttribute('ignore') || checkIgnoreUrl(dom.getAttribute('href'), app.name))) {
-                extractLinkFromHtml(dom, parent, app);
-            }
-            else if (dom.hasAttribute('href')) {
-                globalEnv.rawSetAttribute.call(dom, 'href', CompletionPath(dom.getAttribute('href'), app.url));
-            }
+function flatBodyChildren(body, app, fiberStyleTasks) {
+    if (!body || !isBodyElement(body)) {
+        return;
+    }
+    const links = Array.from(body.getElementsByTagName('link'));
+    links.map((dom) => {
+        if (dom.hasAttribute('exclude') || checkExcludeUrl(dom.getAttribute('href'), app.name)) {
+            dom.parentElement.replaceChild(document.createComment('link element with exclude attribute ignored by micro-app'), dom);
         }
-        else if (isStyleElement(dom)) {
-            if (dom.hasAttribute('exclude')) {
-                parent.replaceChild(document.createComment('style element with exclude attribute ignored by micro-app'), dom);
-            }
-            else if (app.scopecss && !dom.hasAttribute('ignore')) {
-                injectFiberTask(fiberStyleTasks, () => scopedCSS(dom, app));
-            }
+        else if (!(dom.hasAttribute('ignore') || checkIgnoreUrl(dom.getAttribute('href'), app.name))) {
+            extractLinkFromHtml(dom, dom.parentElement, app);
         }
-        else if (isScriptElement(dom)) {
-            extractScriptElement(dom, parent, app);
+        else if (dom.hasAttribute('href')) {
+            globalEnv.rawSetAttribute.call(dom, 'href', CompletionPath(dom.getAttribute('href'), app.url));
         }
-        else if (isImageElement(dom) && dom.hasAttribute('src')) {
+        return dom;
+    });
+    const styles = Array.from(body.getElementsByTagName('style'));
+    styles.map((dom) => {
+        if (dom.hasAttribute('exclude')) {
+            dom.parentElement.replaceChild(document.createComment('style element with exclude attribute ignored by micro-app'), dom);
+        }
+        else if (app.scopecss && !dom.hasAttribute('ignore')) {
+            injectFiberTask(fiberStyleTasks, () => scopedCSS(dom, app));
+        }
+        return dom;
+    });
+    const scripts = Array.from(body.getElementsByTagName('script'));
+    scripts.map((dom) => {
+        extractScriptElement(dom, dom.parentElement, app);
+        return dom;
+    });
+    const images = Array.from(body.getElementsByTagName('img'));
+    images.map((dom) => {
+        if (dom.hasAttribute('src')) {
             globalEnv.rawSetAttribute.call(dom, 'src', CompletionPath(dom.getAttribute('src'), app.url));
         }
-        /**
-         * Don't remove meta and title, they have some special scenes
-         * e.g.
-         * document.querySelector('meta[name="viewport"]') // for flexible
-         * document.querySelector('meta[name="baseurl"]').baseurl // for api request
-         *
-         * Title point to main app title, child app title used to be compatible with some special scenes
-         */
-        // else if (dom instanceof HTMLMetaElement || dom instanceof HTMLTitleElement) {
-        //   parent.removeChild(dom)
-        // }
-    }
+        return dom;
+    });
 }
 /**
  * Extract link and script, bind style scope
@@ -2387,7 +2396,7 @@ function extractSourceDom(htmlStr, app) {
         return logError(msg, app.name);
     }
     const fiberStyleTasks = app.isPrefetch || app.fiber ? [] : null;
-    flatChildren(wrapElement, app, microAppHead, fiberStyleTasks);
+    flatBodyChildren(wrapElement, app, fiberStyleTasks);
     /**
      * Style and link are parallel, as it takes a lot of time for link to request resources. During this period, style processing can be performed to improve efficiency.
      */
@@ -6005,9 +6014,9 @@ function patchDocumentPrototype(appName, microAppWindow) {
     }
     // query element👇
     function querySelector(selectors) {
-        var _a;
+        var _a, _b;
         const _this = getBindTarget(this);
-        if (selectors === 'body') {
+        if (selectors === 'body' && ((_a = microApp === null || microApp === void 0 ? void 0 : microApp.options) === null || _a === void 0 ? void 0 : _a.inheritBaseBody) !== true) {
             return this.body;
         }
         if (!selectors ||
@@ -6026,7 +6035,7 @@ function patchDocumentPrototype(appName, microAppWindow) {
          *
          * Issue: https://github.com/jd-opensource/micro-app/issues/1335
          */
-        const result = (_a = appInstanceMap.get(appName)) === null || _a === void 0 ? void 0 : _a.querySelector(selectors);
+        const result = (_b = appInstanceMap.get(appName)) === null || _b === void 0 ? void 0 : _b.querySelector(selectors);
         return result || selectors === 'base' ? result : rawMicroQuerySelector.call(microDocument, selectors);
     }
     function querySelectorAll(selectors) {
@@ -6151,10 +6160,10 @@ function patchDocumentProperty(appName, microAppWindow, sandbox) {
             enumerable: true,
             configurable: true,
             get: () => {
-                var _a;
+                var _a, _b;
                 throttleDeferForIframeAppName(appName);
-                if (tagName === 'body') {
-                    return (_a = sandbox.options.container) === null || _a === void 0 ? void 0 : _a.querySelector('micro-app-body');
+                if (tagName === 'body' && ((_a = microApp === null || microApp === void 0 ? void 0 : microApp.options) === null || _a === void 0 ? void 0 : _a.inheritBaseBody) !== true) {
+                    return ((_b = sandbox.options.container) === null || _b === void 0 ? void 0 : _b.querySelector('micro-app-body')) || rawDocument[tagName];
                 }
                 return rawDocument[tagName];
             },