Jest Tests for TypeScript Components

我们来看看怎么用Jest测试TypeScript组件。其实很简单，因为sfdx-lwc-jest这个测试运行器已经帮我们处理好了TypeScript的编译，所以你完全不用去改jest的配置文件。 你要做的就是，把你的测试文件写成以 .test.ts 结尾的文件，里面的结构和写JavaScript测试是一模一样的。不过，为了让编辑器能够识别Jest的那些全局变量，比如 describe、it、expect，还能给你自动补全和类型检查，你需要安装 @types/jest 作为开发依赖。 装好之后，再打开项目根目录的 tsconfig.json 文件，找到 types 这个数组，把 "jest" 加进去。这样TypeScript就知道这些测试全局变量了。 运行测试也很直接，就用我们常用的 npm run test:unit 命令就行。Jest在执行测试之前，会自动把TypeScript编译成JavaScript，所以整个过程是无缝的。 这里要特别提醒你一个TypeScript特有的问题，就是非空断言。你可能会习惯在访问 this.template 的时候用感叹号，因为你知道在 shadow DOM 模式下，它一定是存在的，所以写 this.template! 感觉很安全。但是，如果你启用了轻量级DOM模式，this.template 的值就是 null 了，这个时候再用非空断言，它会在运行时真的报错。所以记住，只有在你百分之百确定组件是 shadow DOM 渲染的时候，才可以用这种断言，否则就老老实实做判空处理，避免运行时出错。 简单总结一下：配置一次，写测试就和平常一样，跑起来也自动编译，但要注意 TypeScript 的断言陷阱，特别是跟渲染模式相关的。好，这一页就讲到这里。