@micro-zoe/micro-app 1.0.0-rc.18 → 1.0.0-rc.19

package/README.md

@@ -149,7 +149,7 @@ For more commands, see [DEVELOP](https://github.com/jd-opensource/micro-app/blob
 
 # Contributors
 <a href="https://github.com/jd-opensource/micro-app/graphs/contributors">
-  <img src="https://contrib.rocks/image?repo=micro-zoe/micro-app" />
+  <img src="https://contrib.rocks/image?repo=jd-opensource/micro-app" />
 </a>
 
 # License

package/README.zh-cn.md

@@ -148,7 +148,7 @@ yarn start # 访问 http://localhost:3000
 
 # 贡献者们
 <a href="https://github.com/jd-opensource/micro-app/graphs/contributors">
-  <img src="https://contrib.rocks/image?repo=micro-zoe/micro-app" />
+  <img src="https://contrib.rocks/image?repo=jd-opensource/micro-app" />
 </a>
 
 

package/lib/index.esm.js

@@ -1,4 +1,4 @@
-const version = '1.0.0-rc.18';
+const version = '1.0.0-rc.19';
 // do not use isUndefined
 const isBrowser = typeof window !== 'undefined';
 // do not use isUndefined
@@ -1232,6 +1232,15 @@ function scopedCSS(styleElement, app, linkPath) {
             parser = new CSSParser();
         if (styleElement.textContent) {
             commonAction(styleElement, app.name, prefix, app.url, linkPath);
+            const observer = new MutationObserver(() => {
+                const isPrefixed = styleElement.textContent && new RegExp(prefix).test(styleElement.textContent);
+                observer.disconnect();
+                if (!isPrefixed) {
+                    styleElement.__MICRO_APP_HAS_SCOPED__ = false;
+                }
+                scopedCSS(styleElement, app, linkPath);
+            });
+            observer.observe(styleElement, { childList: true, characterData: true });
         }
         else {
             const observer = new MutationObserver(function () {
@@ -6516,7 +6525,7 @@ function patchIframeAttribute(url, microAppWindow) {
 }
 
 class IframeSandbox {
-    constructor(appName, url) {
+    constructor(appName, url, options) {
         this.active = false;
         // Properties that can be escape to rawWindow
         this.escapeProperties = [];
@@ -6528,9 +6537,10 @@ class IframeSandbox {
         };
         this.appName = appName;
         this.url = url;
+        this.options = options;
         const rawLocation = globalEnv.rawWindow.location;
         const browserHost = rawLocation.protocol + '//' + rawLocation.host;
-        this.deleteIframeElement = this.createIframeElement(appName, browserHost + rawLocation.pathname);
+        this.deleteIframeElement = this.createIframeElement(appName, browserHost + rawLocation.pathname, options);
         this.microAppWindow = this.iframe.contentWindow;
         this.patchIframe(this.microAppWindow, (resolve) => {
             // create new html to iframe
@@ -6561,14 +6571,9 @@ class IframeSandbox {
      * @param browserPath browser origin
      * @returns release callback
      */
-    createIframeElement(appName, browserPath) {
+    createIframeElement(appName, browserPath, options) {
         this.iframe = pureCreateElement('iframe');
-        const iframeAttrs = {
-            id: appName,
-            src: microApp.options.iframeSrc || browserPath,
-            style: 'display: none',
-            'powered-by': 'micro-app',
-        };
+        const iframeAttrs = Object.assign(Object.assign({}, options === null || options === void 0 ? void 0 : options.attrs), { id: appName, src: microApp.options.iframeSrc || browserPath, style: 'display: none', 'powered-by': 'micro-app' });
         Object.keys(iframeAttrs).forEach((key) => this.iframe.setAttribute(key, iframeAttrs[key]));
         // effect action during construct
         globalEnv.rawDocument.body.appendChild(this.iframe);
@@ -6907,7 +6912,7 @@ IframeSandbox.activeCount = 0; // number of active sandbox
 // micro app instances
 const appInstanceMap = new Map();
 class CreateApp {
-    constructor({ name, url, container, scopecss, useSandbox, inline, iframe, ssrUrl, isPrefetch, prefetchLevel, routerMode, }) {
+    constructor({ name, url, container, scopecss, useSandbox, inline, iframe, ssrUrl, isPrefetch, prefetchLevel, routerMode, attrs, }) {
         this.state = appStates.CREATED;
         this.keepAliveState = null;
         this.loadSourceLevel = 0;
@@ -6923,6 +6928,7 @@ class CreateApp {
         this.url = url;
         this.useSandbox = useSandbox;
         this.scopecss = this.useSandbox && scopecss;
+        this.attrs = attrs;
         // exec before getInlineModeState
         this.iframe = iframe !== null && iframe !== void 0 ? iframe : false;
         this.inline = this.getInlineModeState(inline);
@@ -7459,7 +7465,7 @@ class CreateApp {
      */
     createSandbox() {
         if (this.useSandbox && !this.sandBox) {
-            this.sandBox = this.iframe ? new IframeSandbox(this.name, this.url) : new WithSandBox(this.name, this.url);
+            this.sandBox = this.iframe ? new IframeSandbox(this.name, this.url, { attrs: this.attrs }) : new WithSandBox(this.name, this.url);
         }
     }
     // set app state
@@ -8586,6 +8592,12 @@ function defineElement(tagName) {
         }
         // create app instance
         handleCreateApp() {
+            const attrs = {};
+            Array.prototype.slice.call(this.attributes).forEach(({ name, value }) => {
+                if (name.startsWith('data-')) {
+                    attrs[name] = value;
+                }
+            });
             const createAppInstance = () => {
                 var _a;
                 return new CreateApp({
@@ -8598,6 +8610,7 @@ function defineElement(tagName) {
                     iframe: this.getDisposeResult('iframe'),
                     ssrUrl: this.ssrUrl,
                     routerMode: this.getMemoryRouterMode(),
+                    attrs
                 });
             };
             /**