今天遇到了一个奇怪的问题。用vscode拓展运行Jest和直接npx run jest的结果不同。

0x00 问题

直接用npm运行jest得到的snapshot：

<span class="ant-typography">
  发布时间：
  2022/9/27 10:50:02
</span>
<br />
<span class="ant-typography">
  截止时间：
  2222/9/27 10:50:02
</span>

但是，通过vscode拓展运行Jest得到的结果如下：

HomeworkCard > renders HomeworkCard
-----
Error: expect(received).toMatchSnapshot()

Snapshot name: `HomeworkCard renders HomeworkCard 1`

- Snapshot  - 2
+ Received  + 2

@@ -30,18 +30,18 @@
        <span
          class="ant-typography"
        >
          发布时间：
-         2022/9/27 10:50:02
+         9/27/2022, 10:50:02 AM
        </span>
        <br />
        <span
          class="ant-typography"
        >
          截止时间：
-         2222/9/27 10:50:02
+         9/27/2222, 10:50:02 AM
        </span>

很明显，不同之处在于日期的格式。

0x01 解决

`full-icu`

在Google上使用toLocaleString、Jest关键词搜索后，除了一些mock方案，就是full-icu这个包。根据描述，Node默认并未提供英语之外语言的国际化，而这个包可以便利地引入。对于jest来说，具体的方案是这样：

npm i -D full-icu
在package.json的test script部分加上环境变量，例如NODE_ICU_DATA=node_modules/full-icu jest
（可选）对于Windows用户，还可能需要安装cross-env这个包，然后把cross-env 加到上述的script前面。

不过，实际上从Node.js 13开始，full ICU已经成为了默认设置，无需手动配置。可以通过如下命令来检查ICU data的类型：

$ node -p 'process.config.variables.icu_small'
true

如果结果为false，则说明无需手动配置full ICU。我使用的是node@16，问题不在这里。

`vscode-jest`配置

刚才似乎忽略了一点，就是这个问题只在vscode中发生。会不会是拓展的配置有问题呢？

因为是本地化结果出了问题，而我的vscode显示语言设置为英语，我便猜想是不是vscode-jest读取到的locale有问题。尝试将vscode语言改为中文，发现并没有什么用。

不过，在翻设置的过程中，我发现可以配置Jest使用的node环境变量。那么，能否通过配置node-env来改变本地化结果呢？这次，尝试在setting.json中添加如下配置：

"jest.nodeEnv": {
    "LANG": "zh-cn"
}

再次通过vscode运行Jest，问题解决。

0x00 问题

0x01 解决

full-icu

vscode-jest配置

`full-icu`

`vscode-jest`配置