Skip to content
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

Add test utils #9

Merged
merged 5 commits into from
Dec 11, 2017
Merged

Add test utils #9

merged 5 commits into from
Dec 11, 2017

Conversation

apiv
Copy link
Contributor

@apiv apiv commented Dec 5, 2017

Adds test utils which stub out all entities-wrapped components.

This is easily implemented in either jest or karma+webpack.

The new export has functions:

  • entities.mock(componentName: string, propsToProvide: {}) Whenever a component named componentName is encountered, it will be given the propsToProvide as props instead of wrapping with redux.
  • entities.stub is entityStub from the frontend app.
  • entities.reset resets the stubs.
  • entities is the fake HOC

This allows you to write tests like this:

MyComponent.js

import entities from 'entities'

const MyComponent = () => /* ... */

export default entities({ bucketResource: { type: 'bucket' } })(MyComponent)

MyOtherComponent

import MyComponent from './MyComponent'

const MyOtherComponent = () => {
  return (
    <MyComponent />
  )
}

export default MyOtherComponent

MyOtherComponent.spec.js

import MyOtherComponent from './MyOtherComponent'
jest.mock('entities')
import entities from 'api-entities'

describe('MyOtherComponent', () => {
  beforeEach(() => {
    entities.reset()
    // give all instances of MyComponent these props:
    const props = {
      bucketResource: entities.stub({
        items: f.createList('Bucket', 4)
      })
    }
    entities.mock(MyComponent, props)
  })

  it('renders', () => {
    const component = mount(MyOtherComponent)
    // wooh! it renders without any redux errors! (because redux is never being used!)
    expect(component.find('MyComponent').props).toMatchObject(props)
  })
})

@apiv
Copy link
Contributor Author

apiv commented Dec 5, 2017

In webpack+karma, we would alias entities/components/Entities to entities/test-utils/mockEntities

Copy link
Contributor

@mjniday mjniday left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks good

@Brantron
Copy link

Brantron commented Dec 6, 2017

It looks good to me, I wonder if the test suite will be noticeably faster?

@apiv
Copy link
Contributor Author

apiv commented Dec 7, 2017

This should include docs on usage.

@codecov-io
Copy link

Codecov Report

Merging #9 into master will increase coverage by 0.42%.
The diff coverage is 90.32%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master       #9      +/-   ##
==========================================
+ Coverage   83.03%   83.45%   +0.42%     
==========================================
  Files          17       18       +1     
  Lines         501      532      +31     
  Branches      150      167      +17     
==========================================
+ Hits          416      444      +28     
- Misses         71       73       +2     
- Partials       14       15       +1
Impacted Files Coverage Δ
src/test-utils/mockEntities.js 90.32% <90.32%> (ø)

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 55674dc...bb8f5df. Read the comment docs.

@apiv apiv merged commit 0ddb905 into master Dec 11, 2017
@apiv apiv deleted the feature/test-utils branch December 11, 2017 23:07
apiv added a commit that referenced this pull request Jan 10, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants