标签: babel-jest

当我尝试包含所有项目源代码以获得更合理的代码覆盖率时,我最终得到了

----------|----------|----------|----------|----------|----------------|
File      |  % Stmts | % Branch |  % Funcs |  % Lines |Uncovered Lines |
----------|----------|----------|----------|----------|----------------|
All files |  Unknown |  Unknown |  Unknown |  Unknown |                |
----------|----------|----------|----------|----------|----------------|

我的配置包含以下内容:

"collectCoverageFrom": [
    "<rootDir>/app_modules/",
    "<rootDir>/src/"
],    

我也试过没有尾随/,**/*.js只有一个尾随*.js所有无济于事.

基于该--debug选项,路径扩展到我想要从中收集覆盖信息的路径(不是问题)

那么获得更准确的覆盖信息的魔力是什么？

我能找到的最好的文档来自这个Github PR:https: //github.com/facebook/jest/pull/1349/files

我最终做了:

"collectCoverageFrom": [
    "**/*.js",
    "!webpack.config.js"
],

这只是工作,因为这是默认配置的一部分

"testPathIgnorePatterns": [
    "/node_modules/"
],

它确实为测试运行增加了大量时间.

我使用 JEST 来测试我的应用程序。但是我从测试文件中得到一个错误——

import xyz from './XYZ.js';
    ^^^^^^
SyntaxError: Unexpected token import

然后我创建了一个 .babelrc 文件，它有以下代码——

{
  "presets": [
    "es2015"
  ]
}

在此之后，我在测试文件中导入的任何文件都不会引发此错误。但是，如果导入的文件之一（如 XYZ.js）本身具有 import 语句，那么它会在该文件上给出相同的错误。

我的 package.json devDependencies（重要的包）——

"devDependencies": {
    "babel-jest": "^19.0.0",
    "babel-preset-es2015": "^6.22.0",
    "eslint": "2.0.0",
    "eslint-plugin-react": "latest",
    "express": "^4.12.2",
    "jest": "^19.0.1",
    "react": "^15.3.2",
    "react-dom": "^15.3.2",
    "react-router": "^2.8.1"
  },

谁能指出我错过了什么？

对Vuejs而言是相对较新的，并且正在测试其组件。使用vue-test-utils和jest进行测试。获取以下错误 测试日志

.vue文件由模板，组件和样式组成。以下是SignupLayout.vue中出现错误的部分-

<style lang="sass">
@import '../stylesheets/colors'
html[path="/signup"], html[path="/login"]
  height: 100%
  background-image: url("../assets/background.jpg")
  background-size: cover
  background-position: center
  background-repeat: no-repeat
  overflow: hidden

  #signup-layout
    #change-language-button
      .lang-menu
        color: $alto

</style>

测试文件-

import Vue from 'vue';
import Vuex from 'vuex'
import SignupLayout from '../src/components/SignupLayout.vue';
import { mount, shallow, createLocalVue } from '@vue/test-utils';

const localVue = createLocalVue()

localVue.use(Vuex)

jest.resetModules()

describe('Signup.test.js', () => {
    let cmp
    let actions
    let store
    let getters
    let state

    beforeEach(() => {


        state = {
            email: 'abc@gmail.com'
        }
 
        getters = { …

我在从create-react-app在 Windows 8.1 上创建的干净安装的应用程序运行 Jest 时遇到问题。安装后，运行命令npm run test，我收到错误：

No tests found related to files changed since last commit.

Running jest --watchAll，因此绕过 react-scripts，在同一目录中，虽然，显示：

Test suite failed to run

Jest encountered an unexpected token

This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

Here's what you can do: …

在这个问我这个问题:

如果从另一个模块调用该模块,为什么变异模块会更新引用,但如果从自身调用则不会更新？

我在询问模块变异的本质.

然而事实证明,ES6模块实际上不能被变异 - 它们的所有属性都被视为常量.(见这个答案)

但不知何故 - 当Jest测试模块时 - 它们可以被改变,这就是Jest允许进行模拟的方式.

这是怎么回事？

我想这是一个正在运行的babel插件 - 将模块转换为CommonJS模块？有没有关于此的文件？

有没有办法查看转换后的代码？

我有一个 vue.js 应用程序，我使用以下指令安装了 Jest：

https://vue-test-utils.vuejs.org/guides/testing-single-file-components-with-jest.html。

当我运行npm test 时，出现错误。

? Test suite failed to run

TypeError: Cannot set property '_eventListeners' of undefined

  at Window.close (node_modules/jsdom/lib/jsdom/browser/Window.js:475:51)

我已经完成了文档中的所有内容，关于该应用程序的所有其他内容都很好，除了测试。请问，我该如何解决这个问题？

这是我的 package.json 配置文件：

{
  "name": "vendor",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "test": "jest"
  },
  "dependencies": {
    "babel-polyfill": "^6.26.0",
    "vue": "^2.5.22",
    "vue-router": "^3.0.2",
    "vuetify": "^1.3.0"
  },
  "devDependencies": {
    "vue-server-renderer": "^2.6.6",
    "babel-core": "^6.26.3",
    "@babel/core": "^7.2.2",
    "@babel/preset-env": "^7.3.1",
    "@vue/cli-plugin-babel": "^3.4.0",
    "@vue/cli-plugin-eslint": "^3.4.0",
    "@vue/cli-service": "^3.4.0",
    "@vue/server-test-utils": …

我正在尝试使用 jest 编写一个单元测试用例，并且需要模拟以下模式。我收到 TypeError: 不是构造函数。

用例：我的用例如下所述

我的组件.js：

 import serviceRegistry from "external/serviceRegistry";


        serviceRegistry.getService("modulename", "servvice").then(
              service => {
                let myServiceInstance = new service();
                myServiceInstance.init(p,d) 
        })

我的组件.spec.js

jest.mock('external/serviceRegistry', () => {
      return {
        getService: jest.fn(() => Promise.resolve({
          service: jest.fn().mockImplementation((properties, data, contribs) => {
            return {
              init: jest.fn(),
              util: jest.fn(),
              aspect: jest.fn()

            };
          })
        }))
      };
    }, {virtual: true});

在我的react native项目中，我最近安装了节点模块react-native-async-storage，因为我收到有关不赞成使用'react-native'并将其移至单个模块的本地包的警告。

安装后，@react-native-community/async-storage我的笑话测试失败了。

首先与以下 error: unexpected token at position 0

在文件中：

persistence.js

import AsyncStorage from '@react-native-community/async-storage';

storeData = async ({ key, value }) => {
  try {
    await AsyncStorage.setItem(key, value);
  } catch (error) {
    // Error saving data
  }
}

retrieveData = async (key) => {
  try {
    const value = await AsyncStorage.getItem(key);
    if (value !== null) {
      // Our data is fetched successfully
      return value;
    }
  } catch (error) {
    // Error retrieving data
  }
}

module.exports …

我正在为我的 Web 应用程序设置测试，该应用程序使用 Jest 框架与带有 TypeScript 的 Vue 框架配合使用。一切似乎都工作正常，除了@我导入中的符号，例如import { Foo } from '@/bar. 无论是在我的测试文件中还是在源代码中，它都无法理解并返回：

Cannot find module '@/store' from 'src/tests/foo.spec.ts'

这是我的 Jest 配置package.json：

  "jest": {
    "moduleFileExtensions": [
      "js",
      "ts",
      "json",
      "vue"
    ],
    "testRegex": "(/tests/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
    "transform": {
      ".*\\.(vue)$": "vue-jest",
      "^.+\\.tsx?$": "ts-jest",
      "^.+\\.jsx?$": "babel-jest"
    },
    "testURL": "http://localhost/",
    "collectCoverage": true,
    "collectCoverageFrom": ["**/*.{ts,vue}", "!**/node_modules/**"],
    "coverageReporters": ["html", "text-summary"]
  }

有人知道如何使其正常工作吗？

谢谢

我注意到当我们 jest.fn() 并将实现作为 .fn() 和 jest.fn().mockImplementation() 中的参数传递时，我们得到了相同的行为。如果是这样，选择合适只是一个品味问题吗？

例子：

jest.fn((num1, num2) => num1 + num2)
// same as 
jest.fn().mockImplementation((num1, num2) => num1 + num2)

有人有一些想法吗？