Last active
February 4, 2018 22:11
-
-
Save macku/2c06eac0fc3388ff86d5274c3419af80 to your computer and use it in GitHub Desktop.
Jest Puppe Shots example
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // https://github.com/macku/jest-puppe-shots | |
| const { mount } = require('jest-puppeshots'); | |
| // 1. Sync API | |
| test('should render <Foo> component', () => { | |
| const wrapper = mount( | |
| <MyComponent className="my-component"> | |
| <strong>Hello World!</strong> | |
| </MyComponent> | |
| ); | |
| expect(wrapper).toMatchScreenshot(); | |
| }); | |
| // 2. Pass viewport | |
| test('should render <Foo> component', () => { | |
| const wrapper = mount( | |
| <MyComponent className="my-component"> | |
| <strong>Hello World!</strong> | |
| </MyComponent> | |
| ); | |
| expect(wrapper).toMatchScreenshot({ // Pass viewport size | |
| width: 800, | |
| height: 600 | |
| }); | |
| }); | |
| // 3, Async API ? | |
| test('should render <Foo> component', async () => { | |
| const wrapper = await mount( | |
| <FooComponent> | |
| <BooComponent></BooComponent> | |
| </FooComponent> | |
| ); | |
| const children = await wrapper.find('.custom-class'); | |
| await children.simulate('click'); | |
| expect(children).toMatchScreenshot(); | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment