chore: merge dev

Author: timhub66

.gitignore

@@ -21,3 +21,4 @@ logs
 *.log
 # eslint
 .eslintcache
+.history

docs/zh-cn/changelog.md

@@ -7,6 +7,16 @@
 - 修订版本号：每周末会进行日常 bugfix 更新。（如果有紧急的 bugfix，则任何时候都可发布）
 
 ---
+### 1.0.0-rc.20
+
+`待定`
+- **Bug Fix**
+  - 🐞 修复 从rc8升级到rc18后，子应用中使用instanceof判断出现异常 [issue 1497](https://github.com/jd-opensource/micro-app/issues/1497)。
+  - 🐞 修复 setTimeout 执行后未清理记录导致内存泄漏。
+  - 🐞 修复 子应用采用 "react": "^18.3.1"  + jdesign Dragger 上传组件异常问题。
+- **Feature**
+  - 支持 子应用A标签href自定义补齐回调钩子。
+  
 ### 1.0.0-rc.19
 
 `2025-01-15`

docs/zh-cn/micro-app-devtools.md

@@ -1,10 +1,10 @@
 # 📖简介
 `Micro-App-DevTools`是基于京东零售推出的一款为`micro-app`框架而开发的`chrome`插件，旨在方便开发者对微前端进行数据查看以及调试,提升工作效率。
-Github 地址为：[https://github.com/jd-opensource/micro-app-chrome-plugin](https://github.com/jd-opensource/micro-app-chrome-plugin)，欢迎 Star 一下
+Github 地址为：[https://github.com/micro-zoe/micro-app-chrome-plugin](https://github.com/micro-zoe/micro-app-chrome-plugin)，欢迎 Star 一下
 
 # 如何使用
 
-在chrome中输入`chrome://extensions`打开扩展程序，打开[插件下载地址](https://github.com/jd-opensource/micro-app-chrome-plugin/releases)，选择最新Release包的`micro-app-chrome-plugin.zip`
+在chrome中输入`chrome://extensions`打开扩展程序，打开[插件下载地址](https://github.com/micro-zoe/micro-app-chrome-plugin/releases)，选择最新Release包的`micro-app-chrome-plugin.zip`
 文件下载，无需解压，将已下载的插件拖入。
 
 ![扩展程序](https://img12.360buyimg.com/imagetools/jfs/t1/119438/16/38287/53001/646b50e3F9012f2e8/3bba9844bbb1431b.png)
@@ -49,7 +49,7 @@ Github 地址为：[https://github.com/jd-opensource/micro-app-chrome-plugin](ht
 #### 快捷打开方式二
 点击鼠标右键，选择micro-app下，二级菜单点子应用开发环境模拟
 
-![快捷方式](https://github.com/jd-opensource/micro-app-chrome-plugin/assets/14011130/91b40f7c-a826-4ffe-8c20-0b43a5c3bc6f)
+![快捷方式](https://github.com/micro-zoe/micro-app-chrome-plugin/assets/14011130/91b40f7c-a826-4ffe-8c20-0b43a5c3bc6f)
 
 
 ## 常见问题
@@ -61,7 +61,7 @@ Github 地址为：[https://github.com/jd-opensource/micro-app-chrome-plugin](ht
 
 ## 🤝 参与共建
 
-如果您对这个项目感兴趣，欢迎提[pull request](https://github.com/jd-opensource/micro-app-chrome-plugin/pulls)参与贡献，也欢迎 [Star](https://github.com/jd-opensource/micro-app-chrome-plugin) 支持一下 ^_^
+如果您对这个项目感兴趣，欢迎提[pull request](https://github.com/micro-zoe/micro-app-chrome-plugin/pulls)参与贡献，也欢迎 [Star](https://github.com/micro-zoe/micro-app-chrome-plugin) 支持一下 ^_^
 欢迎小伙伴们加入`Micro-App-DevTools`微信群交流^ ^   
 
 ![image](https://img12.360buyimg.com/imagetools/jfs/t1/29962/13/20207/70265/646c9851Fe104e7c1/fed2ab97e2cf5f29.png)

package.json

@@ -126,7 +126,6 @@
     "node-fetch": "~2.6.1",
     "npm-run-all": "~4.1.5",
     "pretty-bytes": "~5.5.0",
-    "react": "~17.0.2",
     "rollup": "~2.35.1",
     "rollup-plugin-terser": "~7.0.2",
     "ts-jest": "~26.5.6",

src/create_app.ts

@@ -81,6 +81,7 @@ export default class CreateApp implements AppInterface {
   public fiber = false
   public routerMode: string
   public attrs?: Record<string, string>
+  public isReloading = false
 
   constructor ({
     name,
@@ -106,6 +107,7 @@ export default class CreateApp implements AppInterface {
     // exec before getInlineModeState
     this.iframe = iframe ?? false
     this.inline = this.getInlineModeState(inline)
+    this.isReloading = false
     /**
      * NOTE:
      *  1. Navigate after micro-app created, before mount
@@ -544,7 +546,7 @@ export default class CreateApp implements AppInterface {
     if (this.umdMode && this.container && !destroy) {
       this.cloneContainer(this.source.html, this.container as HTMLElement, false)
     }
-
+    const shouldClearData = this.isReloading ? false : (clearData || destroy)
     /**
      * this.container maybe contains micro-app element, stop sandbox should exec after cloneContainer
      * NOTE:
@@ -555,7 +557,7 @@ export default class CreateApp implements AppInterface {
       umdMode: this.umdMode,
       keepRouteState: keepRouteState && !destroy,
       destroy,
-      clearData: clearData || destroy,
+      clearData: shouldClearData,
     })
 
     // dispatch unmount event to base app
@@ -762,7 +764,11 @@ export default class CreateApp implements AppInterface {
    */
   private createSandbox (): void {
     if (this.useSandbox && !this.sandBox) {
-      this.sandBox = this.iframe ? new IframeSandbox(this.name, this.url, { attrs: this.attrs }) : new WithSandBox(this.name, this.url)
+      const iframeOption = {
+        attrs: this.attrs,
+        container: this.container
+      }
+      this.sandBox = this.iframe ? new IframeSandbox(this.name, this.url, iframeOption) : new WithSandBox(this.name, this.url)
     }
   }
 

src/libs/utils.ts

@@ -760,6 +760,9 @@ export function instanceOf<T extends new (...args: unknown[]) => unknown>(
     return false
   } else if (!isFunction(constructor)) {
     throw new TypeError("Right-hand side of 'instanceof' is not callable")
+  } else if (typeof instance === 'number' || typeof instance === 'string' || typeof instance === 'boolean') {
+    // 检查 obj 是否是基本类型的包装器实例
+    return false
   }
   let proto = Object.getPrototypeOf(instance)
   while (proto) {

src/micro_app.ts

@@ -191,7 +191,15 @@ export function reload (appName: string, destroy?: boolean): Promise<boolean> {
     if (app) {
       const rootContainer = app.container && getRootContainer(app.container)
       if (rootContainer) {
-        resolve(rootContainer.reload(destroy))
+        const currentData = microApp.getData(appName)
+        app.isReloading = true
+        rootContainer.reload(destroy).then(() => {
+          if (currentData) {
+            microApp.setData(appName, currentData)
+          }
+          app.isReloading = false
+          resolve(true)
+        })
       } else {
         logWarn(`app ${appName} is not rendered, cannot use reload`)
         resolve(false)

src/sandbox/adapter.ts

@@ -45,6 +45,7 @@ export class BaseSandbox implements BaseSandboxType {
     // TODO: 是否可以和constants/SCOPE_WINDOW_ON_EVENT合并
     'onpopstate',
     'onhashchange',
+    'event',
   ]
 
   public appName: string

src/sandbox/iframe/document.ts

@@ -133,6 +133,9 @@ function patchDocumentPrototype (appName: string, microAppWindow: microAppWindow
   // query element👇
   function querySelector (this: Document, selectors: string): any {
     const _this = getBindTarget(this)
+    if (selectors === 'body') {
+      return this.body
+    }
     if (
       !selectors ||
       isUniqueElement(selectors) ||
@@ -302,6 +305,9 @@ function patchDocumentProperty (
       configurable: true,
       get: () => {
         throttleDeferForIframeAppName(appName)
+        if (tagName === 'body') {
+          return sandbox.options.container?.querySelector('micro-app-body')
+        }
         return rawDocument[tagName]
       },
       set: (value: unknown) => { rawDocument[tagName] = value },

src/sandbox/iframe/element.ts

@@ -13,6 +13,7 @@ import {
   isDocumentFragment,
   isFunction,
   isBrowser,
+  isArray,
 } from '../../libs/utils'
 import {
   updateElementInfo,
@@ -34,7 +35,7 @@ export function patchElement (
   sandbox: IframeSandbox,
 ): void {
   patchIframeNode(appName, microAppWindow, sandbox)
-  patchIframeAttribute(url, microAppWindow)
+  patchIframeAttribute(url, microAppWindow, appName)
 }
 
 /**
@@ -229,7 +230,7 @@ function patchIframeNode (
   })
 }
 
-function patchIframeAttribute (url: string, microAppWindow: microAppWindowType): void {
+function patchIframeAttribute (url: string, microAppWindow: microAppWindowType, appName: string): void {
   const microRootElement = microAppWindow.Element
   const rawMicroSetAttribute = microRootElement.prototype.setAttribute
 
@@ -241,7 +242,15 @@ function patchIframeAttribute (url: string, microAppWindow: microAppWindowType):
     ) {
       this.setAttribute(key, value)
     } else {
-      if (
+      let appPlugins = microApp?.options?.plugins?.modules?.[appName]
+      if (!isArray(appPlugins)) {
+        appPlugins = []
+      }
+      const aHrefResolver = appPlugins[0]?.aHrefResolver
+      if (key === 'href' && /^a$/i.test(this.tagName) && typeof aHrefResolver === 'function') {
+        // 试验性质：a 标签开放自定义补齐功能
+        value = aHrefResolver(value, appName, url)
+      } else if (
         ((key === 'src' || key === 'srcset') && /^(img|script|video|audio|source|embed)$/i.test(this.tagName)) ||
         (key === 'href' && /^(link|image)$/i.test(this.tagName)) ||
         // If it is the anchor tag,eg. <a href="#xxx"/>, the path will not be completed

src/sandbox/iframe/index.ts

@@ -60,6 +60,11 @@ import {
   patchElementTree
 } from '../adapter'
 
+interface IOption {
+  container: HTMLElement | ShadowRoot | null,
+  [key: string]: any
+}
+
 export default class IframeSandbox {
   static activeCount = 0 // number of active sandbox
   private active = false
@@ -81,11 +86,11 @@ export default class IframeSandbox {
   // TODO: 放到 super中定义，super(appName, url)，with沙箱也需要简化
   public appName: string
   public url: string
-  public options?: Record<string, any>
+  public options: IOption
   // reset mount, unmount when stop in default mode
   public clearHijackUmdHooks!: () => void
 
-  constructor (appName: string, url: string, options: Record<string, any>) {
+  constructor (appName: string, url: string, options: IOption) {
     this.appName = appName
     this.url = url
     this.options = options

src/sandbox/scoped_css.ts

@@ -519,7 +519,8 @@ export default function scopedCSS (
         linkPath,
       )
       const observer = new MutationObserver(() => {
-        const isPrefixed = styleElement.textContent && new RegExp(prefix).test(styleElement.textContent)
+        const escapedPrefix = prefix.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+        const isPrefixed = styleElement.textContent && new RegExp(escapedPrefix).test(styleElement.textContent)
         observer.disconnect()
         if (!isPrefixed) {
           styleElement.__MICRO_APP_HAS_SCOPED__ = false

src/sandbox/with/window.ts

@@ -294,8 +294,13 @@ function patchWindowEffect (microAppWindow: microAppWindowType, appName: string)
     timeout?: number,
     ...args: any[]
   ): number {
-    const timeoutId = rawSetTimeout.call(rawWindow, handler, timeout, ...args)
-    timeoutIdMap.set(timeoutId, { handler, timeout, args })
+    const setTimeoutHander = function(...args: any[]) {
+      timeoutIdMap.delete(timeoutId)
+      typeof handler === 'function' && handler(...args)
+    }
+    const handlerWithCleanup: TimerHandler = typeof handler === 'string' ? handler : setTimeoutHander
+    const timeoutId = rawSetTimeout.call(rawWindow, handlerWithCleanup, timeout, ...args)
+    timeoutIdMap.set(timeoutId, { handler: handlerWithCleanup, timeout, args })
     return timeoutId
   }
 

typings/global.d.ts

@@ -188,6 +188,7 @@ declare module '@micro-app/types' {
     routerMode: string // virtual router mode
     isPrefetch: boolean // whether prefetch app, default is false
     isPrerender: boolean
+    isReloading?: boolean
     prefetchLevel?: number
     // defaultPage: string // default page when mount
     // baseroute: string // route prefix, default is ''
@@ -311,6 +312,7 @@ declare module '@micro-app/types' {
         loader?: (code: string, url: string) => string
         // html processor
         processHtml?: (code: string, url: string) => string
+        aHrefResolver?: (hrefValue: string, appName: string, appUrl: string) => string
       }>
     }
   }