Jest快照不匹配 - Windows vs Unix/Linux Line Endings

Question

我们有一个由多个开发人员在多个操作系统上开发的项目.我们在更漂亮的配置中设置了120个字符的字符限制.我们的Windows机器正在生成与我们的linux/unix机器不同的快照.

视窗:

              <h4
                className="RightPanel__item--heading heading--headingBlocks
subHeading--headingBlocks subHeading--different"
              >

而在我们的linux/unix机器上,快照产生以下行:

              <h4
                className="RightPanel__item--heading heading--headingBlocks subHeading--headingBlocks subHeading--different"
              >

对于linux/unix快照,代码在第119列结束,而windows机器在最后几个属性之前生成一个新行.我们使用React,Jest for Testing,eslint for linting,Babel for transformation.

相关配置

1. babelrc:transform:{"^.+ \.jsx？$":"babel-jest"}
2. eslintrc:"globals":{"jest":true}
3. prettierrc:"printWidth":120
4. prettierignore:*.snap

项目

React,Babel,Webpack,vanilla es6 + no typescript项目,用于测试的开玩笑

研究

我们已经尝试设置eslint的"linebreak-style":["error","unix"]以查看eslint更改是否会更新修复Windows的jest快照无效.我们确保跨机器安装相同版本的游戏.与漂亮和eslint相同.

关于我们如何解决这个问题的任何建议,以便一个操作系统或另一个操作系统的测试不会失败？

Answer 1

我们在项目中使用快照序列化器来避免此类问题，它也应该对您的情况有所帮助。对于 html 快照，我推荐jest-serializer-html