将类Grid导入到测试文件中,但继续得到未定义的错误。
导入路径是正确的,但是当我运行Jest时,在控制台中继续出现“ TypeError:无法读取未定义的属性'grid'”和“无法读取未定义的属性'instance'”。
Grid.test.js
import React from 'react';
import {shallow} from 'enzyme';
import Grid from '../../components/Grid';
let grid;
describe('Grid', () => {
beforeEach(() => {
grid = shallow(<Grid/>);
});
it('renders correctly', () => {
expect(grid).toMatchSnapshot();
});
describe('splitUpTiles', () => {
it('returns an empty array if a.length === 0', () => {
expect(grid.instance().splitUpTiles([0,1], 0)).toEqual([]);
});
});
});
Grid.js:
import React, { Component } from 'react';
import Tile from './Tile';
class Grid extends Component {
splitUpTiles = (a, l) => {
if (a.length === 0) return [];
else return [a.slice(0, l)].concat(this.splitUpTiles(a.slice(l), l));
};
(omitted code for brevity)
render() {
(omitted code for brevity)
return (
<div>
<table>
<tbody>
{this.createColumns(arrayOfTiles)}
</tbody>
</table>
</div>
)
}
}
export default Grid;
我以相同的方式测试了其他文件,但没有错误。有人可以解释我要去哪里了吗?
答案 0 :(得分:0)
我认为这是因为嵌套描述。您可以像下面这样尝试将内部it
放在describe
上方吗?
import React from 'react';
import {shallow} from 'enzyme';
import Grid from '../../components/Grid';
describe('Grid', () => {
let grid;
beforeEach(() => {
grid = shallow(<Grid/>);
});
it('renders correctly', () => {
expect(grid).toMatchSnapshot();
});
it('returns an empty array if a.length === 0', () => {
expect(grid.instance().splitUpTiles([0,1], 0)).toEqual([]);
});
});
答案 1 :(得分:0)
我认为您的 beforeEach 有一个范围问题。
根据文档:
“默认情况下,before和after块适用于文件中的每个测试。您也可以使用describe块将测试分组在一起。当它们位于describe块中时, before和after块仅适用于描述区块中的测试”。
尝试一下:
describe('Grid', () => {
let grid; // Move your var inside describe
beforeEach(() => {
grid = shallow(<Grid/>);
});
it('renders correctly', () => {
expect(grid).toMatchSnapshot();
});
// Delete second describe block
it('returns an empty array if a.length === 0', () => {
expect(grid.instance().splitUpTiles([0,1], 0)).toEqual([]);
});
});
检查文档HERE