-
Notifications
You must be signed in to change notification settings - Fork 469
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[tests] Remove enzyme from QualityMetrics tests #1684
Changes from 6 commits
a12cdf7
751f6f9
f760b9d
74c2c7e
9034cef
52364d0
92bae04
ccc7d43
f370b16
f3be9d9
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -13,32 +13,38 @@ | |
// limitations under the License. | ||
|
||
import React from 'react'; | ||
import { shallow } from 'enzyme'; | ||
|
||
import { render } from '@testing-library/react'; | ||
import '@testing-library/jest-dom'; | ||
import BannerText from './BannerText'; | ||
|
||
describe('BannerText', () => { | ||
it('renders null when props.bannerText is falsy', () => { | ||
expect(shallow(<BannerText />).type()).toBe(null); | ||
const { container } = render(<BannerText />); | ||
expect(container.firstChild).toBe(null); | ||
}); | ||
|
||
it('renders header when props.bannerText is a string', () => { | ||
expect(shallow(<BannerText bannerText="foo text" />)).toMatchSnapshot(); | ||
const { getByText } = render(<BannerText bannerText="foo text" />); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. You can use most of these functions using the render(<BannerText bannerText="foo text" />);
expect(screen.getByText('foo text')).toBeInTheDocument(); Same goes for other such usages as well |
||
const headerElement = getByText('foo text'); | ||
expect(headerElement).toBeInTheDocument(); | ||
}); | ||
|
||
it('renders styled header when props.bannerText is a styled value', () => { | ||
expect( | ||
shallow( | ||
<BannerText | ||
bannerText={{ | ||
styling: { | ||
background: 'red', | ||
color: 'white', | ||
}, | ||
value: 'foo text', | ||
}} | ||
/> | ||
) | ||
).toMatchSnapshot(); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Snapshots need to be purged for this too. Otherwise, the tests would pass, but CI will fail. |
||
const { getByText } = render( | ||
<BannerText | ||
bannerText={{ | ||
styling: { | ||
background: 'red', | ||
color: 'white', | ||
}, | ||
value: 'foo text', | ||
}} | ||
/> | ||
); | ||
|
||
const headerElement = getByText('foo text'); | ||
|
||
expect(headerElement).toBeInTheDocument(); | ||
expect(headerElement).toHaveStyle('background: red; color: white;'); | ||
}); | ||
}); |
Original file line number | Diff line number | Diff line change | ||||
---|---|---|---|---|---|---|
|
@@ -13,24 +13,40 @@ | |||||
// limitations under the License. | ||||||
|
||||||
import React from 'react'; | ||||||
import { shallow } from 'enzyme'; | ||||||
|
||||||
import { render } from '@testing-library/react'; | ||||||
import '@testing-library/jest-dom'; | ||||||
import CountCard from './CountCard'; | ||||||
|
||||||
describe('CountCard', () => { | ||||||
const count = 108; | ||||||
const title = 'Test Title'; | ||||||
const examples = ['Examples']; | ||||||
|
||||||
it('renders null when props.count or props.title is absent', () => { | ||||||
expect(shallow(<CountCard count={count} />).type()).toBe(null); | ||||||
expect(shallow(<CountCard title={title} />).type()).toBe(null); | ||||||
const { container: containerWithoutCount } = render(<CountCard count={count} />); | ||||||
yurishkuro marked this conversation as resolved.
Show resolved
Hide resolved
|
||||||
expect(containerWithoutCount.firstChild).toBe(null); | ||||||
const { container: containerWithoutTitle } = render(<CountCard title={title} />); | ||||||
expect(containerWithoutTitle.firstChild).toBe(null); | ||||||
}); | ||||||
|
||||||
it('renders as expected when given count and title', () => { | ||||||
expect(shallow(<CountCard count={count} title={title} />)).toMatchSnapshot(); | ||||||
const { getByText } = render(<CountCard count={count} title={title} />); | ||||||
const countElement = getByText('108'); | ||||||
const titleElement = getByText('Test Title'); | ||||||
|
||||||
expect(countElement).toBeInTheDocument(); | ||||||
expect(titleElement).toBeInTheDocument(); | ||||||
}); | ||||||
|
||||||
it('renders as expected when given count, title, and examples', () => { | ||||||
expect(shallow(<CountCard count={count} title={title} examples={['foo']} />)).toMatchSnapshot(); | ||||||
const { getByText } = render(<CountCard count={count} title={title} examples={examples} />); | ||||||
|
||||||
const countElement = getByText('108'); | ||||||
const titleElement = getByText('Test Title'); | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. simplify
Suggested change
this makes the test easier to read There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Got it |
||||||
const exampleElement = getByText('Examples'); | ||||||
expect(exampleElement).toBeInTheDocument(); | ||||||
|
||||||
expect(countElement).toBeInTheDocument(); | ||||||
expect(titleElement).toBeInTheDocument(); | ||||||
}); | ||||||
}); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Since
toMatchSnapshot()
is no longer used, the snapshots created for this test needs to be purged.You can use the command
yarn test --updateSnapshot
for that.