-
Notifications
You must be signed in to change notification settings - Fork 104
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(displayname): refactor memo wrapper on functional components
Add Readme for React Dev Tools
- Loading branch information
1 parent
52f3ff3
commit 414cf62
Showing
4 changed files
with
144 additions
and
66 deletions.
There are no files selected for viewing
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
This file was deleted.
Oops, something went wrong.
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,115 @@ | ||
/* eslint-disable react/forbid-foreign-prop-types */ | ||
/* eslint-disable no-multi-assign */ | ||
import React, { Component } from 'react'; | ||
import { render, cleanup } from '@testing-library/react/pure'; | ||
// eslint-disable-next-line import/no-unresolved | ||
import { view } from 'react-easy-state'; | ||
import PropTypes from 'prop-types'; | ||
|
||
describe('static props', () => { | ||
afterEach(cleanup); | ||
|
||
test('view() should proxy defaultProps for class components', () => { | ||
class MyCustomCompName extends Component { | ||
render() { | ||
return <div>{this.props.name}</div>; | ||
} | ||
} | ||
|
||
MyCustomCompName.defaultProps = { | ||
name: 'Bob', | ||
}; | ||
|
||
const WrappedComp = view(MyCustomCompName); | ||
const { container } = render(<WrappedComp />); | ||
expect(container).toHaveTextContent('Bob'); | ||
}); | ||
|
||
test('view() should proxy defaultProps for functional components', () => { | ||
const MyCustomCompName = props => { | ||
return <div>{props.name}</div>; | ||
}; | ||
|
||
MyCustomCompName.defaultProps = { | ||
name: 'Bob', | ||
}; | ||
|
||
const WrappedComp = view(MyCustomCompName); | ||
const { container } = render(<WrappedComp />); | ||
expect(container).toHaveTextContent('Bob'); | ||
}); | ||
|
||
test('view() should proxy propTypes for class components', () => { | ||
class MyCustomCompName extends Component { | ||
render() { | ||
return <div>{this.props.name}</div>; | ||
} | ||
} | ||
|
||
MyCustomCompName.propTypes = { | ||
name: PropTypes.string.isRequired, | ||
}; | ||
|
||
const ViewComp = view(MyCustomCompName); | ||
|
||
const errorSpy = jest | ||
.spyOn(console, 'error') | ||
.mockImplementation(message => | ||
expect(message.indexOf('Failed prop type')).not.toBe(-1), | ||
); | ||
render(<ViewComp number="Bob" />); | ||
expect(errorSpy).toHaveBeenCalled(); | ||
errorSpy.mockRestore(); | ||
}); | ||
|
||
test('view() should proxy propTypes for functional components', () => { | ||
const MyCustomCompName = props => { | ||
return <div>{props.number}</div>; | ||
}; | ||
|
||
MyCustomCompName.propTypes = { | ||
number: PropTypes.number.isRequired, | ||
}; | ||
|
||
const ViewComp = view(MyCustomCompName); | ||
|
||
const errorSpy = jest | ||
.spyOn(console, 'error') | ||
.mockImplementation(message => | ||
expect(message.indexOf('Failed prop type')).not.toBe(-1), | ||
); | ||
render(<ViewComp number="Bob" />); | ||
expect(errorSpy).toHaveBeenCalled(); | ||
errorSpy.mockRestore(); | ||
}); | ||
|
||
test('view() should proxy static methods', () => { | ||
class Comp extends Component { | ||
static getDerivedStateFromError() {} | ||
|
||
static customMethod() {} | ||
} | ||
|
||
const ViewComp = view(Comp); | ||
expect(ViewComp.getDerivedStateFromError).toBe( | ||
Comp.getDerivedStateFromError, | ||
); | ||
expect(ViewComp.customMethod).toBe(Comp.customMethod); | ||
}); | ||
|
||
test('view() should proxy static getters', () => { | ||
class Comp extends Component { | ||
static get defaultProp() { | ||
return { key: 'value' }; | ||
} | ||
|
||
static get customProp() { | ||
return { key: 'hello' }; | ||
} | ||
} | ||
|
||
const ViewComp = view(Comp); | ||
expect(ViewComp.defaultProps).toEqual(Comp.defaultProps); | ||
expect(ViewComp.customProp).toEqual(Comp.customProp); | ||
}); | ||
}); |
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