@alicloud/alfa-react 1.6.1 → 1.6.2-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/createAlfaWidget.js +49 -3
- package/es/createApplication.js +61 -43
- package/es/schedule.js +41 -0
- package/es/utils/index.js +15 -0
- package/es/version.js +1 -1
- package/lib/createAlfaWidget.js +49 -3
- package/lib/createApplication.js +60 -42
- package/lib/schedule.js +49 -0
- package/lib/utils/index.js +18 -2
- package/lib/version.js +1 -1
- package/package.json +8 -6
- package/types/components/Loading/Title.d.ts +0 -1
- package/types/createAlfaApp.d.ts +0 -1
- package/types/createAlfaWidget.d.ts +3 -6
- package/types/createApplication.d.ts +1 -1
- package/types/schedule.d.ts +8 -0
- package/types/types/index.d.ts +7 -0
- package/types/utils/index.d.ts +8 -0
- package/types/version.d.ts +1 -1
- package/types/widget.d.ts +0 -1
package/es/createAlfaWidget.js
CHANGED
|
@@ -5,6 +5,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
|
5
5
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
6
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
7
7
|
import React, { useMemo } from 'react';
|
|
8
|
+
import LazyLoad from 'react-lazyload';
|
|
8
9
|
import { BaseLoader } from '@alicloud/alfa-core';
|
|
9
10
|
import ErrorBoundary from './components/ErrorBoundary';
|
|
10
11
|
import { createCWSWidget } from './widget';
|
|
@@ -41,7 +42,10 @@ var Application = createApplication(loader);
|
|
|
41
42
|
function createAlfaWidget(option) {
|
|
42
43
|
var _ref2 = option || {},
|
|
43
44
|
name = _ref2.name,
|
|
44
|
-
dependencies = _ref2.dependencies
|
|
45
|
+
dependencies = _ref2.dependencies,
|
|
46
|
+
priority = _ref2.priority,
|
|
47
|
+
dynamicConfig = _ref2.dynamicConfig,
|
|
48
|
+
manifest = _ref2.manifest;
|
|
45
49
|
if (name.match(/@ali\/widget-/)) {
|
|
46
50
|
// TODO load style
|
|
47
51
|
return createCWSWidget(option);
|
|
@@ -51,13 +55,54 @@ function createAlfaWidget(option) {
|
|
|
51
55
|
if (!name) return function () {
|
|
52
56
|
return null;
|
|
53
57
|
};
|
|
54
|
-
var
|
|
58
|
+
var preLoader;
|
|
59
|
+
if (priority === 'high') {
|
|
60
|
+
var p = loader.register(_objectSpread(_objectSpread({}, option), {}, {
|
|
61
|
+
dynamicConfig: typeof dynamicConfig === 'boolean' ? dynamicConfig : !manifest
|
|
62
|
+
}));
|
|
63
|
+
preLoader = /*#__PURE__*/function () {
|
|
64
|
+
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
65
|
+
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
|
|
66
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
67
|
+
case 0:
|
|
68
|
+
return _context2.abrupt("return", p);
|
|
69
|
+
case 1:
|
|
70
|
+
case "end":
|
|
71
|
+
return _context2.stop();
|
|
72
|
+
}
|
|
73
|
+
}, _callee2);
|
|
74
|
+
}));
|
|
75
|
+
return function preLoader() {
|
|
76
|
+
return _ref3.apply(this, arguments);
|
|
77
|
+
};
|
|
78
|
+
}();
|
|
79
|
+
}
|
|
80
|
+
var passedInOption = _objectSpread({}, option);
|
|
55
81
|
|
|
56
82
|
// 非 oneConsole 环境下设置 iframe 沙箱地址为 about:blank
|
|
57
83
|
// 避免沙箱创建失败
|
|
58
84
|
if (passedInOption.sandbox && !passedInOption.sandbox.sandBoxUrl && !isOneConsole()) {
|
|
59
85
|
passedInOption.sandbox.sandBoxUrl = 'about:blank';
|
|
60
86
|
}
|
|
87
|
+
if (priority === 'low') {
|
|
88
|
+
return function (props) {
|
|
89
|
+
return (
|
|
90
|
+
/*#__PURE__*/
|
|
91
|
+
// Compatible with old logic
|
|
92
|
+
// props should not passed in errorBoundary
|
|
93
|
+
React.createElement(LazyLoad, {
|
|
94
|
+
height: 1,
|
|
95
|
+
once: true
|
|
96
|
+
}, /*#__PURE__*/React.createElement(ErrorBoundary, props, /*#__PURE__*/React.createElement(Application, _extends({}, passedInOption, {
|
|
97
|
+
// name={name}
|
|
98
|
+
style: props.style || passedInOption.style,
|
|
99
|
+
deps: dependencies || {},
|
|
100
|
+
customProps: _objectSpread({}, props),
|
|
101
|
+
preLoader: preLoader
|
|
102
|
+
}))))
|
|
103
|
+
);
|
|
104
|
+
};
|
|
105
|
+
}
|
|
61
106
|
return function (props) {
|
|
62
107
|
return (
|
|
63
108
|
/*#__PURE__*/
|
|
@@ -67,7 +112,8 @@ function createAlfaWidget(option) {
|
|
|
67
112
|
// name={name}
|
|
68
113
|
style: props.style || passedInOption.style,
|
|
69
114
|
deps: dependencies || {},
|
|
70
|
-
customProps: _objectSpread({}, props)
|
|
115
|
+
customProps: _objectSpread({}, props),
|
|
116
|
+
preLoader: preLoader
|
|
71
117
|
})))
|
|
72
118
|
);
|
|
73
119
|
};
|
package/es/createApplication.js
CHANGED
|
@@ -10,7 +10,7 @@ import { createEventBus } from '@alicloud/alfa-core';
|
|
|
10
10
|
import { ConsoleRegion, ConsoleResourceGroup, ConsoleContext } from '@alicloud/xconsole-context';
|
|
11
11
|
import { forApp } from '@alicloud/console-base-messenger';
|
|
12
12
|
import Loading from './components/Loading';
|
|
13
|
-
import { normalizeName } from './utils';
|
|
13
|
+
import { normalizeName, setNativeProperty } from './utils';
|
|
14
14
|
import { countRegister } from './utils/counter';
|
|
15
15
|
import { version as loaderVersion } from './version';
|
|
16
16
|
var eventBus = createEventBus();
|
|
@@ -100,7 +100,8 @@ export default function createApplication(loader) {
|
|
|
100
100
|
basename = props.basename,
|
|
101
101
|
channel = props.channel,
|
|
102
102
|
onSyncHistory = props.onSyncHistory,
|
|
103
|
-
delay = props.delay
|
|
103
|
+
delay = props.delay,
|
|
104
|
+
preLoader = props.preLoader;
|
|
104
105
|
var handleExternalLink = customProps.handleExternalLink;
|
|
105
106
|
var _useState = useState(null),
|
|
106
107
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -266,7 +267,7 @@ export default function createApplication(loader) {
|
|
|
266
267
|
if ($syncHistory.current) window.addEventListener('popstate', updateAppHistory);
|
|
267
268
|
_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
|
|
268
269
|
var _app$context$updateBo, _app$context, _app$context$baseFram;
|
|
269
|
-
var fakeBody,
|
|
270
|
+
var fakeBody, _ref2, app, logger, realVersion, _ref3, path, frameWindow;
|
|
270
271
|
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
271
272
|
while (1) switch (_context.prev = _context.next) {
|
|
272
273
|
case 0:
|
|
@@ -283,46 +284,61 @@ export default function createApplication(loader) {
|
|
|
283
284
|
}, delay);
|
|
284
285
|
});
|
|
285
286
|
case 5:
|
|
286
|
-
|
|
287
|
+
if (!preLoader) {
|
|
288
|
+
_context.next = 11;
|
|
289
|
+
break;
|
|
290
|
+
}
|
|
291
|
+
_context.next = 8;
|
|
292
|
+
return preLoader(_objectSpread(_objectSpread({}, memoOptions), {}, {
|
|
293
|
+
container: fakeBody
|
|
294
|
+
}));
|
|
295
|
+
case 8:
|
|
296
|
+
_context.t0 = _context.sent;
|
|
297
|
+
_context.next = 14;
|
|
298
|
+
break;
|
|
299
|
+
case 11:
|
|
300
|
+
_context.next = 13;
|
|
287
301
|
return loader.register(_objectSpread(_objectSpread({}, memoOptions), {}, {
|
|
288
302
|
container: fakeBody
|
|
289
303
|
}));
|
|
290
|
-
case
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
304
|
+
case 13:
|
|
305
|
+
_context.t0 = _context.sent;
|
|
306
|
+
case 14:
|
|
307
|
+
_ref2 = _context.t0;
|
|
308
|
+
app = _ref2.app;
|
|
309
|
+
logger = _ref2.logger;
|
|
310
|
+
realVersion = _ref2.version;
|
|
295
311
|
setReleaseVersion(realVersion || 'unknown');
|
|
296
312
|
App = app;
|
|
297
313
|
|
|
298
314
|
// container has been unmounted
|
|
299
315
|
if (!isUnmounted) {
|
|
300
|
-
_context.next =
|
|
316
|
+
_context.next = 22;
|
|
301
317
|
break;
|
|
302
318
|
}
|
|
303
319
|
return _context.abrupt("return");
|
|
304
|
-
case
|
|
320
|
+
case 22:
|
|
305
321
|
if (app) {
|
|
306
|
-
_context.next =
|
|
322
|
+
_context.next = 24;
|
|
307
323
|
break;
|
|
308
324
|
}
|
|
309
325
|
return _context.abrupt("return", (logger === null || logger === void 0 ? void 0 : logger.error) && logger.error({
|
|
310
326
|
E_CODE: 'RuntimeError',
|
|
311
327
|
E_MSG: 'load app failed.'
|
|
312
328
|
}));
|
|
313
|
-
case
|
|
329
|
+
case 24:
|
|
314
330
|
if (appRef.current) {
|
|
315
|
-
_context.next =
|
|
331
|
+
_context.next = 26;
|
|
316
332
|
break;
|
|
317
333
|
}
|
|
318
334
|
return _context.abrupt("return", (logger === null || logger === void 0 ? void 0 : logger.error) && logger.error({
|
|
319
335
|
E_CODE: 'RuntimeError',
|
|
320
336
|
E_MSG: 'cannot find container.'
|
|
321
337
|
}));
|
|
322
|
-
case
|
|
338
|
+
case 26:
|
|
323
339
|
// update body in sandbox context
|
|
324
340
|
(_app$context$updateBo = (_app$context = app.context).updateBody) === null || _app$context$updateBo === void 0 ? void 0 : _app$context$updateBo.call(_app$context, memoOptions.sandbox.disableFakeBody ? document.body : fakeBody);
|
|
325
|
-
|
|
341
|
+
_ref3 = memoOptions.props, path = _ref3.path;
|
|
326
342
|
frameWindow = (_app$context$baseFram = app.context.baseFrame) === null || _app$context$baseFram === void 0 ? void 0 : _app$context$baseFram.contentWindow;
|
|
327
343
|
if (frameWindow) {
|
|
328
344
|
originalPushState = frameWindow === null || frameWindow === void 0 ? void 0 : frameWindow.history.pushState;
|
|
@@ -330,39 +346,37 @@ export default function createApplication(loader) {
|
|
|
330
346
|
originalGo = frameWindow === null || frameWindow === void 0 ? void 0 : frameWindow.history.go;
|
|
331
347
|
// update context history according to path
|
|
332
348
|
if (path) originalReplaceState(getHistoryState(), '', path.replace(/\/+/g, '/'));
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
if ($syncHistory.current) {
|
|
336
|
-
var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
|
|
337
|
-
if ("".concat(nextPath) !== peelPath(window.location)) {
|
|
338
|
-
window.history.pushState(data, unused, nextPath);
|
|
339
|
-
onSyncHistory && onSyncHistory('push', nextPath, data);
|
|
340
|
-
}
|
|
341
|
-
originalReplaceState(data, unused, _url);
|
|
342
|
-
} else {
|
|
343
|
-
originalPushState(data, unused, _url);
|
|
344
|
-
}
|
|
345
|
-
};
|
|
346
|
-
frameWindow.history.replaceState = function (data, unused, _url) {
|
|
349
|
+
frameWindow.history.pushState = function (data, unused, _url) {
|
|
350
|
+
if ($syncHistory.current) {
|
|
347
351
|
var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
|
|
348
|
-
if (
|
|
349
|
-
window.history.
|
|
350
|
-
onSyncHistory && onSyncHistory('
|
|
352
|
+
if ("".concat(nextPath) !== peelPath(window.location)) {
|
|
353
|
+
window.history.pushState(data, unused, nextPath);
|
|
354
|
+
onSyncHistory && onSyncHistory('push', nextPath, data);
|
|
351
355
|
}
|
|
352
356
|
originalReplaceState(data, unused, _url);
|
|
353
|
-
}
|
|
357
|
+
} else {
|
|
358
|
+
originalPushState(data, unused, _url);
|
|
359
|
+
}
|
|
360
|
+
};
|
|
361
|
+
frameWindow.history.replaceState = function (data, unused, _url) {
|
|
362
|
+
var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
|
|
363
|
+
if ($syncHistory.current) {
|
|
364
|
+
window.history.replaceState(data, unused, nextPath);
|
|
365
|
+
onSyncHistory && onSyncHistory('replace', nextPath, data);
|
|
366
|
+
}
|
|
367
|
+
originalReplaceState(data, unused, _url);
|
|
368
|
+
};
|
|
354
369
|
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
}
|
|
370
|
+
// 劫持微应用的返回
|
|
371
|
+
setNativeProperty(frameWindow.history, 'go', function (n) {
|
|
372
|
+
window.history.go(n);
|
|
373
|
+
});
|
|
360
374
|
}
|
|
361
|
-
_context.next =
|
|
375
|
+
_context.next = 32;
|
|
362
376
|
return app.mount(fakeBody, {
|
|
363
377
|
customProps: customProps
|
|
364
378
|
});
|
|
365
|
-
case
|
|
379
|
+
case 32:
|
|
366
380
|
(logger === null || logger === void 0 ? void 0 : logger.record) && (logger === null || logger === void 0 ? void 0 : logger.record({
|
|
367
381
|
END_TIME: Date.now()
|
|
368
382
|
}));
|
|
@@ -374,7 +388,7 @@ export default function createApplication(loader) {
|
|
|
374
388
|
|
|
375
389
|
// just run once
|
|
376
390
|
setAppInstance(app);
|
|
377
|
-
case
|
|
391
|
+
case 36:
|
|
378
392
|
case "end":
|
|
379
393
|
return _context.stop();
|
|
380
394
|
}
|
|
@@ -390,10 +404,14 @@ export default function createApplication(loader) {
|
|
|
390
404
|
if ($syncHistory.current) window.removeEventListener('popstate', updateAppHistory);
|
|
391
405
|
if (!App) return;
|
|
392
406
|
var frameHistory = (_App$context$baseFram3 = App.context.baseFrame) === null || _App$context$baseFram3 === void 0 ? void 0 : (_App$context$baseFram4 = _App$context$baseFram3.contentWindow) === null || _App$context$baseFram4 === void 0 ? void 0 : _App$context$baseFram4.history;
|
|
407
|
+
|
|
408
|
+
// reset method of frame history
|
|
393
409
|
if (frameHistory) {
|
|
394
410
|
if (originalPushState !== frameHistory.pushState) frameHistory.pushState = originalPushState;
|
|
395
411
|
if (originalReplaceState !== frameHistory.replaceState) frameHistory.replaceState = originalReplaceState;
|
|
396
|
-
if (originalGo !== frameHistory.go)
|
|
412
|
+
if (originalGo !== frameHistory.go) {
|
|
413
|
+
setNativeProperty(frameHistory, 'go', originalGo);
|
|
414
|
+
}
|
|
397
415
|
}
|
|
398
416
|
App.unmount();
|
|
399
417
|
|
package/es/schedule.js
ADDED
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
2
|
+
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
3
|
+
export var Schedule = /*#__PURE__*/function () {
|
|
4
|
+
function Schedule() {
|
|
5
|
+
_classCallCheck(this, Schedule);
|
|
6
|
+
this.pending = [];
|
|
7
|
+
this.running = [];
|
|
8
|
+
this.delaying = [];
|
|
9
|
+
}
|
|
10
|
+
_createClass(Schedule, [{
|
|
11
|
+
key: "push",
|
|
12
|
+
value: function push(priority, task) {
|
|
13
|
+
var _this = this;
|
|
14
|
+
return new Promise(function (resolve) {
|
|
15
|
+
if (priority === 'high') {
|
|
16
|
+
var p = task().then(function (result) {
|
|
17
|
+
resolve(result);
|
|
18
|
+
}).finally(function () {});
|
|
19
|
+
_this.running.push(p);
|
|
20
|
+
}
|
|
21
|
+
if (priority === 'medium') {
|
|
22
|
+
_this.pending.push(task);
|
|
23
|
+
}
|
|
24
|
+
if (priority === 'low') {
|
|
25
|
+
_this.delaying.push(task);
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
}, {
|
|
30
|
+
key: "check",
|
|
31
|
+
value: function check() {
|
|
32
|
+
if (this.running.length === 0) {
|
|
33
|
+
while (this.pending.length) {
|
|
34
|
+
var task = this.pending.shift();
|
|
35
|
+
if (task) this.running.push(task());
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
}]);
|
|
40
|
+
return Schedule;
|
|
41
|
+
}();
|
package/es/utils/index.js
CHANGED
|
@@ -17,4 +17,19 @@ export var isOsContext = function isOsContext() {
|
|
|
17
17
|
// 降级
|
|
18
18
|
return !!window.__IS_CONSOLE_OS_CONTEXT__;
|
|
19
19
|
}
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* set native object property
|
|
24
|
+
* @param obj
|
|
25
|
+
* @param propertyName
|
|
26
|
+
* @param value
|
|
27
|
+
* @returns
|
|
28
|
+
*/
|
|
29
|
+
export var setNativeProperty = function setNativeProperty(obj, propertyName, value) {
|
|
30
|
+
var desc = Object.getOwnPropertyDescriptor(obj, propertyName);
|
|
31
|
+
|
|
32
|
+
// in strict mode, Cannot set property go of [xx] which has only a getter
|
|
33
|
+
if (desc && typeof desc.set === 'undefined') return;
|
|
34
|
+
obj[propertyName] = value;
|
|
20
35
|
};
|
package/es/version.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export var version = '1.6.1';
|
|
1
|
+
export var version = '1.6.2-alpha.1';
|
package/lib/createAlfaWidget.js
CHANGED
|
@@ -12,6 +12,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
|
|
|
12
12
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
13
|
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
14
14
|
var _react = _interopRequireWildcard(require("react"));
|
|
15
|
+
var _reactLazyload = _interopRequireDefault(require("react-lazyload"));
|
|
15
16
|
var _alfaCore = require("@alicloud/alfa-core");
|
|
16
17
|
var _ErrorBoundary = _interopRequireDefault(require("./components/ErrorBoundary"));
|
|
17
18
|
var _widget = require("./widget");
|
|
@@ -52,7 +53,10 @@ var Application = (0, _createApplication.default)(loader);
|
|
|
52
53
|
function createAlfaWidget(option) {
|
|
53
54
|
var _ref2 = option || {},
|
|
54
55
|
name = _ref2.name,
|
|
55
|
-
dependencies = _ref2.dependencies
|
|
56
|
+
dependencies = _ref2.dependencies,
|
|
57
|
+
priority = _ref2.priority,
|
|
58
|
+
dynamicConfig = _ref2.dynamicConfig,
|
|
59
|
+
manifest = _ref2.manifest;
|
|
56
60
|
if (name.match(/@ali\/widget-/)) {
|
|
57
61
|
// TODO load style
|
|
58
62
|
return (0, _widget.createCWSWidget)(option);
|
|
@@ -62,13 +66,54 @@ function createAlfaWidget(option) {
|
|
|
62
66
|
if (!name) return function () {
|
|
63
67
|
return null;
|
|
64
68
|
};
|
|
65
|
-
var
|
|
69
|
+
var preLoader;
|
|
70
|
+
if (priority === 'high') {
|
|
71
|
+
var p = loader.register(_objectSpread(_objectSpread({}, option), {}, {
|
|
72
|
+
dynamicConfig: typeof dynamicConfig === 'boolean' ? dynamicConfig : !manifest
|
|
73
|
+
}));
|
|
74
|
+
preLoader = /*#__PURE__*/function () {
|
|
75
|
+
var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
|
|
76
|
+
return _regenerator.default.wrap(function _callee2$(_context2) {
|
|
77
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
78
|
+
case 0:
|
|
79
|
+
return _context2.abrupt("return", p);
|
|
80
|
+
case 1:
|
|
81
|
+
case "end":
|
|
82
|
+
return _context2.stop();
|
|
83
|
+
}
|
|
84
|
+
}, _callee2);
|
|
85
|
+
}));
|
|
86
|
+
return function preLoader() {
|
|
87
|
+
return _ref3.apply(this, arguments);
|
|
88
|
+
};
|
|
89
|
+
}();
|
|
90
|
+
}
|
|
91
|
+
var passedInOption = _objectSpread({}, option);
|
|
66
92
|
|
|
67
93
|
// 非 oneConsole 环境下设置 iframe 沙箱地址为 about:blank
|
|
68
94
|
// 避免沙箱创建失败
|
|
69
95
|
if (passedInOption.sandbox && !passedInOption.sandbox.sandBoxUrl && !(0, _oneConsole.isOneConsole)()) {
|
|
70
96
|
passedInOption.sandbox.sandBoxUrl = 'about:blank';
|
|
71
97
|
}
|
|
98
|
+
if (priority === 'low') {
|
|
99
|
+
return function (props) {
|
|
100
|
+
return (
|
|
101
|
+
/*#__PURE__*/
|
|
102
|
+
// Compatible with old logic
|
|
103
|
+
// props should not passed in errorBoundary
|
|
104
|
+
_react.default.createElement(_reactLazyload.default, {
|
|
105
|
+
height: 1,
|
|
106
|
+
once: true
|
|
107
|
+
}, /*#__PURE__*/_react.default.createElement(_ErrorBoundary.default, props, /*#__PURE__*/_react.default.createElement(Application, (0, _extends2.default)({}, passedInOption, {
|
|
108
|
+
// name={name}
|
|
109
|
+
style: props.style || passedInOption.style,
|
|
110
|
+
deps: dependencies || {},
|
|
111
|
+
customProps: _objectSpread({}, props),
|
|
112
|
+
preLoader: preLoader
|
|
113
|
+
}))))
|
|
114
|
+
);
|
|
115
|
+
};
|
|
116
|
+
}
|
|
72
117
|
return function (props) {
|
|
73
118
|
return (
|
|
74
119
|
/*#__PURE__*/
|
|
@@ -78,7 +123,8 @@ function createAlfaWidget(option) {
|
|
|
78
123
|
// name={name}
|
|
79
124
|
style: props.style || passedInOption.style,
|
|
80
125
|
deps: dependencies || {},
|
|
81
|
-
customProps: _objectSpread({}, props)
|
|
126
|
+
customProps: _objectSpread({}, props),
|
|
127
|
+
preLoader: preLoader
|
|
82
128
|
})))
|
|
83
129
|
);
|
|
84
130
|
};
|
package/lib/createApplication.js
CHANGED
|
@@ -110,7 +110,8 @@ function createApplication(loader) {
|
|
|
110
110
|
basename = props.basename,
|
|
111
111
|
channel = props.channel,
|
|
112
112
|
onSyncHistory = props.onSyncHistory,
|
|
113
|
-
delay = props.delay
|
|
113
|
+
delay = props.delay,
|
|
114
|
+
preLoader = props.preLoader;
|
|
114
115
|
var handleExternalLink = customProps.handleExternalLink;
|
|
115
116
|
var _useState = (0, _react.useState)(null),
|
|
116
117
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
@@ -276,7 +277,7 @@ function createApplication(loader) {
|
|
|
276
277
|
if ($syncHistory.current) window.addEventListener('popstate', updateAppHistory);
|
|
277
278
|
(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
|
|
278
279
|
var _app$context$updateBo, _app$context, _app$context$baseFram;
|
|
279
|
-
var fakeBody,
|
|
280
|
+
var fakeBody, _ref2, app, logger, realVersion, _ref3, path, frameWindow;
|
|
280
281
|
return _regenerator.default.wrap(function _callee$(_context) {
|
|
281
282
|
while (1) switch (_context.prev = _context.next) {
|
|
282
283
|
case 0:
|
|
@@ -293,46 +294,61 @@ function createApplication(loader) {
|
|
|
293
294
|
}, delay);
|
|
294
295
|
});
|
|
295
296
|
case 5:
|
|
296
|
-
|
|
297
|
+
if (!preLoader) {
|
|
298
|
+
_context.next = 11;
|
|
299
|
+
break;
|
|
300
|
+
}
|
|
301
|
+
_context.next = 8;
|
|
302
|
+
return preLoader(_objectSpread(_objectSpread({}, memoOptions), {}, {
|
|
303
|
+
container: fakeBody
|
|
304
|
+
}));
|
|
305
|
+
case 8:
|
|
306
|
+
_context.t0 = _context.sent;
|
|
307
|
+
_context.next = 14;
|
|
308
|
+
break;
|
|
309
|
+
case 11:
|
|
310
|
+
_context.next = 13;
|
|
297
311
|
return loader.register(_objectSpread(_objectSpread({}, memoOptions), {}, {
|
|
298
312
|
container: fakeBody
|
|
299
313
|
}));
|
|
300
|
-
case
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
314
|
+
case 13:
|
|
315
|
+
_context.t0 = _context.sent;
|
|
316
|
+
case 14:
|
|
317
|
+
_ref2 = _context.t0;
|
|
318
|
+
app = _ref2.app;
|
|
319
|
+
logger = _ref2.logger;
|
|
320
|
+
realVersion = _ref2.version;
|
|
305
321
|
setReleaseVersion(realVersion || 'unknown');
|
|
306
322
|
App = app;
|
|
307
323
|
|
|
308
324
|
// container has been unmounted
|
|
309
325
|
if (!isUnmounted) {
|
|
310
|
-
_context.next =
|
|
326
|
+
_context.next = 22;
|
|
311
327
|
break;
|
|
312
328
|
}
|
|
313
329
|
return _context.abrupt("return");
|
|
314
|
-
case
|
|
330
|
+
case 22:
|
|
315
331
|
if (app) {
|
|
316
|
-
_context.next =
|
|
332
|
+
_context.next = 24;
|
|
317
333
|
break;
|
|
318
334
|
}
|
|
319
335
|
return _context.abrupt("return", (logger === null || logger === void 0 ? void 0 : logger.error) && logger.error({
|
|
320
336
|
E_CODE: 'RuntimeError',
|
|
321
337
|
E_MSG: 'load app failed.'
|
|
322
338
|
}));
|
|
323
|
-
case
|
|
339
|
+
case 24:
|
|
324
340
|
if (appRef.current) {
|
|
325
|
-
_context.next =
|
|
341
|
+
_context.next = 26;
|
|
326
342
|
break;
|
|
327
343
|
}
|
|
328
344
|
return _context.abrupt("return", (logger === null || logger === void 0 ? void 0 : logger.error) && logger.error({
|
|
329
345
|
E_CODE: 'RuntimeError',
|
|
330
346
|
E_MSG: 'cannot find container.'
|
|
331
347
|
}));
|
|
332
|
-
case
|
|
348
|
+
case 26:
|
|
333
349
|
// update body in sandbox context
|
|
334
350
|
(_app$context$updateBo = (_app$context = app.context).updateBody) === null || _app$context$updateBo === void 0 ? void 0 : _app$context$updateBo.call(_app$context, memoOptions.sandbox.disableFakeBody ? document.body : fakeBody);
|
|
335
|
-
|
|
351
|
+
_ref3 = memoOptions.props, path = _ref3.path;
|
|
336
352
|
frameWindow = (_app$context$baseFram = app.context.baseFrame) === null || _app$context$baseFram === void 0 ? void 0 : _app$context$baseFram.contentWindow;
|
|
337
353
|
if (frameWindow) {
|
|
338
354
|
originalPushState = frameWindow === null || frameWindow === void 0 ? void 0 : frameWindow.history.pushState;
|
|
@@ -340,39 +356,37 @@ function createApplication(loader) {
|
|
|
340
356
|
originalGo = frameWindow === null || frameWindow === void 0 ? void 0 : frameWindow.history.go;
|
|
341
357
|
// update context history according to path
|
|
342
358
|
if (path) originalReplaceState(getHistoryState(), '', path.replace(/\/+/g, '/'));
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
if ($syncHistory.current) {
|
|
346
|
-
var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
|
|
347
|
-
if ("".concat(nextPath) !== peelPath(window.location)) {
|
|
348
|
-
window.history.pushState(data, unused, nextPath);
|
|
349
|
-
onSyncHistory && onSyncHistory('push', nextPath, data);
|
|
350
|
-
}
|
|
351
|
-
originalReplaceState(data, unused, _url);
|
|
352
|
-
} else {
|
|
353
|
-
originalPushState(data, unused, _url);
|
|
354
|
-
}
|
|
355
|
-
};
|
|
356
|
-
frameWindow.history.replaceState = function (data, unused, _url) {
|
|
359
|
+
frameWindow.history.pushState = function (data, unused, _url) {
|
|
360
|
+
if ($syncHistory.current) {
|
|
357
361
|
var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
|
|
358
|
-
if (
|
|
359
|
-
window.history.
|
|
360
|
-
onSyncHistory && onSyncHistory('
|
|
362
|
+
if ("".concat(nextPath) !== peelPath(window.location)) {
|
|
363
|
+
window.history.pushState(data, unused, nextPath);
|
|
364
|
+
onSyncHistory && onSyncHistory('push', nextPath, data);
|
|
361
365
|
}
|
|
362
366
|
originalReplaceState(data, unused, _url);
|
|
363
|
-
}
|
|
367
|
+
} else {
|
|
368
|
+
originalPushState(data, unused, _url);
|
|
369
|
+
}
|
|
370
|
+
};
|
|
371
|
+
frameWindow.history.replaceState = function (data, unused, _url) {
|
|
372
|
+
var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
|
|
373
|
+
if ($syncHistory.current) {
|
|
374
|
+
window.history.replaceState(data, unused, nextPath);
|
|
375
|
+
onSyncHistory && onSyncHistory('replace', nextPath, data);
|
|
376
|
+
}
|
|
377
|
+
originalReplaceState(data, unused, _url);
|
|
378
|
+
};
|
|
364
379
|
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
}
|
|
380
|
+
// 劫持微应用的返回
|
|
381
|
+
(0, _utils.setNativeProperty)(frameWindow.history, 'go', function (n) {
|
|
382
|
+
window.history.go(n);
|
|
383
|
+
});
|
|
370
384
|
}
|
|
371
|
-
_context.next =
|
|
385
|
+
_context.next = 32;
|
|
372
386
|
return app.mount(fakeBody, {
|
|
373
387
|
customProps: customProps
|
|
374
388
|
});
|
|
375
|
-
case
|
|
389
|
+
case 32:
|
|
376
390
|
(logger === null || logger === void 0 ? void 0 : logger.record) && (logger === null || logger === void 0 ? void 0 : logger.record({
|
|
377
391
|
END_TIME: Date.now()
|
|
378
392
|
}));
|
|
@@ -384,7 +398,7 @@ function createApplication(loader) {
|
|
|
384
398
|
|
|
385
399
|
// just run once
|
|
386
400
|
setAppInstance(app);
|
|
387
|
-
case
|
|
401
|
+
case 36:
|
|
388
402
|
case "end":
|
|
389
403
|
return _context.stop();
|
|
390
404
|
}
|
|
@@ -400,10 +414,14 @@ function createApplication(loader) {
|
|
|
400
414
|
if ($syncHistory.current) window.removeEventListener('popstate', updateAppHistory);
|
|
401
415
|
if (!App) return;
|
|
402
416
|
var frameHistory = (_App$context$baseFram3 = App.context.baseFrame) === null || _App$context$baseFram3 === void 0 ? void 0 : (_App$context$baseFram4 = _App$context$baseFram3.contentWindow) === null || _App$context$baseFram4 === void 0 ? void 0 : _App$context$baseFram4.history;
|
|
417
|
+
|
|
418
|
+
// reset method of frame history
|
|
403
419
|
if (frameHistory) {
|
|
404
420
|
if (originalPushState !== frameHistory.pushState) frameHistory.pushState = originalPushState;
|
|
405
421
|
if (originalReplaceState !== frameHistory.replaceState) frameHistory.replaceState = originalReplaceState;
|
|
406
|
-
if (originalGo !== frameHistory.go)
|
|
422
|
+
if (originalGo !== frameHistory.go) {
|
|
423
|
+
(0, _utils.setNativeProperty)(frameHistory, 'go', originalGo);
|
|
424
|
+
}
|
|
407
425
|
}
|
|
408
426
|
App.unmount();
|
|
409
427
|
|
package/lib/schedule.js
ADDED
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.Schedule = void 0;
|
|
8
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
9
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
10
|
+
var Schedule = /*#__PURE__*/function () {
|
|
11
|
+
function Schedule() {
|
|
12
|
+
(0, _classCallCheck2.default)(this, Schedule);
|
|
13
|
+
this.pending = [];
|
|
14
|
+
this.running = [];
|
|
15
|
+
this.delaying = [];
|
|
16
|
+
}
|
|
17
|
+
(0, _createClass2.default)(Schedule, [{
|
|
18
|
+
key: "push",
|
|
19
|
+
value: function push(priority, task) {
|
|
20
|
+
var _this = this;
|
|
21
|
+
return new Promise(function (resolve) {
|
|
22
|
+
if (priority === 'high') {
|
|
23
|
+
var p = task().then(function (result) {
|
|
24
|
+
resolve(result);
|
|
25
|
+
}).finally(function () {});
|
|
26
|
+
_this.running.push(p);
|
|
27
|
+
}
|
|
28
|
+
if (priority === 'medium') {
|
|
29
|
+
_this.pending.push(task);
|
|
30
|
+
}
|
|
31
|
+
if (priority === 'low') {
|
|
32
|
+
_this.delaying.push(task);
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
}, {
|
|
37
|
+
key: "check",
|
|
38
|
+
value: function check() {
|
|
39
|
+
if (this.running.length === 0) {
|
|
40
|
+
while (this.pending.length) {
|
|
41
|
+
var task = this.pending.shift();
|
|
42
|
+
if (task) this.running.push(task());
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
}]);
|
|
47
|
+
return Schedule;
|
|
48
|
+
}();
|
|
49
|
+
exports.Schedule = Schedule;
|
package/lib/utils/index.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.normalizeName = exports.isOsContext = void 0;
|
|
6
|
+
exports.setNativeProperty = exports.normalizeName = exports.isOsContext = void 0;
|
|
7
7
|
/**
|
|
8
8
|
* kernel 会为沙箱 context 注入 __IS_CONSOLE_OS_CONTEXT__
|
|
9
9
|
*/
|
|
@@ -25,4 +25,20 @@ var isOsContext = function isOsContext() {
|
|
|
25
25
|
return !!window.__IS_CONSOLE_OS_CONTEXT__;
|
|
26
26
|
}
|
|
27
27
|
};
|
|
28
|
-
|
|
28
|
+
|
|
29
|
+
/**
|
|
30
|
+
* set native object property
|
|
31
|
+
* @param obj
|
|
32
|
+
* @param propertyName
|
|
33
|
+
* @param value
|
|
34
|
+
* @returns
|
|
35
|
+
*/
|
|
36
|
+
exports.isOsContext = isOsContext;
|
|
37
|
+
var setNativeProperty = function setNativeProperty(obj, propertyName, value) {
|
|
38
|
+
var desc = Object.getOwnPropertyDescriptor(obj, propertyName);
|
|
39
|
+
|
|
40
|
+
// in strict mode, Cannot set property go of [xx] which has only a getter
|
|
41
|
+
if (desc && typeof desc.set === 'undefined') return;
|
|
42
|
+
obj[propertyName] = value;
|
|
43
|
+
};
|
|
44
|
+
exports.setNativeProperty = setNativeProperty;
|
package/lib/version.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alicloud/alfa-react",
|
|
3
|
-
"version": "1.6.1",
|
|
3
|
+
"version": "1.6.2-alpha.1",
|
|
4
4
|
"description": "Alfa Framework (React Version)",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -22,6 +22,7 @@
|
|
|
22
22
|
"@types/prop-types": "^15.7.5",
|
|
23
23
|
"@types/react": "^16.9.2",
|
|
24
24
|
"@types/react-dom": "^16.9.0",
|
|
25
|
+
"@types/react-lazyload": "^3.2.3",
|
|
25
26
|
"@types/single-spa-react": "^2.8.3",
|
|
26
27
|
"jest": "^23.6.0",
|
|
27
28
|
"react": "^16.9.0",
|
|
@@ -38,15 +39,16 @@
|
|
|
38
39
|
"classnames": "^2.2.6",
|
|
39
40
|
"crypto-js": "^4.1.1",
|
|
40
41
|
"prop-types": "^15.8.1",
|
|
42
|
+
"react-lazyload": "^3.2.1",
|
|
41
43
|
"@alicloud/alfa-core": "^1.4.37",
|
|
42
|
-
"@alicloud/console-os-loader": "^1.4.
|
|
44
|
+
"@alicloud/console-os-loader": "^1.4.42"
|
|
43
45
|
},
|
|
44
46
|
"peerDependencies": {
|
|
45
|
-
"react": ">=16.0.0"
|
|
47
|
+
"react": ">=16.0.0",
|
|
48
|
+
"react-dom": ">=16.0.0"
|
|
46
49
|
},
|
|
47
|
-
"gitHead": "ff9294b1d5e08b14691c8aa2bef098da2857f3df",
|
|
48
50
|
"scripts": {
|
|
49
|
-
"prepublish": "npm run version && npm run
|
|
51
|
+
"prepublish": "npm run version && npm run babel && npm run babel:esm && npm run types",
|
|
50
52
|
"pub": "pnpm publish",
|
|
51
53
|
"build": "breezr build --engine webpack",
|
|
52
54
|
"babel": "breezr build --engine babel",
|
|
@@ -54,7 +56,7 @@
|
|
|
54
56
|
"types": "tsc --emitDeclarationOnly -d --declarationDir ./types",
|
|
55
57
|
"storybook": "breezr start-storybook",
|
|
56
58
|
"clean": "rm -rf lib es dist types yarn.lock",
|
|
57
|
-
"start": "breezr start-storybook",
|
|
59
|
+
"start": "NODE_OPTIONS=--openssl-legacy-provider breezr start-storybook",
|
|
58
60
|
"precommit": "npm run version",
|
|
59
61
|
"version": "node -p \"'export const version = \\'' + require('./package.json').version + '\\';'\" > src/version.ts && git add src/version.ts"
|
|
60
62
|
}
|
package/types/createAlfaApp.d.ts
CHANGED
|
@@ -1,13 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { AlfaFactoryOption } from './types';
|
|
3
|
-
|
|
4
|
-
interface IProps extends Omit<IApplicationCustomProps, 'consoleBase' | 'path' | 'appConfig'> {
|
|
5
|
-
}
|
|
6
|
-
declare function createAlfaWidget<P = any>(option: AlfaFactoryOption): (() => null) | ((props: P & IProps) => JSX.Element);
|
|
3
|
+
declare function createAlfaWidget<P = any>(option: AlfaFactoryOption): React.FC<any>;
|
|
7
4
|
/**
|
|
8
5
|
* create memorized app in react function component, just create App after first mounted
|
|
9
6
|
* @param option
|
|
10
7
|
* @returns
|
|
11
8
|
*/
|
|
12
|
-
export declare function useAlfaWidget<P = any>(option: AlfaFactoryOption, deps?: any[]):
|
|
9
|
+
export declare function useAlfaWidget<P = any>(option: AlfaFactoryOption, deps?: any[]): React.FC<any>;
|
|
13
10
|
export default createAlfaWidget;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
import { BaseLoader } from '@alicloud/alfa-core';
|
|
3
2
|
import { AlfaFactoryOption } from './types';
|
|
4
3
|
export interface IApplicationCustomProps {
|
|
@@ -54,6 +53,7 @@ export interface IApplicationProps<C = any> extends AlfaFactoryOption {
|
|
|
54
53
|
* 注入给子应用的 history 实例,不推荐使用
|
|
55
54
|
*/
|
|
56
55
|
history?: any;
|
|
56
|
+
preLoader?: BaseLoader['register'];
|
|
57
57
|
}
|
|
58
58
|
/**
|
|
59
59
|
* container for microApp mount
|
package/types/types/index.d.ts
CHANGED
|
@@ -48,6 +48,13 @@ export interface AlfaFactoryOption extends IAppConfig {
|
|
|
48
48
|
* 延迟加载
|
|
49
49
|
*/
|
|
50
50
|
delay?: number;
|
|
51
|
+
/**
|
|
52
|
+
* 优先级
|
|
53
|
+
* - high: 尽可能早的加载
|
|
54
|
+
* - medium: 当 mount 发生后并且 high priority 队列清空后开始加载
|
|
55
|
+
* - low: 当出现在视窗内并且更高优先级的队列全部清空后,最晚不会迟于 10s 开始加载
|
|
56
|
+
*/
|
|
57
|
+
priority?: 'high' | 'medium' | 'low';
|
|
51
58
|
}
|
|
52
59
|
type ThenArg<T> = T extends PromiseLike<infer U> ? U : T;
|
|
53
60
|
export type MicroApplication = ThenArg<ReturnType<typeof createMicroApp>>;
|
package/types/utils/index.d.ts
CHANGED
|
@@ -3,3 +3,11 @@ export declare const normalizeName: (name: string) => string;
|
|
|
3
3
|
* 判断是否在沙箱环境中运行
|
|
4
4
|
*/
|
|
5
5
|
export declare const isOsContext: () => boolean;
|
|
6
|
+
/**
|
|
7
|
+
* set native object property
|
|
8
|
+
* @param obj
|
|
9
|
+
* @param propertyName
|
|
10
|
+
* @param value
|
|
11
|
+
* @returns
|
|
12
|
+
*/
|
|
13
|
+
export declare const setNativeProperty: (obj: any, propertyName: string, value: any) => void;
|
package/types/version.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const version = "1.6.1";
|
|
1
|
+
export declare const version = "1.6.2-alpha.1";
|
package/types/widget.d.ts
CHANGED