I'm learning TDD with React from this site, but don't understand how the author got describe
and it, aren't these usually from Jasmine? I don't see this package in the author's node_modules at his github nor does his tests.js
import anything that looks like describe
or it
. Where are these two methods coming from?
import React from 'react';
import { expect } from 'chai';
import { shallow, mount, render } from 'enzyme';
describe('Test suite for User component', () => {
it('UserComponent should exist', () => {
let wrapper = shallow(<User />)
expect(wrapper).to.exist;
});
});
If that is the only it()
statement that you are going to be using in your test suite, you do not really need the describe()
block.
The describe()
construct does indeed exist in Jest, it exists in Mocha as well.
The describe()
function is used to group together certain sets of tests that have some common setup and tear down for each of them. This is why I said, based on the code you pasted, if you have nothing further to test, you do not need that describe()
function.
So when you run create-react-app
one of the libraries that got loaded automatically was the Jest test suite.
I would also rewrite that test, instead of UserComponent should exist, I would do
it('shows a user component', () => {
let wrapper = shallow(<User />);
expect(wrapper.find(User).length).toEqual(1);
});
So this is where I recommend to not just follow tutorials, but look up the documentation of the tools they are having you utilize in these tutorials. In the case of Enzyme, there is a really nice method called find()
to find the component and it offers an array so you can add on .length
and since its just one component of User you can add at the end .toEqual(1);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With