如何使用Jasmine测试带有Babel配置(用于库)的代码设置？ [英] How to test code setup with babel configuration(For Library) using Jasmine?

问题描述

大家好，

我苦苦挣扎了好几天，提出了几个问题herehere，我已将它们缩小到这个问题。

我有以下巴别塔配置：

{
    "presets": [
        [
            "@babel/env",
            {
                "modules": false,
            }
        ]
    ],
    "plugins": [
        [
            "@babel/plugin-transform-runtime", //target environment are not supported
             {
                 "corejs": 3,
                 "helpers": true,
                 "regenerator": true
             }
        ]
    ]
}

我还与webpack一起设置了Jasmine，我正在尝试测试我编写的一些模块。但问题出在Jasmine内部，他们设置了setTimeout的自定义定义，但我使用的Babel的配置包含了不会污染全球环境的多边形填充，这就是为什么我无法使用Jasmine提供的一些功能，每次我必须通过茉莉花测试时，我都必须使用window.Map(here)或window.setTimeout(here)

，这就是为什么我不能使用Jasmine提供的某些功能，而每次我必须通过茉莉花测试时，我都必须使用window.Map(here)或window.setTimeout(here)

我已提拔到茉莉花队here，有人给了我一个很有帮助的response。

我想知道在巴别塔中是否有任何方法可以帮助我测试我的模块。

如有任何建议，我们将不胜感激！

推荐答案

经过多天的努力，提出了多个问题，所有人都深入到了这个答案。(将尝试在此处添加我的所有研发)

首先，我使用下面的Babel配置作为创作库。使用Here

中的建议配置

{
    "presets": [
        [
            "@babel/env",
            {
                "modules": false,
            }
        ]
    ],
    "plugins": [
        [
            "@babel/plugin-transform-runtime", //target environment are not supported
             {
                 "corejs": 3,
                 "helpers": true,
                 "regenerator": true
             }
        ]
    ]
}

同时，我希望使用Jasmine+webpack测试我的模块。但问题是在Jasmine内部，他们设置了setTimeout的自定义定义以及用于测试Maps的Multiple Matcher实用程序，我正在使用的Babel的配置包含了不会污染全球环境的多边形填充。正因为如此，我无法使用Jasmine的多个功能，如Clock，Maps Equity using EqualsMatchers。实际上，Babel是在防止Jasmine实现、使测试脚本失败。详细信息Read Here

我联系了Babel团队解决了这个问题，想知道Babel是否有一些配置可以解决我的问题，在不影响我的生产捆绑包的同时，将我的问题在本地单元测试模块。

我联系了Babel团队，希望它能解决我在本地的单元测试模块的问题。

他们建议这不能通过@babel/plugin-change-time来实现 带有corejs选项。

操作步骤：

• 从@babel/plugin-change-run中删除corejs: 3选项
• 安装新的babel-plugin-polyfill-corejs3，它类似于Transform-Runtime的+corejs选项，但功能更强大。Documentation
• 如下配置您的巴别塔：

["polyfill-corejs3", {
  method: "usage-pure",
  exclude: ["web.timers"]
}]

注意：排除&qot；配置显示：

所有多边形填充提供程序都接受两个选项：包括和排除。它们是被视为目标不支持(包含)或被视为支持(排除)的多边形填充的字符串数组。

这个配置让我很开心，简单地说就是不为setTimeout和Map Constructor多填充，允许Jasmine设置全局定义并使所有测试用例成功运行。因此解决了我之前提出的问题herehere，而这个问题太😄了。

我将排除设置为：

"exclude": [
     "web.timers", //<--For setTimeout
     "es.map"   //For new Map()
]

最后，我希望仅为测试脚本设置所有此配置，这也可以使用Babel环境配置BABEL_ENV来实现，该配置将由BABEL配置文件读取。就像它们在那里的master分支中使用的一样。阅读Here和here

最终的巴别塔配置如下：

{
  "presets": [
    ["@babel/env", { "modules": false }]
  ],
  "plugins": [
    "@babel/transform-runtime",
    ["polyfill-corejs3", { "method": "usage-pure" }]
  ],
  "env": {
    "test": {
      "plugins": [
         ["polyfill-corejs3", {
           "method": "usage-pure",
           "exclude": ["web.timers"]
          }]
       ]
  }
}

Package.json中的测试脚本为：

"test": "BABEL_ENV=test npm run karma",

希望这对任何面临类似问题的人都有帮助。

这篇关于如何使用Jasmine测试带有Babel配置(用于库)的代码设置？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！