@module-federation/devtools 2.5.1 → 2.7.0
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/dist/es/App.js +3 -2
- package/dist/es/component/DependencyGraphItem/index.js +18 -7
- package/dist/es/utils/chrome/index.js +37 -17
- package/dist/es/utils/chrome/post-message-listener.js +5 -2
- package/dist/es/utils/sdk/graph.js +25 -11
- package/dist/lib/App.js +2 -3
- package/dist/lib/App.module.js +0 -1
- package/dist/lib/component/DependencyGraph/index.js +0 -1
- package/dist/lib/component/DependencyGraph/index.module.js +0 -1
- package/dist/lib/component/DependencyGraphItem/index.js +18 -8
- package/dist/lib/component/DependencyGraphItem/index.module.js +0 -1
- package/dist/lib/component/Form/index.js +0 -1
- package/dist/lib/component/Form/index.module.js +0 -1
- package/dist/lib/component/LanguageSwitch.js +0 -1
- package/dist/lib/component/Layout/index.js +0 -1
- package/dist/lib/component/Layout/index.module.js +0 -1
- package/dist/lib/component/LoadingTrace/index.js +0 -1
- package/dist/lib/component/LoadingTrace/index.module.js +0 -1
- package/dist/lib/component/ModuleInfo/index.js +0 -1
- package/dist/lib/component/ModuleInfo/index.module.js +0 -1
- package/dist/lib/component/SharedDepsExplorer/FocusResultDisplay.js +0 -1
- package/dist/lib/component/SharedDepsExplorer/FocusResultDisplay.module.js +0 -1
- package/dist/lib/component/SharedDepsExplorer/index.js +0 -1
- package/dist/lib/component/SharedDepsExplorer/index.module.js +0 -1
- package/dist/lib/component/SharedDepsExplorer/share-utils.js +0 -1
- package/dist/lib/component/ThemeToggle.js +0 -1
- package/dist/lib/component/ThemeToggle.module.js +0 -1
- package/dist/lib/hooks/useDevtoolsTheme.js +0 -1
- package/dist/lib/i18n/index.js +0 -1
- package/dist/lib/init.js +0 -1
- package/dist/lib/template/constant.js +0 -1
- package/dist/lib/template/index.js +0 -1
- package/dist/lib/utils/chrome/fast-refresh.js +0 -1
- package/dist/lib/utils/chrome/index.js +38 -18
- package/dist/lib/utils/chrome/messages.js +0 -1
- package/dist/lib/utils/chrome/observability-plugin.js +0 -1
- package/dist/lib/utils/chrome/observability-shared.js +0 -1
- package/dist/lib/utils/chrome/observability.js +0 -1
- package/dist/lib/utils/chrome/override-remote.js +0 -1
- package/dist/lib/utils/chrome/post-message-init.js +0 -1
- package/dist/lib/utils/chrome/post-message-listener.js +5 -3
- package/dist/lib/utils/chrome/post-message-start.js +0 -1
- package/dist/lib/utils/chrome/post-message.js +0 -1
- package/dist/lib/utils/chrome/safe-post-message.js +0 -1
- package/dist/lib/utils/chrome/snapshot-plugin.js +0 -1
- package/dist/lib/utils/chrome/storage.js +0 -1
- package/dist/lib/utils/data/index.js +0 -1
- package/dist/lib/utils/index.js +0 -1
- package/dist/lib/utils/sdk/graph.js +25 -12
- package/dist/lib/utils/sdk/index.js +0 -1
- package/dist/lib/utils/types/common.js +0 -1
- package/dist/lib/utils/types/index.js +0 -1
- package/dist/lib/worker/index.js +0 -1
- package/dist/types/src/component/SharedDepsExplorer/share-utils.d.ts +1 -1
- package/dist/types/src/template/constant.d.ts +1 -1
- package/dist/types/src/utils/chrome/index.d.ts +2 -1
- package/dist/types/src/utils/chrome/observability.d.ts +1 -1
- package/dist/types/src/utils/data/index.d.ts +1 -1
- package/dist/types/src/utils/sdk/graph.d.ts +1 -1
- package/dist/types/src/utils/sdk/index.d.ts +2 -2
- package/package.json +7 -8
package/dist/es/App.js
CHANGED
|
@@ -51,6 +51,7 @@ import LanguageSwitch from "./component/LanguageSwitch";
|
|
|
51
51
|
import ThemeToggle from "./component/ThemeToggle";
|
|
52
52
|
import {
|
|
53
53
|
getGlobalModuleInfo,
|
|
54
|
+
normalizeModuleInfoPayload,
|
|
54
55
|
refreshModuleInfo,
|
|
55
56
|
separateType,
|
|
56
57
|
syncActiveTab
|
|
@@ -63,10 +64,10 @@ import styles from "./App.module";
|
|
|
63
64
|
import btnStyles from "./component/ThemeToggle.module";
|
|
64
65
|
const cloneModuleInfo = (info) => {
|
|
65
66
|
try {
|
|
66
|
-
return
|
|
67
|
+
return normalizeModuleInfoPayload(info);
|
|
67
68
|
} catch (error) {
|
|
68
69
|
console.warn("[MF Devtools] cloneModuleInfo failed", error);
|
|
69
|
-
return
|
|
70
|
+
return {};
|
|
70
71
|
}
|
|
71
72
|
};
|
|
72
73
|
const normalizeShareValue = (target, seen = /* @__PURE__ */ new WeakSet()) => {
|
|
@@ -4,6 +4,23 @@ import { Handle, Position } from "reactflow";
|
|
|
4
4
|
import { useTranslation } from "react-i18next";
|
|
5
5
|
import styles from "./index.module";
|
|
6
6
|
import "reactflow/dist/style.css";
|
|
7
|
+
const parseInfo = (info) => {
|
|
8
|
+
const array = info.split(":");
|
|
9
|
+
const [fallbackName, fallbackVersion = ""] = array;
|
|
10
|
+
const idx = array.findIndex((item, index) => {
|
|
11
|
+
return index > 0 && (item.startsWith("http") || item.startsWith("//"));
|
|
12
|
+
});
|
|
13
|
+
if (idx > 0) {
|
|
14
|
+
return {
|
|
15
|
+
name: array.slice(0, idx).join(":"),
|
|
16
|
+
version: array.slice(idx).join(":")
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
return {
|
|
20
|
+
name: fallbackName,
|
|
21
|
+
version: fallbackVersion
|
|
22
|
+
};
|
|
23
|
+
};
|
|
7
24
|
const GraphItem = (props) => {
|
|
8
25
|
const [shareds, setShareds] = useState([]);
|
|
9
26
|
const [exposes, setExposes] = useState([]);
|
|
@@ -11,13 +28,7 @@ const GraphItem = (props) => {
|
|
|
11
28
|
let name;
|
|
12
29
|
let version;
|
|
13
30
|
const { info = "", color, remote } = props.data;
|
|
14
|
-
|
|
15
|
-
if (info.endsWith(".json") || info.endsWith(".js")) {
|
|
16
|
-
name = infoArray.shift();
|
|
17
|
-
version = infoArray.join(":");
|
|
18
|
-
} else {
|
|
19
|
-
[name, version] = infoArray;
|
|
20
|
-
}
|
|
31
|
+
({ name, version } = parseInfo(info));
|
|
21
32
|
const isEntryType = (version == null ? void 0 : version.startsWith("http")) || (version == null ? void 0 : version.startsWith("//"));
|
|
22
33
|
useEffect(() => {
|
|
23
34
|
var _a, _b;
|
|
@@ -41,6 +41,23 @@ import { FormID } from "../../template/constant";
|
|
|
41
41
|
import { definePropertyGlobalVal } from "../sdk";
|
|
42
42
|
import { sanitizePostMessagePayload } from "./safe-post-message";
|
|
43
43
|
export * from "./storage";
|
|
44
|
+
const isModuleInfoRecord = (value) => Boolean(value) && typeof value === "object" && !Array.isArray(value);
|
|
45
|
+
const isModuleInfoSyncMessage = (value) => isModuleInfoRecord(value) && ("moduleInfo" in value || "updateModule" in value || "share" in value);
|
|
46
|
+
const normalizeModuleInfoPayload = (moduleInfo) => {
|
|
47
|
+
const sanitized = sanitizePostMessagePayload(moduleInfo);
|
|
48
|
+
if (!isModuleInfoRecord(sanitized)) {
|
|
49
|
+
return {};
|
|
50
|
+
}
|
|
51
|
+
return Object.entries(sanitized).reduce(
|
|
52
|
+
(moduleMap, [moduleId, snapshot]) => {
|
|
53
|
+
if (moduleId === "extendInfos" || isModuleInfoRecord(snapshot)) {
|
|
54
|
+
moduleMap[moduleId] = snapshot;
|
|
55
|
+
}
|
|
56
|
+
return moduleMap;
|
|
57
|
+
},
|
|
58
|
+
{}
|
|
59
|
+
);
|
|
60
|
+
};
|
|
44
61
|
const sleep = (num) => {
|
|
45
62
|
return new Promise((resolve) => {
|
|
46
63
|
setTimeout(() => {
|
|
@@ -133,42 +150,44 @@ const refreshModuleInfo = () => __async(void 0, null, function* () {
|
|
|
133
150
|
const getGlobalModuleInfo = (callback) => __async(void 0, null, function* () {
|
|
134
151
|
var _a, _b;
|
|
135
152
|
if (typeof window !== "undefined" && ((_a = window.__FEDERATION__) == null ? void 0 : _a.moduleInfo)) {
|
|
136
|
-
callback(
|
|
137
|
-
sanitizePostMessagePayload(
|
|
138
|
-
(_b = window.__FEDERATION__) == null ? void 0 : _b.moduleInfo
|
|
139
|
-
)
|
|
140
|
-
);
|
|
153
|
+
callback(normalizeModuleInfoPayload((_b = window.__FEDERATION__) == null ? void 0 : _b.moduleInfo));
|
|
141
154
|
}
|
|
142
155
|
yield sleep(300);
|
|
143
156
|
const listener = (message) => {
|
|
144
157
|
const { data } = message;
|
|
145
|
-
if (!data || (data == null ? void 0 : data.appInfos)) {
|
|
158
|
+
if (!isModuleInfoSyncMessage(data) || (data == null ? void 0 : data.appInfos)) {
|
|
146
159
|
return;
|
|
147
160
|
}
|
|
148
161
|
if (!(window == null ? void 0 : window.__FEDERATION__)) {
|
|
149
162
|
definePropertyGlobalVal(window, "__FEDERATION__", {});
|
|
150
163
|
definePropertyGlobalVal(window, "__VMOK__", window.__FEDERATION__);
|
|
151
164
|
}
|
|
152
|
-
window.__FEDERATION__.originModuleInfo =
|
|
153
|
-
|
|
165
|
+
window.__FEDERATION__.originModuleInfo = "moduleInfo" in data ? normalizeModuleInfoPayload(data.moduleInfo) : normalizeModuleInfoPayload(
|
|
166
|
+
window.__FEDERATION__.originModuleInfo || window.__FEDERATION__.moduleInfo
|
|
154
167
|
);
|
|
155
|
-
|
|
168
|
+
const updateModule = data.updateModule;
|
|
169
|
+
if (isModuleInfoRecord(updateModule) && typeof updateModule.name === "string") {
|
|
170
|
+
const updateModuleName = updateModule.name;
|
|
156
171
|
const moduleIds = Object.keys(window.__FEDERATION__.originModuleInfo);
|
|
157
172
|
const shouldUpdate = !moduleIds.some(
|
|
158
|
-
(id) => id.includes(
|
|
173
|
+
(id) => id.includes(updateModuleName)
|
|
159
174
|
);
|
|
160
175
|
if (shouldUpdate) {
|
|
161
|
-
const destination =
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
176
|
+
const destination = typeof updateModule.entry === "string" ? updateModule.entry : typeof updateModule.version === "string" ? updateModule.version : void 0;
|
|
177
|
+
if (destination) {
|
|
178
|
+
window.__FEDERATION__.originModuleInfo[`${updateModuleName}:${destination}`] = {
|
|
179
|
+
remoteEntry: destination,
|
|
180
|
+
version: destination
|
|
181
|
+
};
|
|
182
|
+
}
|
|
166
183
|
}
|
|
167
184
|
}
|
|
168
185
|
if (data == null ? void 0 : data.share) {
|
|
169
|
-
window.__FEDERATION__.__SHARE__ = sanitizePostMessagePayload(
|
|
186
|
+
window.__FEDERATION__.__SHARE__ = sanitizePostMessagePayload(
|
|
187
|
+
data.share
|
|
188
|
+
);
|
|
170
189
|
}
|
|
171
|
-
window.__FEDERATION__.moduleInfo =
|
|
190
|
+
window.__FEDERATION__.moduleInfo = normalizeModuleInfoPayload(
|
|
172
191
|
window.__FEDERATION__.originModuleInfo
|
|
173
192
|
);
|
|
174
193
|
console.log("getGlobalModuleInfo window", window.__FEDERATION__);
|
|
@@ -257,6 +276,7 @@ export {
|
|
|
257
276
|
injectPostMessage,
|
|
258
277
|
injectScript,
|
|
259
278
|
injectToast,
|
|
279
|
+
normalizeModuleInfoPayload,
|
|
260
280
|
refreshModuleInfo,
|
|
261
281
|
setChromeStorage,
|
|
262
282
|
setTargetTab,
|
|
@@ -3,11 +3,14 @@ import {
|
|
|
3
3
|
MESSAGE_OBSERVABILITY_DEVTOOLS_EVENT,
|
|
4
4
|
OBSERVABILITY_DEVTOOLS_SOURCE
|
|
5
5
|
} from "./messages";
|
|
6
|
+
const isModuleInfoPayload = (value) => Boolean(value) && typeof value === "object" && !Array.isArray(value);
|
|
7
|
+
const getMessageData = (data) => Boolean(data) && typeof data === "object" ? data : {};
|
|
6
8
|
if (window.moduleHandler) {
|
|
7
9
|
window.removeEventListener("message", window.moduleHandler);
|
|
8
10
|
} else {
|
|
9
11
|
window.moduleHandler = (event) => {
|
|
10
|
-
const { origin
|
|
12
|
+
const { origin } = event;
|
|
13
|
+
const data = getMessageData(event.data);
|
|
11
14
|
if ((data == null ? void 0 : data.source) === OBSERVABILITY_DEVTOOLS_SOURCE) {
|
|
12
15
|
chrome.runtime.sendMessage({
|
|
13
16
|
type: MESSAGE_OBSERVABILITY_DEVTOOLS_EVENT,
|
|
@@ -18,7 +21,7 @@ if (window.moduleHandler) {
|
|
|
18
21
|
});
|
|
19
22
|
return;
|
|
20
23
|
}
|
|
21
|
-
if (!data.moduleInfo) {
|
|
24
|
+
if (!isModuleInfoPayload(data.moduleInfo)) {
|
|
22
25
|
return;
|
|
23
26
|
}
|
|
24
27
|
chrome.runtime.sendMessage({
|
|
@@ -20,26 +20,38 @@ const validateSemver = (schema) => {
|
|
|
20
20
|
return reg.test(schema);
|
|
21
21
|
};
|
|
22
22
|
const validatePort = (schema) => !isNaN(Number(schema));
|
|
23
|
-
const
|
|
23
|
+
const isEntrySegment = (segment) => segment.startsWith("http") || segment.startsWith("//");
|
|
24
|
+
const parseModuleId = (target) => {
|
|
24
25
|
const array = target.split(":");
|
|
25
26
|
const { length } = array;
|
|
27
|
+
const result = {
|
|
28
|
+
name: target,
|
|
29
|
+
version: ""
|
|
30
|
+
};
|
|
26
31
|
if (length === 1) {
|
|
27
|
-
return
|
|
32
|
+
return result;
|
|
28
33
|
} else if (length >= 3) {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
return
|
|
34
|
+
const idx = array.findIndex(isEntrySegment);
|
|
35
|
+
if (idx > 0) {
|
|
36
|
+
result.name = array[idx - 1];
|
|
37
|
+
result.version = array.slice(idx).join(":");
|
|
38
|
+
return result;
|
|
34
39
|
}
|
|
40
|
+
result.name = array[1];
|
|
41
|
+
result.version = array.slice(2).join(":");
|
|
42
|
+
return result;
|
|
35
43
|
} else {
|
|
36
44
|
const nameOrVersion = array[length - 1];
|
|
37
|
-
if (nameOrVersion === "*" || nameOrVersion === "latest" || validateSemver(nameOrVersion)) {
|
|
38
|
-
|
|
45
|
+
if (nameOrVersion === "*" || nameOrVersion === "latest" || validateSemver(nameOrVersion) || isEntrySegment(nameOrVersion) || nameOrVersion.endsWith(".json") || nameOrVersion.endsWith(".js")) {
|
|
46
|
+
result.name = array[0];
|
|
47
|
+
result.version = nameOrVersion;
|
|
48
|
+
return result;
|
|
39
49
|
} else {
|
|
40
|
-
|
|
50
|
+
result.name = nameOrVersion;
|
|
51
|
+
return result;
|
|
41
52
|
}
|
|
42
53
|
}
|
|
54
|
+
return result;
|
|
43
55
|
};
|
|
44
56
|
class DependencyGraph {
|
|
45
57
|
constructor(snapshot, initTarget) {
|
|
@@ -112,12 +124,14 @@ class DependencyGraph {
|
|
|
112
124
|
if (!targetGraph || !((_a = Object.keys(targetGraph)) == null ? void 0 : _a.length)) {
|
|
113
125
|
return;
|
|
114
126
|
}
|
|
115
|
-
const name =
|
|
127
|
+
const { name, version } = parseModuleId(target);
|
|
116
128
|
const targetWithoutType = name;
|
|
117
129
|
let info = name;
|
|
118
130
|
const remote = this.snapshot[target];
|
|
119
131
|
if (remote && ("version" in remote || "remoteEntry" in remote)) {
|
|
120
132
|
info += `:${remote.version || remote.remoteEntry}`;
|
|
133
|
+
} else if (version) {
|
|
134
|
+
info += `:${version}`;
|
|
121
135
|
}
|
|
122
136
|
if (!this.identifyMap.has(targetWithoutType)) {
|
|
123
137
|
this.identifyMap.set(targetWithoutType, this.identify());
|
package/dist/lib/App.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
var __create = Object.create;
|
|
3
2
|
var __defProp = Object.defineProperty;
|
|
4
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -89,10 +88,10 @@ var import_App2 = __toESM(require("./App.module"));
|
|
|
89
88
|
var import_ThemeToggle2 = __toESM(require("./component/ThemeToggle.module"));
|
|
90
89
|
const cloneModuleInfo = (info) => {
|
|
91
90
|
try {
|
|
92
|
-
return
|
|
91
|
+
return (0, import_utils.normalizeModuleInfoPayload)(info);
|
|
93
92
|
} catch (error) {
|
|
94
93
|
console.warn("[MF Devtools] cloneModuleInfo failed", error);
|
|
95
|
-
return
|
|
94
|
+
return {};
|
|
96
95
|
}
|
|
97
96
|
};
|
|
98
97
|
const normalizeShareValue = (target, seen = /* @__PURE__ */ new WeakSet()) => {
|
package/dist/lib/App.module.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
var __create = Object.create;
|
|
3
2
|
var __defProp = Object.defineProperty;
|
|
4
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -37,6 +36,23 @@ var import_reactflow = require("reactflow");
|
|
|
37
36
|
var import_react_i18next = require("react-i18next");
|
|
38
37
|
var import_index = __toESM(require("./index.module"));
|
|
39
38
|
var import_style = require("reactflow/dist/style.css");
|
|
39
|
+
const parseInfo = (info) => {
|
|
40
|
+
const array = info.split(":");
|
|
41
|
+
const [fallbackName, fallbackVersion = ""] = array;
|
|
42
|
+
const idx = array.findIndex((item, index) => {
|
|
43
|
+
return index > 0 && (item.startsWith("http") || item.startsWith("//"));
|
|
44
|
+
});
|
|
45
|
+
if (idx > 0) {
|
|
46
|
+
return {
|
|
47
|
+
name: array.slice(0, idx).join(":"),
|
|
48
|
+
version: array.slice(idx).join(":")
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
return {
|
|
52
|
+
name: fallbackName,
|
|
53
|
+
version: fallbackVersion
|
|
54
|
+
};
|
|
55
|
+
};
|
|
40
56
|
const GraphItem = (props) => {
|
|
41
57
|
const [shareds, setShareds] = (0, import_react.useState)([]);
|
|
42
58
|
const [exposes, setExposes] = (0, import_react.useState)([]);
|
|
@@ -44,13 +60,7 @@ const GraphItem = (props) => {
|
|
|
44
60
|
let name;
|
|
45
61
|
let version;
|
|
46
62
|
const { info = "", color, remote } = props.data;
|
|
47
|
-
|
|
48
|
-
if (info.endsWith(".json") || info.endsWith(".js")) {
|
|
49
|
-
name = infoArray.shift();
|
|
50
|
-
version = infoArray.join(":");
|
|
51
|
-
} else {
|
|
52
|
-
[name, version] = infoArray;
|
|
53
|
-
}
|
|
63
|
+
({ name, version } = parseInfo(info));
|
|
54
64
|
const isEntryType = (version == null ? void 0 : version.startsWith("http")) || (version == null ? void 0 : version.startsWith("//"));
|
|
55
65
|
(0, import_react.useEffect)(() => {
|
|
56
66
|
var _a, _b;
|
package/dist/lib/i18n/index.js
CHANGED
package/dist/lib/init.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
var __defProp = Object.defineProperty;
|
|
3
2
|
var __defProps = Object.defineProperties;
|
|
4
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -66,6 +65,7 @@ __export(chrome_exports, {
|
|
|
66
65
|
injectPostMessage: () => injectPostMessage,
|
|
67
66
|
injectScript: () => injectScript,
|
|
68
67
|
injectToast: () => injectToast,
|
|
68
|
+
normalizeModuleInfoPayload: () => normalizeModuleInfoPayload,
|
|
69
69
|
refreshModuleInfo: () => refreshModuleInfo,
|
|
70
70
|
setChromeStorage: () => setChromeStorage,
|
|
71
71
|
setTargetTab: () => setTargetTab,
|
|
@@ -76,6 +76,23 @@ var import_constant = require("../../template/constant");
|
|
|
76
76
|
var import_sdk2 = require("../sdk");
|
|
77
77
|
var import_safe_post_message = require("./safe-post-message");
|
|
78
78
|
__reExport(chrome_exports, require("./storage"), module.exports);
|
|
79
|
+
const isModuleInfoRecord = (value) => Boolean(value) && typeof value === "object" && !Array.isArray(value);
|
|
80
|
+
const isModuleInfoSyncMessage = (value) => isModuleInfoRecord(value) && ("moduleInfo" in value || "updateModule" in value || "share" in value);
|
|
81
|
+
const normalizeModuleInfoPayload = (moduleInfo) => {
|
|
82
|
+
const sanitized = (0, import_safe_post_message.sanitizePostMessagePayload)(moduleInfo);
|
|
83
|
+
if (!isModuleInfoRecord(sanitized)) {
|
|
84
|
+
return {};
|
|
85
|
+
}
|
|
86
|
+
return Object.entries(sanitized).reduce(
|
|
87
|
+
(moduleMap, [moduleId, snapshot]) => {
|
|
88
|
+
if (moduleId === "extendInfos" || isModuleInfoRecord(snapshot)) {
|
|
89
|
+
moduleMap[moduleId] = snapshot;
|
|
90
|
+
}
|
|
91
|
+
return moduleMap;
|
|
92
|
+
},
|
|
93
|
+
{}
|
|
94
|
+
);
|
|
95
|
+
};
|
|
79
96
|
const sleep = (num) => {
|
|
80
97
|
return new Promise((resolve) => {
|
|
81
98
|
setTimeout(() => {
|
|
@@ -168,42 +185,44 @@ const refreshModuleInfo = () => __async(void 0, null, function* () {
|
|
|
168
185
|
const getGlobalModuleInfo = (callback) => __async(void 0, null, function* () {
|
|
169
186
|
var _a, _b;
|
|
170
187
|
if (typeof window !== "undefined" && ((_a = window.__FEDERATION__) == null ? void 0 : _a.moduleInfo)) {
|
|
171
|
-
callback(
|
|
172
|
-
(0, import_safe_post_message.sanitizePostMessagePayload)(
|
|
173
|
-
(_b = window.__FEDERATION__) == null ? void 0 : _b.moduleInfo
|
|
174
|
-
)
|
|
175
|
-
);
|
|
188
|
+
callback(normalizeModuleInfoPayload((_b = window.__FEDERATION__) == null ? void 0 : _b.moduleInfo));
|
|
176
189
|
}
|
|
177
190
|
yield sleep(300);
|
|
178
191
|
const listener = (message) => {
|
|
179
192
|
const { data } = message;
|
|
180
|
-
if (!data || (data == null ? void 0 : data.appInfos)) {
|
|
193
|
+
if (!isModuleInfoSyncMessage(data) || (data == null ? void 0 : data.appInfos)) {
|
|
181
194
|
return;
|
|
182
195
|
}
|
|
183
196
|
if (!(window == null ? void 0 : window.__FEDERATION__)) {
|
|
184
197
|
(0, import_sdk2.definePropertyGlobalVal)(window, "__FEDERATION__", {});
|
|
185
198
|
(0, import_sdk2.definePropertyGlobalVal)(window, "__VMOK__", window.__FEDERATION__);
|
|
186
199
|
}
|
|
187
|
-
window.__FEDERATION__.originModuleInfo = (
|
|
188
|
-
|
|
200
|
+
window.__FEDERATION__.originModuleInfo = "moduleInfo" in data ? normalizeModuleInfoPayload(data.moduleInfo) : normalizeModuleInfoPayload(
|
|
201
|
+
window.__FEDERATION__.originModuleInfo || window.__FEDERATION__.moduleInfo
|
|
189
202
|
);
|
|
190
|
-
|
|
203
|
+
const updateModule = data.updateModule;
|
|
204
|
+
if (isModuleInfoRecord(updateModule) && typeof updateModule.name === "string") {
|
|
205
|
+
const updateModuleName = updateModule.name;
|
|
191
206
|
const moduleIds = Object.keys(window.__FEDERATION__.originModuleInfo);
|
|
192
207
|
const shouldUpdate = !moduleIds.some(
|
|
193
|
-
(id) => id.includes(
|
|
208
|
+
(id) => id.includes(updateModuleName)
|
|
194
209
|
);
|
|
195
210
|
if (shouldUpdate) {
|
|
196
|
-
const destination =
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
211
|
+
const destination = typeof updateModule.entry === "string" ? updateModule.entry : typeof updateModule.version === "string" ? updateModule.version : void 0;
|
|
212
|
+
if (destination) {
|
|
213
|
+
window.__FEDERATION__.originModuleInfo[`${updateModuleName}:${destination}`] = {
|
|
214
|
+
remoteEntry: destination,
|
|
215
|
+
version: destination
|
|
216
|
+
};
|
|
217
|
+
}
|
|
201
218
|
}
|
|
202
219
|
}
|
|
203
220
|
if (data == null ? void 0 : data.share) {
|
|
204
|
-
window.__FEDERATION__.__SHARE__ = (0, import_safe_post_message.sanitizePostMessagePayload)(
|
|
221
|
+
window.__FEDERATION__.__SHARE__ = (0, import_safe_post_message.sanitizePostMessagePayload)(
|
|
222
|
+
data.share
|
|
223
|
+
);
|
|
205
224
|
}
|
|
206
|
-
window.__FEDERATION__.moduleInfo = (
|
|
225
|
+
window.__FEDERATION__.moduleInfo = normalizeModuleInfoPayload(
|
|
207
226
|
window.__FEDERATION__.originModuleInfo
|
|
208
227
|
);
|
|
209
228
|
console.log("getGlobalModuleInfo window", window.__FEDERATION__);
|
|
@@ -293,6 +312,7 @@ const setChromeStorage = (formData) => {
|
|
|
293
312
|
injectPostMessage,
|
|
294
313
|
injectScript,
|
|
295
314
|
injectToast,
|
|
315
|
+
normalizeModuleInfoPayload,
|
|
296
316
|
refreshModuleInfo,
|
|
297
317
|
setChromeStorage,
|
|
298
318
|
setTargetTab,
|
|
@@ -1,11 +1,13 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
var import_safe_post_message = require("./safe-post-message");
|
|
3
2
|
var import_messages = require("./messages");
|
|
3
|
+
const isModuleInfoPayload = (value) => Boolean(value) && typeof value === "object" && !Array.isArray(value);
|
|
4
|
+
const getMessageData = (data) => Boolean(data) && typeof data === "object" ? data : {};
|
|
4
5
|
if (window.moduleHandler) {
|
|
5
6
|
window.removeEventListener("message", window.moduleHandler);
|
|
6
7
|
} else {
|
|
7
8
|
window.moduleHandler = (event) => {
|
|
8
|
-
const { origin
|
|
9
|
+
const { origin } = event;
|
|
10
|
+
const data = getMessageData(event.data);
|
|
9
11
|
if ((data == null ? void 0 : data.source) === import_messages.OBSERVABILITY_DEVTOOLS_SOURCE) {
|
|
10
12
|
chrome.runtime.sendMessage({
|
|
11
13
|
type: import_messages.MESSAGE_OBSERVABILITY_DEVTOOLS_EVENT,
|
|
@@ -16,7 +18,7 @@ if (window.moduleHandler) {
|
|
|
16
18
|
});
|
|
17
19
|
return;
|
|
18
20
|
}
|
|
19
|
-
if (!data.moduleInfo) {
|
|
21
|
+
if (!isModuleInfoPayload(data.moduleInfo)) {
|
|
20
22
|
return;
|
|
21
23
|
}
|
|
22
24
|
chrome.runtime.sendMessage({
|
package/dist/lib/utils/index.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
var __defProp = Object.defineProperty;
|
|
3
2
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
3
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
@@ -43,26 +42,38 @@ const validateSemver = (schema) => {
|
|
|
43
42
|
return reg.test(schema);
|
|
44
43
|
};
|
|
45
44
|
const validatePort = (schema) => !isNaN(Number(schema));
|
|
46
|
-
const
|
|
45
|
+
const isEntrySegment = (segment) => segment.startsWith("http") || segment.startsWith("//");
|
|
46
|
+
const parseModuleId = (target) => {
|
|
47
47
|
const array = target.split(":");
|
|
48
48
|
const { length } = array;
|
|
49
|
+
const result = {
|
|
50
|
+
name: target,
|
|
51
|
+
version: ""
|
|
52
|
+
};
|
|
49
53
|
if (length === 1) {
|
|
50
|
-
return
|
|
54
|
+
return result;
|
|
51
55
|
} else if (length >= 3) {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
return
|
|
56
|
+
const idx = array.findIndex(isEntrySegment);
|
|
57
|
+
if (idx > 0) {
|
|
58
|
+
result.name = array[idx - 1];
|
|
59
|
+
result.version = array.slice(idx).join(":");
|
|
60
|
+
return result;
|
|
57
61
|
}
|
|
62
|
+
result.name = array[1];
|
|
63
|
+
result.version = array.slice(2).join(":");
|
|
64
|
+
return result;
|
|
58
65
|
} else {
|
|
59
66
|
const nameOrVersion = array[length - 1];
|
|
60
|
-
if (nameOrVersion === "*" || nameOrVersion === "latest" || validateSemver(nameOrVersion)) {
|
|
61
|
-
|
|
67
|
+
if (nameOrVersion === "*" || nameOrVersion === "latest" || validateSemver(nameOrVersion) || isEntrySegment(nameOrVersion) || nameOrVersion.endsWith(".json") || nameOrVersion.endsWith(".js")) {
|
|
68
|
+
result.name = array[0];
|
|
69
|
+
result.version = nameOrVersion;
|
|
70
|
+
return result;
|
|
62
71
|
} else {
|
|
63
|
-
|
|
72
|
+
result.name = nameOrVersion;
|
|
73
|
+
return result;
|
|
64
74
|
}
|
|
65
75
|
}
|
|
76
|
+
return result;
|
|
66
77
|
};
|
|
67
78
|
class DependencyGraph {
|
|
68
79
|
constructor(snapshot, initTarget) {
|
|
@@ -135,12 +146,14 @@ class DependencyGraph {
|
|
|
135
146
|
if (!targetGraph || !((_a = Object.keys(targetGraph)) == null ? void 0 : _a.length)) {
|
|
136
147
|
return;
|
|
137
148
|
}
|
|
138
|
-
const name =
|
|
149
|
+
const { name, version } = parseModuleId(target);
|
|
139
150
|
const targetWithoutType = name;
|
|
140
151
|
let info = name;
|
|
141
152
|
const remote = this.snapshot[target];
|
|
142
153
|
if (remote && ("version" in remote || "remoteEntry" in remote)) {
|
|
143
154
|
info += `:${remote.version || remote.remoteEntry}`;
|
|
155
|
+
} else if (version) {
|
|
156
|
+
info += `:${version}`;
|
|
144
157
|
}
|
|
145
158
|
if (!this.identifyMap.has(targetWithoutType)) {
|
|
146
159
|
this.identifyMap.set(targetWithoutType, this.identify());
|
package/dist/lib/worker/index.js
CHANGED
|
@@ -41,5 +41,5 @@ export declare function findPackageProvider(versions: NormalizedSharedVersion[],
|
|
|
41
41
|
version: string;
|
|
42
42
|
providers: string[];
|
|
43
43
|
status: LoadedStatus;
|
|
44
|
-
}
|
|
44
|
+
};
|
|
45
45
|
export declare function getReusedVersions(versions: NormalizedSharedVersion[]): NormalizedSharedVersion[];
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { GlobalModuleInfo } from '@module-federation/sdk';
|
|
2
2
|
export * from './storage';
|
|
3
|
+
export declare const normalizeModuleInfoPayload: (moduleInfo: unknown) => GlobalModuleInfo;
|
|
3
4
|
export declare const injectPostMessage: (postMessageUrl: string) => void;
|
|
4
5
|
export declare const TabInfo: {
|
|
5
6
|
currentTabId: number;
|
|
6
7
|
};
|
|
7
8
|
export declare const setTargetTab: (tab?: chrome.tabs.Tab | null) => void;
|
|
8
|
-
export declare const syncActiveTab: (tabId?: number) => Promise<chrome.tabs.Tab
|
|
9
|
+
export declare const syncActiveTab: (tabId?: number) => Promise<chrome.tabs.Tab>;
|
|
9
10
|
export declare function getCurrentTabId(): number;
|
|
10
11
|
export declare function getInspectWindowTabId(): Promise<unknown>;
|
|
11
12
|
export declare const refreshModuleInfo: () => Promise<void>;
|
|
@@ -107,4 +107,4 @@ export declare const disableObservabilityConfig: () => Promise<any>;
|
|
|
107
107
|
export declare const reloadInspectedPage: () => Promise<any>;
|
|
108
108
|
export declare const readObservabilitySnapshot: () => Promise<ObservabilityDevtoolsSnapshot>;
|
|
109
109
|
export declare const mergeObservabilityReports: (currentReports: ObservabilityDevtoolsReport[], incomingReports: ObservabilityDevtoolsReport[]) => ObservabilityDevtoolsReport[];
|
|
110
|
-
export declare const getObservabilityReportScopeLabel: (report: Pick<ObservabilityDevtoolsReport, "__scope">) => string
|
|
110
|
+
export declare const getObservabilityReportScopeLabel: (report: Pick<ObservabilityDevtoolsReport, "__scope">) => string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { GlobalModuleInfo } from '@module-federation/sdk';
|
|
2
2
|
export declare const separateType: (moduleInfo: GlobalModuleInfo) => {
|
|
3
|
-
consumers: Record<string, import("@module-federation/sdk").ModuleInfo | import("@module-federation/sdk").ManifestProvider | import("@module-federation/sdk").PureEntryProvider
|
|
3
|
+
consumers: Record<string, import("@module-federation/sdk").ModuleInfo | import("@module-federation/sdk").ManifestProvider | import("@module-federation/sdk").PureEntryProvider>;
|
|
4
4
|
producer: string[];
|
|
5
5
|
};
|
|
6
6
|
export declare const getModuleInfo: (proxyRules: Array<any>) => Promise<{
|
|
@@ -40,7 +40,7 @@ export declare class DependencyGraph {
|
|
|
40
40
|
createGraph(target?: string): void;
|
|
41
41
|
addNode(id: string, type: string, x: number, y: number, nodeData: NodeCustomData): void;
|
|
42
42
|
addEdge(id: string, source: string, target: string, type?: Edge): void;
|
|
43
|
-
run(targetGraph: any, target: string
|
|
43
|
+
run(targetGraph: any, target: string, type: string, id?: string, depth?: number, maxDepth?: number): void;
|
|
44
44
|
identify(): string;
|
|
45
45
|
calculateDepth(target?: string, visited?: Set<string>): number;
|
|
46
46
|
}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
export * from './graph';
|
|
2
2
|
export declare const setLocalStorage: (key: string, value: any) => void;
|
|
3
|
-
export declare const getLocalStorage: (key: string) => string
|
|
3
|
+
export declare const getLocalStorage: (key: string) => string;
|
|
4
4
|
export declare const removeLocalStorage: (key: string) => void;
|
|
5
5
|
export declare const mergeLocalStorage: (target: string, key: string, value: any) => void;
|
|
6
6
|
export declare const removeLocalStorageKey: (target: string, key: string) => void;
|
|
7
7
|
export declare const isObject: (target: any) => boolean;
|
|
8
8
|
export declare const reloadPage: () => void;
|
|
9
9
|
export declare const validateCustom: (schema: string) => boolean;
|
|
10
|
-
export declare const getUnpkgUrl: (pkg: string, version: string) => string
|
|
10
|
+
export declare const getUnpkgUrl: (pkg: string, version: string) => string;
|
|
11
11
|
export declare const definePropertyGlobalVal: (target: Record<string, any>, key: string, val: any) => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@module-federation/devtools",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.7.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -42,13 +42,13 @@
|
|
|
42
42
|
"ahooks": "3.7.10",
|
|
43
43
|
"dagre": "0.8.5",
|
|
44
44
|
"reactflow": "11.11.4",
|
|
45
|
-
"echarts": "6.
|
|
45
|
+
"echarts": "6.1.0",
|
|
46
46
|
"lucide-react": "0.364.0",
|
|
47
47
|
"echarts-for-react": "3.0.5",
|
|
48
48
|
"i18next": "23.0.0",
|
|
49
49
|
"react-i18next": "15.0.0",
|
|
50
|
-
"@module-federation/
|
|
51
|
-
"@module-federation/
|
|
50
|
+
"@module-federation/observability-plugin": "2.5.3",
|
|
51
|
+
"@module-federation/sdk": "2.7.0"
|
|
52
52
|
},
|
|
53
53
|
"peerDependencies": {
|
|
54
54
|
"react": "^18 || ^19",
|
|
@@ -74,16 +74,15 @@
|
|
|
74
74
|
"@playwright/test": "1.57.0",
|
|
75
75
|
"@types/chrome": "^0.0.272",
|
|
76
76
|
"@types/dagre": "^0.7.52",
|
|
77
|
-
"@types/jest": "~29.2.4",
|
|
78
77
|
"@types/node": "^20.19.5",
|
|
79
78
|
"@types/react": "^19.2.2",
|
|
80
79
|
"@types/react-dom": "^19.2.2",
|
|
81
80
|
"lint-staged": "~13.1.0",
|
|
82
81
|
"prettier": "~3.3.3",
|
|
83
|
-
"typescript": "
|
|
82
|
+
"typescript": "6.0.3",
|
|
84
83
|
"rimraf": "~6.0.1",
|
|
85
84
|
"vitest": "1.2.2",
|
|
86
|
-
"@module-federation/runtime": "2.
|
|
85
|
+
"@module-federation/runtime": "2.7.0"
|
|
87
86
|
},
|
|
88
87
|
"scripts": {
|
|
89
88
|
"build:storybook": "storybook build",
|
|
@@ -95,7 +94,7 @@
|
|
|
95
94
|
"build:debug": "DEBUG=true modern-app build && node postpack.js",
|
|
96
95
|
"build:lib": "rm -rf dist && modern-module build -c modern.lib.config.ts",
|
|
97
96
|
"release": "npm publish --tag canary",
|
|
98
|
-
"test": "
|
|
97
|
+
"test": "rstest",
|
|
99
98
|
"test:e2e": "node ../../scripts/ensure-playwright.js && E2ETEST=true pnpm build:devtool && playwright test",
|
|
100
99
|
"test:e2e:ui": "node ../../scripts/ensure-playwright.js && E2ETEST=true pnpm build:devtool && playwright test --ui",
|
|
101
100
|
"start": "modern-app start",
|