fix(): load v3-widget-mate before load v3 widgets in v2 container

easyops-cn · Sep 21, 2023 · d2ea80c · d2ea80c
1 parent 8dfc547
commit d2ea80c
Show file tree

Hide file tree

Showing 2 changed files with 49 additions and 13 deletions.
diff --git a/packages/brick-kit/src/core/Kernel.spec.ts b/packages/brick-kit/src/core/Kernel.spec.ts
@@ -50,7 +50,9 @@ i18next.init({
 });
 
 jest.mock("@next-core/brick-utils");
-jest.mock("@next-core/loader");
+jest.mock("@next-core/loader", () => ({
+  loadBricksImperatively: jest.fn(() => Promise.resolve()),
+}));
 jest.mock("@next-sdk/auth-sdk");
 jest.mock("@next-sdk/user-service-sdk");
 jest.mock("@next-sdk/api-gateway-sdk");
@@ -247,7 +249,7 @@ describe("Kernel", () => {
       eager: {
         dll: ["ace.js"],
         deps: ["processors.js"],
-        v3Bricks: ["v3-widgets.my-widget"],
+        v3Bricks: ["v3-widgets.tpl-my-widget"],
       },
     });
     spyOnGetTemplateDepsOfStoryboard.mockReturnValueOnce(["layout.js"]);
@@ -300,20 +302,25 @@ describe("Kernel", () => {
       "app-a",
       true
     );
-    expect(loadBricksImperatively).toBeCalledTimes(1);
+    expect(loadBricksImperatively).toBeCalledTimes(2);
     expect(loadBricksImperatively).toHaveBeenNthCalledWith(
       1,
-      ["v3-widgets.my-widget"],
+      ["basic.v3-widget-mate"],
+      expect.any(Array)
+    );
+    expect(loadBricksImperatively).toHaveBeenNthCalledWith(
+      2,
+      ["v3-widgets.tpl-my-widget"],
       expect.any(Array)
     );
 
     await pendingTask;
     expect(loadLazyBricks).toBeCalledTimes(1);
     expect(loadLazyBricks).toBeCalledWith(["my-brick"]);
     expect(loadAllLazyBricks).not.toBeCalled();
-    expect(loadBricksImperatively).toBeCalledTimes(2);
+    expect(loadBricksImperatively).toBeCalledTimes(3);
     expect(loadBricksImperatively).toHaveBeenNthCalledWith(
-      2,
+      3,
       ["v3.my-brick"],
       expect.any(Array)
     );

diff --git a/packages/brick-kit/src/core/Kernel.ts b/packages/brick-kit/src/core/Kernel.ts
@@ -94,6 +94,8 @@ import { customTemplateRegistry } from "./CustomTemplates";
 import { getRuntimeMisc } from "../internal/misc";
 import { imagesFactory } from "../internal/images";
 
+const V3WidgetMates = ["basic.v3-widget-mate"];
+
 export class Kernel {
   public mountPoints: MountPoints;
   public bootstrapData: RuntimeBootstrapData;
@@ -731,6 +733,11 @@ export class Kernel {
       await loadScriptOfDll(eager.dll);
       await loadScriptOfBricksOrTemplates(eager.deps);
       if (eager.v3Bricks?.length) {
+        await catchLoad(
+          loadBricksImperatively(V3WidgetMates, brickPackages as any),
+          "brick",
+          V3WidgetMates[0]
+        );
         await loadBricksImperatively(eager.v3Bricks, brickPackages as any);
       }
       // 加载构件资源时，不再阻塞后续业务数据的加载，在挂载构件时再等待该任务完成。
@@ -846,15 +853,26 @@ export class Kernel {
       },
       this.bootstrapData.brickPackages
     );
+
+    const loadV3Bricks = async (): Promise<void> => {
+      if (v3Bricks?.some((brick) => brick.includes(".tpl-"))) {
+        await catchLoad(
+          loadBricksImperatively(V3WidgetMates, brickPackages as any),
+          "brick",
+          V3WidgetMates[0]
+        );
+      }
+      await Promise.all([
+        v3Bricks?.length &&
+          loadBricksImperatively(v3Bricks, brickPackages as any),
+        v3Processors?.length &&
+          loadProcessorsImperatively(v3Processors, brickPackages as any),
+      ]);
+    };
+
     await loadScriptOfDll(dll);
     await loadScriptOfBricksOrTemplates(deps);
-    await Promise.all([
-      loadLazyBricks(filteredBricks),
-      v3Bricks?.length &&
-        loadBricksImperatively(v3Bricks, brickPackages as any),
-      v3Processors?.length &&
-        loadProcessorsImperatively(v3Processors, brickPackages as any),
-    ]);
+    await Promise.all([loadLazyBricks(filteredBricks), loadV3Bricks()]);
   };
 
   loadDynamicBricks(bricks: string[], processors?: string[]): Promise<void> {
@@ -1187,3 +1205,14 @@ function generateColorTheme(theme: ThemeSetting): void {
     });
   }
 }
+
+function catchLoad(
+  promise: Promise<unknown>,
+  type: string,
+  name: string
+): Promise<unknown> {
+  return promise.catch((e) => {
+    // eslint-disable-next-line no-console
+    console.error(`Load ${type} "${name}" failed:`, e);
+  });
+}