jest moduleNameMapper 映射路径疑問

如题,小弟我想使用JEST 做个单元测试
请教各位大佬

一开始在 test.ts 档案里面引用cc

回报错误 Cannot find module ‘cc’ from ‘test/add.test.ts’

找到这篇 在基于 jest 的测试代码中无法识别经过导入映射的路径 映射后尝试一下

我把 CocosDashboard_1.2.2\resources.editors\Creator\3.4.0\resources\resources\3d\engine 资料夹整包丢到专案 test 资料夹做映射

jest.config.js

module.exports = {
    preset: "ts-jest",         // 如果是 js 工程,则是 "jest" 
    testEnvironment: 'node',   // 测试代码所运行的环境
    rootDir: './',         // 测试文件所在的目录
    // verbose: true,          // 是否需要在测试时输出详细的测试情况
    // rootDir: "./test",         // 测试文件所在的目录
    globals: {                 // 全局属性。如果你的被测试的代码中有使用、定义全局变量,那你应该在这里定义全局属性
      window: {},
      cc: {}
    },
    moduleDirectories: ['<rootDir>', 'node_modules'],
    modulePaths: ['<rootDir>',],
    moduleFileExtensions: ['test.ts','js', 'json','node' ],
    moduleNameMapper: {
      "^db://(.*)" : ['<rootDir>/$1'],
      "cc": ['<rootDir>/test/engine/bin/.declarations/cc.d.ts']
    },
};
  

結果回報錯誤 變成一千多行
小弟只截錄一段

恳请熟悉的大大们给些指教或建议 感恩

附上测试专案
(engine 太大包,没法上传需要手动放)
https://github.com/aad61404/unit-test-creator3.4.0

补充. vscode 显示cc预设位置是在
C:\CocosDashboard_1.2.2\resources.editors\Creator\3.4.0\resources\resources\3d\engine\bin.declarations\cc.d.ts

小弟后来发现 我自己设定"cc" 映射路径
console出来的 cc 是空的 {} 里面没有东西
不知道如何取用 cc.d.ts 里面的module cc 有知道大大可以给些建议吗?
感激不尽

现在做项目的单元测试确实有点复杂。编辑器把引擎编译成了 SystemJS,需要异步加载。我这边之前做过尝试,就是用 jest 的 ES 模块支持,然后用 mock 来模拟引擎模块 cc。下面给出我自己项目的测试方法。我也好久没运行这个了。


安装依赖

npm install --save-dev jest ts-jest typescript

jest 配置

import ps from 'path';

export default {
    preset: 'ts-jest/presets/default-esm', // 重要
    testEnvironment: 'jsdom', // 需要;因为目前引擎依赖一点 DOM 环境
    testRegex: [String.raw`Test[\/\\].*\.(test|spec)?\.(ts|tsx)$`], // 这个路径看你自己的安排
    setupFiles: [
        './Test/TestSuite/Setup.ts', // 需要在这里做一些事情,见下
    ],
    moduleFileExtensions: ['ts', 'js', 'json', 'node', 'jsx'],
    globals: {
        CC_DEV: true,
        CC_TEST: true,
        ENGINE_LOCATION: String.raw`<你引擎仓库的位置>`, // 替换成你引擎的位置
        'ts-jest': {
            useESM: true, // 重要
            tsconfig: 'tsconfig.spec.json', // 这个可选了,看你安排
            /* Fails on mapped import syntax without this.*/
            diagnostics: false,
        },
    },
    moduleNameMapper: {
        '^cc$': '<rootDir>/Test/TestSuite/EngineModuleMocks/cc.ts', // 重要,文件内容见下
        '^cc/env$': '<rootDir>/Test/TestSuite/EngineModuleMocks/cc/env.ts', // 重要,文件内容见下
        '^(\\.{1,2}/.*)\\.js$': '$1', // 重要,见 https://kulshekhar.github.io/ts-jest/docs/guides/esm-support/
    },
};

Test/TestSuite/**

TestSuite.zip (1.4 KB)

1赞

感谢大大无私回覆
提供一个小发现是我本地creator 3.4.0 没有 loader.js
于是我到3.6.2 复制一个贴过去

再尝试mock 来模拟模块 cc后遇到了

    ReferenceError: await is not defined

      12 |     jest.unstable_mockModule(id, () => {
      13 |         return e;
    > 14 |     }, {
         | ^
      15 |         virtual: true,
      16 |     });
      17 | }

      at Object.<anonymous> (test/TestSuite/Setup.ts:14:1)


于是我进行了些调整



目前卡在处理

   SyntaxError: Cannot use 'import.meta' outside a module

再次感谢大大无私分享
偌大大有任何想法或觉得有错误的地方再请指教 :bowing_man:

程式码更新至连结
https://github.com/aad61404/unit-test-creator3.4.0

另一个问题 修改后未报错

 SyntaxError: await is only valid in async function


运行的时候加上 --experimental-vm-modules

node --experimental-vm-modules ./node_modules/.bin/jest.js

1赞

求问,最后可以用了吗

最后问题解决了吗,我现在卡在了

,在loader.js中加载了D:\apps\3.8.2\resources\resources\3d\engine\bin.cache\dev\editor\bundled\index.js,在调用过程中拿不到doucument对象