Question

我已使用jest测试工具

运行此repo

package.json中的jest配置

"jest": {
    "moduleNameMapper": {
      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/reactTests/__mocks__/fileMock.js",
      "\\.(css|less)$": "<rootDir>/client/src/stylesheets/"
    },
    "testPathIgnorePatterns": [
      "<rootDir>/node_modules/",
      "<rootDir>/client/src/stylesheets/"
    ]
}

项目目录

.project
+-- client
|   +-- stylesheets
|   |      +-- style.css
|   |      +-- preloader.gif
+-- reactTests
|   +-- __mocks__
|   |      +-- fileMock.js

文件fileMock.js

module.exports = 'test-file-stub';

.babelrc

{
  "presets": [
    ["env", { "modules": false }],
    "es2015",
    "react",
    "stage-2"
  ],
  "plugins": ["transform-class-properties"]
}

测试文件为teamAmerica.test.js

import React from 'react';
import renderer from 'react-test-renderer';

/**
 *
 *
 * import sweetalert2 seems to report css error
 * remove all is well
 *
 *
 */

// import swa from 'sweetalert2';  
import { TeamAmerica } from './../../client/src/components/TeamAmerica';

// I had to copy paste the API json into this file to fix a bug
const team = {
  presidents: [
    {
      team: 'Presidents',
      team_id: '1',
      first_name: 'George',
      full_name: 'George Washington',
      last_name: 'Washington',
      role: 'First President of the United State of America.',
    },
    {
      team: 'Presidents',
      team_id: '2',
      first_name: 'Abraham',
      full_name: 'Abraham Lincoln',
      last_name: 'Lincoln',
      role: 'President during the Civil War.',
    },
    {
      team: 'Presidents',
      team_id: '3',
      first_name: 'Franklin D.',
      full_name: 'Franklin D. Roosevelt',
      last_name: 'Roosevelt',
      role: 'President during The Great Depression and WW2. Only president to be elected 4 times.',
    },
  ],
  client: [
    {
      team: 'US People',
      team_id: '2',
      first_name: 'Joe',
      full_name: 'Joe Sixpack',
      last_name: 'Sixpack',
      role: 'Average American',
    },
  ],
};

// I was getting an error that getTeam was not a function, so I had to turn it into a function in the test by doing this fat arrow
const getTeam = () => {};

// This is the actual test written for Jest
it('test to see if the team renders correctly', () => {
  const tree = renderer
  .create(<TeamAmerica getTeam={getTeam} team={[team.presidents]} />)
  .toJSON();
  expect(tree).toMatchSnapshot();
});

在测试文件中，我添加了导入swal来自'sweetalert2'如果删除此行并运行 npm run test ，错误将会消失，否则错误显示。< / p>

有人可以帮忙解决这个问题吗？

jest测试文件导入sweetalert2将报告css错误

0 个答案: