fix(core): When application uninstall active release sandbox instance

Author: zhoushaw

dev/main/src/config.ts

@@ -22,11 +22,12 @@ let defaultConfig: interfaces.Options = {
     {
       name: 'vue',
       activeWhen: '/vue',
-      // cache: true,
+      cache: false,
       entry: 'http://localhost:2666',
     },
     {
       name: 'vue2',
+      cache: false,
       activeWhen: '/vue2',
       entry: 'http://localhost:2777',
     },
@@ -61,6 +62,7 @@ let defaultConfig: interfaces.Options = {
 GarfishInstance.registerApp({
   name: 'react',
   activeWhen: '/react',
+  cache: false,
   // basename: '/garfish_master',
   entry: 'http://localhost:2444',
   // domGetter: ()=>document.querySelector('#submoduleByRouter'),

packages/browser-vm/src/pluginify.ts

@@ -2,6 +2,7 @@ import { interfaces } from '@garfish/core';
 import { warn, isPlainObject } from '@garfish/utils';
 import { Module } from './types';
 import { Sandbox } from './sandbox';
+import { sandboxMap } from './utils';
 
 declare module '@garfish/core' {
   export interface Garfish {
@@ -56,6 +57,7 @@ function rewriteAppAndSandbox(
   sandbox: Sandbox,
 ) {
   const originExecScript = sandbox.execScript;
+  sandboxMap.set(sandbox);
   // Rewrite sandbox attributes
   sandbox.loader = Garfish.loader;
   sandbox.execScript = (code, env, url, options) => {
@@ -135,6 +137,7 @@ function createOptions(Garfish: interfaces.Garfish) {
     afterUnmount(_, appInstance) {
       if (!appInstance.vmSandbox) return;
       appInstance.vmSandbox.reset();
+      sandboxMap.del(appInstance.vmSandbox);
     },
 
     afterMount(_, appInstance) {

packages/browser-vm/src/proxyInterceptor/document.ts

@@ -33,7 +33,7 @@ export function createGetter(sandbox: Sandbox) {
         return function (tagName, options) {
           const el = value.call(document, tagName, options);
           if (isObject(el)) {
-            sandboxMap.set(el, sandbox);
+            sandboxMap.setElementTag(el, sandbox);
             if (__DEV__) {
               el.__SANDBOX__ = true;
             }

packages/browser-vm/src/symbolTypes.ts

@@ -6,3 +6,4 @@ export const __windowBind__ = Symbol.for('garfish.windowBind');
 export const __sandboxMap__ = Symbol.for('garfish.sandboxMap');
 export const __documentBind__ = Symbol.for('garfish.documentBind');
 export const __garfishGlobal__ = Symbol.for('garfish.globalObject');
+export const __elementSandboxTag__ = Symbol.for('garfish.elementSandboxTag');

packages/browser-vm/src/utils.ts

@@ -1,10 +1,15 @@
 import { hasOwn, makeMap, nextTick } from '@garfish/utils';
 import { Sandbox } from './sandbox';
 import { FakeWindow } from './types';
-import { __proxyNode__, __sandboxMap__ } from './symbolTypes';
+import {
+  __elementSandboxTag__,
+  __proxyNode__,
+  __sandboxMap__,
+} from './symbolTypes';
 
 // https://tc39.es/ecma262/#sec-function-properties-of-the-global-object
-const esGlobalMethods = ( // Function properties of the global object // Function properties of the global object
+const esGlobalMethods = // Function properties of the global object // Function properties of the global object
+(
   'eval,isFinite,isNaN,parseFloat,parseInt,' +
   // URL handling functions
   'decodeURI,decodeURIComponent,encodeURI,encodeURIComponent,' +
@@ -25,23 +30,37 @@ export const optimizeMethods = [...esGlobalMethods].filter((v) => v !== 'eval');
 
 // The sandbox may be used alone, to ensure that the `sandboxMap` is globally unique,
 // because we will only rewrite `appendChild` once
-export const sandboxMap = (() => {
-  if (!(window as FakeWindow)[__sandboxMap__]) {
-    (window as FakeWindow)[__sandboxMap__] = {
-      deps: new WeakMap(),
-
-      get(element: Element): Sandbox {
-        return this.deps.get(element);
-      },
-
-      set(element: Element, sandbox: Sandbox) {
-        if (this.deps.get(element)) return;
-        this.deps.set(element, sandbox);
-      },
-    };
-  }
-  return (window as FakeWindow)[__sandboxMap__];
-})();
+let sandboxList: Map<number, Sandbox> = new Map();
+if (!(window as FakeWindow)[__sandboxMap__]) {
+  (window as FakeWindow)[__sandboxMap__] = sandboxList;
+} else {
+  sandboxList = (window as FakeWindow)[__sandboxMap__];
+}
+
+export const sandboxMap = {
+  sandboxMap: sandboxList,
+
+  get(element: Element): Sandbox {
+    if (!element) return;
+    const sandboxId = element[__elementSandboxTag__];
+    if (typeof sandboxId !== 'number') return;
+    return this.sandboxMap.get(sandboxId);
+  },
+
+  setElementTag(element: Element, sandbox: Sandbox) {
+    if (!element) return;
+    element[__elementSandboxTag__] = sandbox.id;
+  },
+
+  set(sandbox: Sandbox) {
+    if (this.sandboxMap.get(sandbox.id)) return;
+    this.sandboxMap.set(sandbox.id, sandbox);
+  },
+
+  del(sandbox: Sandbox) {
+    this.sandboxMap.delete(sandbox.id);
+  },
+};
 
 export function handlerParams(args: IArguments | Array<any>) {
   args = Array.isArray(args) ? args : Array.from(args);