diff --git a/src/Alert.tsx b/src/Alert.tsx index 4c14e7a0bb..f138aa4178 100644 --- a/src/Alert.tsx +++ b/src/Alert.tsx @@ -77,8 +77,12 @@ const propTypes = { */ closeLabel: PropTypes.string, - /** A `react-transition-group` Transition component used to animate the Alert on dismissal. */ - transition: elementType, + /** + * Animate the alert dismissal. Defaults to using `` animation or use + * `false` to disable. A custom `react-transition-group` Transition can also + * be provided. + */ + transition: PropTypes.oneOfType([PropTypes.bool, elementType]), }; const defaultProps = { diff --git a/test/AlertSpec.js b/test/AlertSpec.js index 2160d5d366..ae4cf96a03 100644 --- a/test/AlertSpec.js +++ b/test/AlertSpec.js @@ -43,6 +43,28 @@ describe('', () => { ref.current.tagName.should.equal('DIV'); }); + it('should not have fade class when transition=false', () => { + const wrapper = mount(Message); + expect(wrapper.find('.fade').length).to.equal(0); + }); + + it('should use Fade when transition=true', () => { + mount( + + Message + , + ).assertSingle('.fade'); + }); + + it('should render null when transition and show are false', () => { + const wrapper = mount( + + Message + , + ); + expect(wrapper.isEmptyRender()).to.be.true; + }); + describe('Web Accessibility', () => { it('Should have alert role', () => { mount(Message).assertSingle('[role="alert"]');