Javascript 如何在一些单元测试中模拟loadable.lib使库同步加载？

现在，我们通过

loadable.lib

对大约20个新文件使用延迟加载，这些文件用于同步加载npm模块

的response to astify

。更改正在草稿PR中等待，但单元测试似乎已中断，因为它们不等待加载

loadable.lib

传递的模块

预期结果 能够模拟

loadable.lib

，使其工作方式与之前完全相同，但同步加载给定的库。在单元测试中，这被视为

loadable.lib

结果组件的子组件可以访问该库，并且第一次渲染会成功完成此操作

实际结果 旧快照（满是标签、嵌套的东西和道具）和新快照（

null

）不匹配。这些方法不起作用：

//TODO:不工作，因为在许多地方都使用了loadable
//孩子们并不总是能够避免撞车，
//即使只有孩子，也可能发生车祸
jest.mock（'@loadable/component'，（loadfn）=>({
lib:jest.fn（（）=>{
返回{toast:{}；
}),
}));

如果可以模拟

loadable.lib

函数来呈现其子函数，而不是等待某个库被加载，我不知道如何填充代码使用的未定义变量，因为我有使用loadables的loadables，也有使用loadables的loadables等等

我读过一些网页提示，比如

webpackPrefetch

和

webpackPreload

，但我不确定这是否是一条好的道路

我尝试过的相关链接

我正在处理的代码（还有19个类似的文件）：（我目前正在通过

loadable.lib

始终加载

react to astify

）

-我试图做类似于那篇文章中的代码的事情，但它不起作用：

jest.mock('@loadable/component', (load) => {
  return {
    lib: () => {
      let Component;
      const loadPromise = load().then((val) => (Component = val.default));
      const Loadable = (props) => {
        if (!Component) {
          throw new Error(
            'Bundle split module not loaded yet, ensure you beforeAll(() => MyLazyComponent.load()) in your test, import statement: ' +
              load.toString(),
          );
        }
        return <Component {...props} />;
      };
      Loadable.load = () => loadPromise;
      return Loadable;
    },
  };
});

jest.mock（'@loadable/component'，async（loadfn）=>{
const val=等待加载fn（）；
返回{
lib:（）=>val，
};
});

一点代码 摘自，这是我目前使用react toastify（名为

LoadableToast

）的方式：

/**
*渲染方法。
*@methodrender
*@返回组件的{string}标记。
*/
render（）{
返回(
{（{default:toast}）=>{
this.toast=吐司；
返回(
{
返回{
lib:（）=>{
let组件；
const loadPromise=load（）。然后（（val）=>（Component=val.default））；
常量可加载=（道具）=>{
如果（！组件）{
抛出新错误(
'尚未加载捆绑包拆分模块，请确保在测试、导入语句中所有（（）=>MyLazyComponent.load（））之前都已加载。'+
load.toString（），
);
}
返回；
};
Loadable.load=（）=>loadPromise；
返回可装载；
},
};
});

我们是通过

jest.mock（'@loadable/component'，（）=>({
lib:（）=>{
const MegadraftEditor=（）=>{}//导入的名称
return（{children}）=>children（{default:{MegadraftEditor}}）
},
}))

jest.mock('@loadable/component', (load) => {
  return {
    lib: () => {
      let Component;
      const loadPromise = load().then((val) => (Component = val.default));
      const Loadable = (props) => {
        if (!Component) {
          throw new Error(
            'Bundle split module not loaded yet, ensure you beforeAll(() => MyLazyComponent.load()) in your test, import statement: ' +
              load.toString(),
          );
        }
        return <Component {...props} />;
      };
      Loadable.load = () => loadPromise;
      return Loadable;
    },
  };
});