-
Notifications
You must be signed in to change notification settings - Fork 1.1k
Description
@testing-library/react
version: 9.5.0- Testing Framework and version: jest-dom 4.2.4
- DOM Environment: jsdom 14.1.0
Relevant code or config:
Navigation.js (Not working)
import React from "react";
export default function Navigation() {
return <div>Hello</div>;
}
Navigation.test.js
import React from 'react';
import { render } from '@testing-library/react';
import Navigation from './Navigation';
test('renders Navigation without a problem', () => {
const { getByText } = render(<Navigation />);
const linkElement = getByText(/Hello/i);
expect(linkElement).toBeInTheDocument();
});
Navigation.js (Working)
import React from "react";
export default function Navigation() {
const comp = <div>Hello</div>;
return comp;
}
What you did:
I just started testing the test-library and I created a very basic functional component like the one above. Then I ran the test file that comes with create-react-app (also given above). I should also add that I have also tried to generate a coverage report with npm test -- --coverage
. Only when I try to generate a coverage report this error is thrown.
What happened:
This error is thrown:
Navigation(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.
Reproduction:
I can create a repo if you need to but the only dependency I added was node-sass and mui-org/material-ui library and I haven't used them in this segment.
Problem description:
The weird thing is that if I give the component to be rendered via a variable it works. I'm guessing that this shouldn't be like this.