@zstackui/qiankun 2.6.3-beta-5

package/lib/prefetch.js

@@ -0,0 +1,132 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.doPrefetchStrategy = doPrefetchStrategy;
+exports.prefetchImmediately = prefetchImmediately;
+var _isFunction2 = _interopRequireDefault(require("lodash/isFunction"));
+var _tslib = require("tslib");
+var _importHtmlEntry = require("import-html-entry");
+var _singleSpa = require("single-spa");
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); } /**
+ * @author Kuitos
+ * @since 2019-02-26
+ */
+// RIC and shim for browsers setTimeout() without it
+var requestIdleCallback = window.requestIdleCallback || function requestIdleCallback(cb) {
+  var start = Date.now();
+  return setTimeout(function () {
+    cb({
+      didTimeout: false,
+      timeRemaining: function timeRemaining() {
+        return Math.max(0, 50 - (Date.now() - start));
+      }
+    });
+  }, 1);
+};
+var isSlowNetwork = navigator.connection ? navigator.connection.saveData || navigator.connection.type !== 'wifi' && navigator.connection.type !== 'ethernet' && /([23])g/.test(navigator.connection.effectiveType) : false;
+/**
+ * prefetch assets, do nothing while in mobile network
+ * @param entry
+ * @param opts
+ */
+function prefetch(entry, opts) {
+  var _this = this;
+  if (!navigator.onLine || isSlowNetwork) {
+    // Don't prefetch if in a slow network or offline
+    return;
+  }
+  requestIdleCallback(function () {
+    return (0, _tslib.__awaiter)(_this, void 0, void 0, /*#__PURE__*/_regenerator().m(function _callee() {
+      var _yield$importEntry, getExternalScripts, getExternalStyleSheets;
+      return _regenerator().w(function (_context) {
+        while (1) switch (_context.n) {
+          case 0:
+            _context.n = 1;
+            return (0, _importHtmlEntry.importEntry)(entry, opts);
+          case 1:
+            _yield$importEntry = _context.v;
+            getExternalScripts = _yield$importEntry.getExternalScripts;
+            getExternalStyleSheets = _yield$importEntry.getExternalStyleSheets;
+            requestIdleCallback(getExternalStyleSheets);
+            requestIdleCallback(getExternalScripts);
+          case 2:
+            return _context.a(2);
+        }
+      }, _callee);
+    }));
+  });
+}
+function prefetchAfterFirstMounted(apps, opts) {
+  window.addEventListener('single-spa:first-mount', function listener() {
+    var notLoadedApps = apps.filter(function (app) {
+      return (0, _singleSpa.getAppStatus)(app.name) === _singleSpa.NOT_LOADED;
+    });
+    if (process.env.NODE_ENV === 'development') {
+      var mountedApps = (0, _singleSpa.getMountedApps)();
+      console.log("[qiankun] prefetch starting after ".concat(mountedApps, " mounted..."), notLoadedApps);
+    }
+    notLoadedApps.forEach(function (_ref) {
+      var entry = _ref.entry;
+      return prefetch(entry, opts);
+    });
+    window.removeEventListener('single-spa:first-mount', listener);
+  });
+}
+function prefetchImmediately(apps, opts) {
+  if (process.env.NODE_ENV === 'development') {
+    console.log('[qiankun] prefetch starting for apps...', apps);
+  }
+  apps.forEach(function (_ref2) {
+    var entry = _ref2.entry;
+    return prefetch(entry, opts);
+  });
+}
+function doPrefetchStrategy(apps, prefetchStrategy, importEntryOpts) {
+  var _this2 = this;
+  var appsName2Apps = function appsName2Apps(names) {
+    return apps.filter(function (app) {
+      return names.includes(app.name);
+    });
+  };
+  if (Array.isArray(prefetchStrategy)) {
+    prefetchAfterFirstMounted(appsName2Apps(prefetchStrategy), importEntryOpts);
+  } else if ((0, _isFunction2.default)(prefetchStrategy)) {
+    (function () {
+      return (0, _tslib.__awaiter)(_this2, void 0, void 0, /*#__PURE__*/_regenerator().m(function _callee2() {
+        var _yield$prefetchStrate, _yield$prefetchStrate2, criticalAppNames, _yield$prefetchStrate3, minorAppsName;
+        return _regenerator().w(function (_context2) {
+          while (1) switch (_context2.n) {
+            case 0:
+              _context2.n = 1;
+              return prefetchStrategy(apps);
+            case 1:
+              _yield$prefetchStrate = _context2.v;
+              _yield$prefetchStrate2 = _yield$prefetchStrate.criticalAppNames;
+              criticalAppNames = _yield$prefetchStrate2 === void 0 ? [] : _yield$prefetchStrate2;
+              _yield$prefetchStrate3 = _yield$prefetchStrate.minorAppsName;
+              minorAppsName = _yield$prefetchStrate3 === void 0 ? [] : _yield$prefetchStrate3;
+              prefetchImmediately(appsName2Apps(criticalAppNames), importEntryOpts);
+              prefetchAfterFirstMounted(appsName2Apps(minorAppsName), importEntryOpts);
+            case 2:
+              return _context2.a(2);
+          }
+        }, _callee2);
+      }));
+    })();
+  } else {
+    switch (prefetchStrategy) {
+      case true:
+        prefetchAfterFirstMounted(apps, importEntryOpts);
+        break;
+      case 'all':
+        prefetchImmediately(apps, importEntryOpts);
+        break;
+      default:
+        break;
+    }
+  }
+}

package/lib/sandbox/common.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @author Kuitos
+ * @since 2020-04-13
+ */
+type AppInstance = {
+    name: string;
+    window: WindowProxy;
+};
+/**
+ * get the app that running tasks at current tick
+ */
+export declare function getCurrentRunningApp(): AppInstance | null;
+export declare function setCurrentRunningApp(appInstance: {
+    name: string;
+    window: WindowProxy;
+} | null): void;
+export declare function getTargetValue(target: any, value: any): any;
+export declare function getProxyPropertyValue(getter: CallableFunction): any;
+export declare function getZsLocalStorage(_proxyName: string): any;
+export declare function getZsSessionStorage(_proxyName: string): any;
+export {};

package/lib/sandbox/common.js

@@ -0,0 +1,169 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getCurrentRunningApp = getCurrentRunningApp;
+exports.getProxyPropertyValue = getProxyPropertyValue;
+exports.getTargetValue = getTargetValue;
+exports.getZsLocalStorage = getZsLocalStorage;
+exports.getZsSessionStorage = getZsSessionStorage;
+exports.setCurrentRunningApp = setCurrentRunningApp;
+var _utils = require("../utils");
+/**
+ * @author Kuitos
+ * @since 2020-04-13
+ */
+
+var currentRunningApp = null;
+/**
+ * get the app that running tasks at current tick
+ */
+function getCurrentRunningApp() {
+  return currentRunningApp;
+}
+function setCurrentRunningApp(appInstance) {
+  // set currentRunningApp and it's proxySandbox to global window, as its only use case is for document.createElement from now on, which hijacked by a global way
+  currentRunningApp = appInstance;
+}
+var functionBoundedValueMap = new WeakMap();
+function getTargetValue(target, _value) {
+  /*
+    仅绑定 isCallable && !isBoundedFunction && !isConstructable 的函数对象，如 window.console、window.atob 这类，不然微应用中调用时会抛出 Illegal invocation 异常
+    目前没有完美的检测方式，这里通过 prototype 中是否还有可枚举的拓展方法的方式来判断
+    @warning 这里不要随意替换成别的判断方式，因为可能触发一些 edge case（比如在 lodash.isFunction 在 iframe 上下文中可能由于调用了 top window 对象触发的安全异常）
+   */
+  if ((0, _utils.isCallable)(_value) && !(0, _utils.isBoundedFunction)(_value) && !(0, _utils.isConstructable)(_value)) {
+    var cachedBoundFunction = functionBoundedValueMap.get(_value);
+    if (cachedBoundFunction) {
+      return cachedBoundFunction;
+    }
+    var boundValue = Function.prototype.bind.call(_value, target);
+    // some callable function has custom fields, we need to copy the enumerable props to boundValue. such as moment function.
+    // use for..in rather than Object.keys.forEach for performance reason
+    // eslint-disable-next-line guard-for-in,no-restricted-syntax
+    for (var key in _value) {
+      boundValue[key] = _value[key];
+    }
+    // copy prototype if bound function not have but target one have
+    // as prototype is non-enumerable mostly, we need to copy it from target function manually
+    if (_value.hasOwnProperty('prototype') && !boundValue.hasOwnProperty('prototype')) {
+      // we should not use assignment operator to set boundValue prototype like `boundValue.prototype = value.prototype`
+      // as the assignment will also look up prototype chain while it hasn't own prototype property,
+      // when the lookup succeed, the assignment will throw an TypeError like `Cannot assign to read only property 'prototype' of function` if its descriptor configured with writable false or just have a getter accessor
+      // see https://github.com/umijs/qiankun/issues/1121
+      Object.defineProperty(boundValue, 'prototype', {
+        value: _value.prototype,
+        enumerable: false,
+        writable: true
+      });
+    }
+    // Some util, like `function isNative() {  return typeof Ctor === 'function' && /native code/.test(Ctor.toString()) }` relies on the original `toString()` result
+    // but bound functions will always return "function() {[native code]}" for `toString`, which is misleading
+    if (typeof _value.toString === 'function') {
+      var valueHasInstanceToString = _value.hasOwnProperty('toString') && !boundValue.hasOwnProperty('toString');
+      var boundValueHasPrototypeToString = boundValue.toString === Function.prototype.toString;
+      if (valueHasInstanceToString || boundValueHasPrototypeToString) {
+        var originToStringDescriptor = Object.getOwnPropertyDescriptor(valueHasInstanceToString ? _value : Function.prototype, 'toString');
+        Object.defineProperty(boundValue, 'toString', Object.assign(Object.assign({}, originToStringDescriptor), (originToStringDescriptor === null || originToStringDescriptor === void 0 ? void 0 : originToStringDescriptor.get) ? null : {
+          value: function value() {
+            return _value.toString();
+          }
+        }));
+      }
+    }
+    functionBoundedValueMap.set(_value, boundValue);
+    return boundValue;
+  }
+  return _value;
+}
+var getterInvocationResultMap = new WeakMap();
+function getProxyPropertyValue(getter) {
+  var getterResult = getterInvocationResultMap.get(getter);
+  if (!getterResult) {
+    var result = getter();
+    getterInvocationResultMap.set(getter, result);
+    return result;
+  }
+  return getterResult;
+}
+function getZsLocalStorage(_proxyName) {
+  var proxyName = _proxyName.split('_')[0];
+  var fakeStorage = {
+    getItem: function getItem(key) {
+      var prefixedKey = proxyName + key;
+      return localStorage.getItem(prefixedKey);
+    },
+    setItem: function setItem(key, value) {
+      var prefixedKey = proxyName + key;
+      localStorage.setItem(prefixedKey, String(value));
+    },
+    key: function key(nth) {
+      var _a;
+      return (_a = localStorage.key(nth)) === null || _a === void 0 ? void 0 : _a.slice(proxyName.length);
+    },
+    removeItem: function removeItem(key) {
+      var prefixedKey = proxyName + key;
+      localStorage.removeItem(prefixedKey);
+    },
+    clear: function clear() {
+      var keysToRemove = [];
+      for (var i = 0; i < localStorage.length; i += 1) {
+        var key = localStorage.key(i);
+        if (key && key.startsWith(proxyName)) {
+          keysToRemove.push(key);
+        }
+      }
+      keysToRemove.forEach(function (key) {
+        localStorage.removeItem(key);
+      });
+    }
+  };
+  var proxy = new Proxy({}, {
+    get: function get(_, p) {
+      var _a;
+      return (_a = fakeStorage[p]) !== null && _a !== void 0 ? _a : localStorage[p];
+    }
+  });
+  return proxy;
+}
+function getZsSessionStorage(_proxyName) {
+  var proxyName = _proxyName.split('_')[0];
+  var fakeStorage = {
+    getItem: function getItem(key) {
+      var prefixedKey = proxyName + key;
+      return sessionStorage.getItem(prefixedKey);
+    },
+    key: function key(nth) {
+      var _a;
+      return (_a = sessionStorage.key(nth)) === null || _a === void 0 ? void 0 : _a.slice(proxyName.length);
+    },
+    setItem: function setItem(key, value) {
+      var prefixedKey = proxyName + key;
+      sessionStorage.setItem(prefixedKey, String(value));
+    },
+    removeItem: function removeItem(key) {
+      var prefixedKey = proxyName + key;
+      sessionStorage.removeItem(prefixedKey);
+    },
+    clear: function clear() {
+      var keysToRemove = [];
+      for (var i = 0; i < sessionStorage.length; i += 1) {
+        var key = sessionStorage.key(i);
+        if (key && key.startsWith(proxyName)) {
+          keysToRemove.push(key);
+        }
+      }
+      keysToRemove.forEach(function (key) {
+        sessionStorage.removeItem(key);
+      });
+    }
+  };
+  var proxy = new Proxy({}, {
+    get: function get(_, p) {
+      var _a;
+      return (_a = fakeStorage[p]) !== null && _a !== void 0 ? _a : sessionStorage[p];
+    }
+  });
+  return proxy;
+}

package/lib/sandbox/index.d.ts

@@ -0,0 +1,40 @@
+/**
+ * @author Kuitos
+ * @since 2019-04-11
+ */
+import type { SandBox } from '../interfaces';
+export { css } from './patchers';
+export { getCurrentRunningApp } from './common';
+/**
+ * 生成应用运行时沙箱
+ *
+ * 沙箱分两个类型：
+ * 1. app 环境沙箱
+ *  app 环境沙箱是指应用初始化过之后，应用会在什么样的上下文环境运行。每个应用的环境沙箱只会初始化一次，因为子应用只会触发一次 bootstrap 。
+ *  子应用在切换时，实际上切换的是 app 环境沙箱。
+ * 2. render 沙箱
+ *  子应用在 app mount 开始前生成好的的沙箱。每次子应用切换过后，render 沙箱都会重现初始化。
+ *
+ * 这么设计的目的是为了保证每个子应用切换回来之后，还能运行在应用 bootstrap 之后的环境下。
+ *
+ * @param appName
+ * @param elementGetter
+ * @param scopedCSS
+ * @param useLooseSandbox
+ * @param excludeAssetFilter
+ * @param globalContext
+ * @param transformStorage
+ */
+export declare function createSandboxContainer(appName: string, elementGetter: () => HTMLElement | ShadowRoot, scopedCSS: boolean, useLooseSandbox?: boolean, excludeAssetFilter?: (url: string) => boolean, globalContext?: typeof window, transformStorage?: boolean): {
+    instance: SandBox;
+    /**
+     * 沙箱被 mount
+     * 可能是从 bootstrap 状态进入的 mount
+     * 也可能是从 unmount 之后再次唤醒进入 mount
+     */
+    mount(): Promise<void>;
+    /**
+     * 恢复 global 状态，使其能回到应用加载之前的状态
+     */
+    unmount(): Promise<void>;
+};

package/lib/sandbox/index.js

@@ -0,0 +1,123 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createSandboxContainer = createSandboxContainer;
+Object.defineProperty(exports, "css", {
+  enumerable: true,
+  get: function get() {
+    return _patchers.css;
+  }
+});
+Object.defineProperty(exports, "getCurrentRunningApp", {
+  enumerable: true,
+  get: function get() {
+    return _common.getCurrentRunningApp;
+  }
+});
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _tslib = require("tslib");
+var _sandbox = _interopRequireDefault(require("./legacy/sandbox"));
+var _patchers = require("./patchers");
+var _proxySandbox = _interopRequireDefault(require("./proxySandbox"));
+var _snapshotSandbox = _interopRequireDefault(require("./snapshotSandbox"));
+var _common = require("./common");
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
+/**
+ * 生成应用运行时沙箱
+ *
+ * 沙箱分两个类型：
+ * 1. app 环境沙箱
+ *  app 环境沙箱是指应用初始化过之后，应用会在什么样的上下文环境运行。每个应用的环境沙箱只会初始化一次，因为子应用只会触发一次 bootstrap 。
+ *  子应用在切换时，实际上切换的是 app 环境沙箱。
+ * 2. render 沙箱
+ *  子应用在 app mount 开始前生成好的的沙箱。每次子应用切换过后，render 沙箱都会重现初始化。
+ *
+ * 这么设计的目的是为了保证每个子应用切换回来之后，还能运行在应用 bootstrap 之后的环境下。
+ *
+ * @param appName
+ * @param elementGetter
+ * @param scopedCSS
+ * @param useLooseSandbox
+ * @param excludeAssetFilter
+ * @param globalContext
+ * @param transformStorage
+ */
+function createSandboxContainer(appName, elementGetter, scopedCSS, useLooseSandbox, excludeAssetFilter, globalContext, transformStorage) {
+  var sandbox;
+  if (window.Proxy) {
+    sandbox = useLooseSandbox ? new _sandbox.default(appName, globalContext) : new _proxySandbox.default(appName, globalContext, transformStorage);
+  } else {
+    sandbox = new _snapshotSandbox.default(appName);
+  }
+  // some side effect could be be invoked while bootstrapping, such as dynamic stylesheet injection with style-loader, especially during the development phase
+  var bootstrappingFreers = (0, _patchers.patchAtBootstrapping)(appName, elementGetter, sandbox, scopedCSS, excludeAssetFilter);
+  // mounting freers are one-off and should be re-init at every mounting time
+  var mountingFreers = [];
+  var sideEffectsRebuilders = [];
+  return {
+    instance: sandbox,
+    /**
+     * 沙箱被 mount
+     * 可能是从 bootstrap 状态进入的 mount
+     * 也可能是从 unmount 之后再次唤醒进入 mount
+     */
+    mount: function mount() {
+      return (0, _tslib.__awaiter)(this, void 0, void 0, /*#__PURE__*/_regenerator().m(function _callee() {
+        var sideEffectsRebuildersAtBootstrapping, sideEffectsRebuildersAtMounting;
+        return _regenerator().w(function (_context) {
+          while (1) switch (_context.n) {
+            case 0:
+              /* ------------------------------------------ 因为有上下文依赖（window），以下代码执行顺序不能变 ------------------------------------------ */
+              /* ------------------------------------------ 1. 启动/恢复 沙箱------------------------------------------ */
+              sandbox.active();
+              sideEffectsRebuildersAtBootstrapping = sideEffectsRebuilders.slice(0, bootstrappingFreers.length);
+              sideEffectsRebuildersAtMounting = sideEffectsRebuilders.slice(bootstrappingFreers.length); // must rebuild the side effects which added at bootstrapping firstly to recovery to nature state
+              if (sideEffectsRebuildersAtBootstrapping.length) {
+                sideEffectsRebuildersAtBootstrapping.forEach(function (rebuild) {
+                  return rebuild();
+                });
+              }
+              /* ------------------------------------------ 2. 开启全局变量补丁 ------------------------------------------*/
+              // render 沙箱启动时开始劫持各类全局监听，尽量不要在应用初始化阶段有 事件监听/定时器 等副作用
+              mountingFreers = (0, _patchers.patchAtMounting)(appName, elementGetter, sandbox, scopedCSS, excludeAssetFilter);
+              /* ------------------------------------------ 3. 重置一些初始化时的副作用 ------------------------------------------*/
+              // 存在 rebuilder 则表明有些副作用需要重建
+              if (sideEffectsRebuildersAtMounting.length) {
+                sideEffectsRebuildersAtMounting.forEach(function (rebuild) {
+                  return rebuild();
+                });
+              }
+              // clean up rebuilders
+              sideEffectsRebuilders = [];
+            case 1:
+              return _context.a(2);
+          }
+        }, _callee);
+      }));
+    },
+    /**
+     * 恢复 global 状态，使其能回到应用加载之前的状态
+     */
+    unmount: function unmount() {
+      return (0, _tslib.__awaiter)(this, void 0, void 0, /*#__PURE__*/_regenerator().m(function _callee2() {
+        return _regenerator().w(function (_context2) {
+          while (1) switch (_context2.n) {
+            case 0:
+              // record the rebuilders of window side effects (event listeners or timers)
+              // note that the frees of mounting phase are one-off as it will be re-init at next mounting
+              sideEffectsRebuilders = [].concat((0, _toConsumableArray2.default)(bootstrappingFreers), (0, _toConsumableArray2.default)(mountingFreers)).map(function (free) {
+                return free();
+              });
+              sandbox.inactive();
+            case 1:
+              return _context2.a(2);
+          }
+        }, _callee2);
+      }));
+    }
+  };
+}

package/lib/sandbox/legacy/sandbox.d.ts

@@ -0,0 +1,28 @@
+/**
+ * @author Kuitos
+ * @since 2019-04-11
+ */
+import type { SandBox } from '../../interfaces';
+import { SandBoxType } from '../../interfaces';
+/**
+ * 基于 Proxy 实现的沙箱
+ * TODO: 为了兼容性 singular 模式下依旧使用该沙箱，等新沙箱稳定之后再切换
+ */
+export default class LegacySandbox implements SandBox {
+    /** 沙箱期间新增的全局变量 */
+    private addedPropsMapInSandbox;
+    /** 沙箱期间更新的全局变量 */
+    private modifiedPropsOriginalValueMapInSandbox;
+    /** 持续记录更新的(新增和修改的)全局变量的 map，用于在任意时刻做 snapshot */
+    private currentUpdatedPropsValueMap;
+    name: string;
+    proxy: WindowProxy;
+    globalContext: typeof window;
+    type: SandBoxType;
+    sandboxRunning: boolean;
+    latestSetProp: PropertyKey | null;
+    private setWindowProp;
+    active(): void;
+    inactive(): void;
+    constructor(name: string, globalContext?: Window & typeof globalThis);
+}

package/lib/sandbox/legacy/sandbox.js

@@ -0,0 +1,148 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _interfaces = require("../../interfaces");
+var _common = require("../common");
+function isPropConfigurable(target, prop) {
+  var descriptor = Object.getOwnPropertyDescriptor(target, prop);
+  return descriptor ? descriptor.configurable : true;
+}
+/**
+ * 基于 Proxy 实现的沙箱
+ * TODO: 为了兼容性 singular 模式下依旧使用该沙箱，等新沙箱稳定之后再切换
+ */
+var LegacySandbox = exports.default = /*#__PURE__*/function () {
+  function LegacySandbox(name) {
+    var _this = this;
+    var globalContext = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : window;
+    (0, _classCallCheck2.default)(this, LegacySandbox);
+    /** 沙箱期间新增的全局变量 */
+    this.addedPropsMapInSandbox = new Map();
+    /** 沙箱期间更新的全局变量 */
+    this.modifiedPropsOriginalValueMapInSandbox = new Map();
+    /** 持续记录更新的(新增和修改的)全局变量的 map，用于在任意时刻做 snapshot */
+    this.currentUpdatedPropsValueMap = new Map();
+    this.sandboxRunning = true;
+    this.latestSetProp = null;
+    this.name = name;
+    this.globalContext = globalContext;
+    this.type = _interfaces.SandBoxType.LegacyProxy;
+    var addedPropsMapInSandbox = this.addedPropsMapInSandbox,
+      modifiedPropsOriginalValueMapInSandbox = this.modifiedPropsOriginalValueMapInSandbox,
+      currentUpdatedPropsValueMap = this.currentUpdatedPropsValueMap;
+    var rawWindow = globalContext;
+    var fakeWindow = Object.create(null);
+    var setTrap = function setTrap(p, value, originalValue) {
+      var sync2Window = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
+      if (_this.sandboxRunning) {
+        if (!rawWindow.hasOwnProperty(p)) {
+          addedPropsMapInSandbox.set(p, value);
+        } else if (!modifiedPropsOriginalValueMapInSandbox.has(p)) {
+          // 如果当前 window 对象存在该属性，且 record map 中未记录过，则记录该属性初始值
+          modifiedPropsOriginalValueMapInSandbox.set(p, originalValue);
+        }
+        currentUpdatedPropsValueMap.set(p, value);
+        if (sync2Window) {
+          // 必须重新设置 window 对象保证下次 get 时能拿到已更新的数据
+          rawWindow[p] = value;
+        }
+        _this.latestSetProp = p;
+        return true;
+      }
+      if (process.env.NODE_ENV === 'development') {
+        console.warn("[qiankun] Set window.".concat(p.toString(), " while sandbox destroyed or inactive in ").concat(name, "!"));
+      }
+      // 在 strict-mode 下，Proxy 的 handler.set 返回 false 会抛出 TypeError，在沙箱卸载的情况下应该忽略错误
+      return true;
+    };
+    var proxy = new Proxy(fakeWindow, {
+      set: function set(_, p, value) {
+        var originalValue = rawWindow[p];
+        return setTrap(p, value, originalValue, true);
+      },
+      get: function get(_, p) {
+        // avoid who using window.window or window.self to escape the sandbox environment to touch the really window
+        // or use window.top to check if an iframe context
+        // see https://github.com/eligrey/FileSaver.js/blob/master/src/FileSaver.js#L13
+        if (p === 'top' || p === 'parent' || p === 'window' || p === 'self') {
+          return proxy;
+        }
+        var value = rawWindow[p];
+        return (0, _common.getTargetValue)(rawWindow, value);
+      },
+      // trap in operator
+      // see https://github.com/styled-components/styled-components/blob/master/packages/styled-components/src/constants.js#L12
+      has: function has(_, p) {
+        return p in rawWindow;
+      },
+      getOwnPropertyDescriptor: function getOwnPropertyDescriptor(_, p) {
+        var descriptor = Object.getOwnPropertyDescriptor(rawWindow, p);
+        // A property cannot be reported as non-configurable, if it does not exists as an own property of the target object
+        if (descriptor && !descriptor.configurable) {
+          descriptor.configurable = true;
+        }
+        return descriptor;
+      },
+      defineProperty: function defineProperty(_, p, attributes) {
+        var originalValue = rawWindow[p];
+        var done = Reflect.defineProperty(rawWindow, p, attributes);
+        var value = rawWindow[p];
+        setTrap(p, value, originalValue, false);
+        return done;
+      }
+    });
+    this.proxy = proxy;
+  }
+  return (0, _createClass2.default)(LegacySandbox, [{
+    key: "setWindowProp",
+    value: function setWindowProp(prop, value, toDelete) {
+      if (value === undefined && toDelete) {
+        // eslint-disable-next-line no-param-reassign
+        delete this.globalContext[prop];
+      } else if (isPropConfigurable(this.globalContext, prop) && (0, _typeof2.default)(prop) !== 'symbol') {
+        Object.defineProperty(this.globalContext, prop, {
+          writable: true,
+          configurable: true
+        });
+        // eslint-disable-next-line no-param-reassign
+        this.globalContext[prop] = value;
+      }
+    }
+  }, {
+    key: "active",
+    value: function active() {
+      var _this2 = this;
+      if (!this.sandboxRunning) {
+        this.currentUpdatedPropsValueMap.forEach(function (v, p) {
+          return _this2.setWindowProp(p, v);
+        });
+      }
+      this.sandboxRunning = true;
+    }
+  }, {
+    key: "inactive",
+    value: function inactive() {
+      var _this3 = this;
+      if (process.env.NODE_ENV === 'development') {
+        console.info("[qiankun:sandbox] ".concat(this.name, " modified global properties restore..."), [].concat((0, _toConsumableArray2.default)(this.addedPropsMapInSandbox.keys()), (0, _toConsumableArray2.default)(this.modifiedPropsOriginalValueMapInSandbox.keys())));
+      }
+      // renderSandboxSnapshot = snapshot(currentUpdatedPropsValueMapForSnapshot);
+      // restore global props to initial snapshot
+      this.modifiedPropsOriginalValueMapInSandbox.forEach(function (v, p) {
+        return _this3.setWindowProp(p, v);
+      });
+      this.addedPropsMapInSandbox.forEach(function (_, p) {
+        return _this3.setWindowProp(p, undefined, true);
+      });
+      this.sandboxRunning = false;
+    }
+  }]);
+}();