diff --git a/test/components/BackgroundDimmer.test.js b/test/components/BackgroundDimmer.test.js index d7e474903..97f02a0b6 100644 --- a/test/components/BackgroundDimmer.test.js +++ b/test/components/BackgroundDimmer.test.js @@ -1,15 +1,9 @@ import React from 'react'; import renderer from 'react-test-renderer'; -// Because of this bug: https://github.com/facebook/react/issues/7386 -// Should be fixed in react 15.4 -// import { shallow } from 'enzyme'; +import { shallow } from 'enzyme'; import BackgroundDimmer from '../../src/background-dimmer'; -// Because of this bug: https://github.com/facebook/react/issues/7386 -// Should be fixed in react 15.4 -jest.mock('react-dom'); - const content =
content
; describe('BackgroundDimmer', () => { @@ -23,11 +17,9 @@ describe('BackgroundDimmer', () => { expect(component).toMatchSnapshot(); }); - // Ignored because of this bug: https://github.com/facebook/react/issues/7386 - // Should be fixed in react 15.4 - xit('invokes the callback when the background is clicked', () => { + it('invokes the callback when the background is clicked', () => { const onClickOutside = jest.fn(); - const dimmer = shallow( // eslint-disable-line no-undef + const dimmer = shallow( {content} @@ -36,11 +28,9 @@ describe('BackgroundDimmer', () => { expect(onClickOutside).toBeCalled(); }); - // Ignored because of this bug: https://github.com/facebook/react/issues/7386 - // Should be fixed in react 15.4 - xit('doesn\'t invoke the callback when the content is clicked', () => { + it('doesn\'t invoke the callback when the content is clicked', () => { const onClickOutside = jest.fn(); - const dimmer = shallow( // eslint-disable-line no-undef + const dimmer = shallow( {content} diff --git a/test/components/Dropdown.test.js b/test/components/Dropdown.test.js index 84860fb99..d510b485f 100644 --- a/test/components/Dropdown.test.js +++ b/test/components/Dropdown.test.js @@ -3,10 +3,6 @@ import renderer from 'react-test-renderer'; import Dropdown from '../../src/dropdown'; -// Because of this bug: https://github.com/facebook/react/issues/7386 -// Should be fixed in react 15.4 -jest.mock('react-dom'); - const exampleProps = { ...Dropdown.defaultProps, id: '12345', diff --git a/test/components/LoadingSpinner.test.js b/test/components/LoadingSpinner.test.js index c6063d028..da4e5c265 100644 --- a/test/components/LoadingSpinner.test.js +++ b/test/components/LoadingSpinner.test.js @@ -1,29 +1,43 @@ import React from 'react'; -// import renderer from 'react-test-renderer'; -import { shallow } from 'enzyme'; - -// Because of this bug: https://github.com/facebook/react/issues/7386 -// Should be fixed in react 15.4 -// jest.mock('react-dom'); +import { shallow, mount } from 'enzyme'; import LoadingSpinner from '../../src/loading-spinner'; describe('LoadingSpinner', () => { - // disabled because react-dome is mocked out, see above - xit('renders correctly', () => { - const component = renderer.create( // eslint-disable-line no-undef - + it('renders correctly', () => { + const component = mount( +
+ +
+ ); + expect(component.html()).toMatchSnapshot(); + }); + + it('renders correctly with a message', () => { + const component = mount( +
+ +
); - expect(component).toMatchSnapshot(); + expect(component.html()).toMatchSnapshot(); }); - // disabled because react-dome is mocked out, see above - xit('renders correctly with a message', () => { - const component = renderer.create( // eslint-disable-line no-undef - + it('renders with a warning when parent is not relative or absolute', () => { + /* eslint-disable no-console */ + const warn = jest.fn(); + const originalWarn = console.warn; + console.warn = warn; + mount( +
+ +
); - expect(component).toMatchSnapshot(); + expect(warn).toHaveBeenCalledTimes(1); + const warnArguments = warn.mock.calls[0]; + expect(warnArguments[0]).toMatchSnapshot(); + console.warn = originalWarn; + /* eslint-enable no-console */ }); it('computes message content and style', () => { diff --git a/test/components/Menu.test.js b/test/components/Menu.test.js index 5d5897ec6..8f09a1cbb 100644 --- a/test/components/Menu.test.js +++ b/test/components/Menu.test.js @@ -1,5 +1,4 @@ import React from 'react'; -// import renderer from 'react-test-renderer'; import { mount } from 'enzyme'; import { Menu } from '../../src/DropdownMenu'; @@ -12,14 +11,11 @@ const exampleProps = { describe('Menu', () => { - // ignored because react-test-renderer cannot co-exist with enzyme - // because of this bug: https://github.com/facebook/react/issues/7386 - // Should be fixed in react 15.4 - xit('renders correctly', () => { - const component = renderer.create( // eslint-disable-line no-undef + it('renders correctly', () => { + const component = mount( ); - expect(component).toMatchSnapshot(); + expect(component.html()).toMatchSnapshot(); }); it('triggers onClick only on options that are not disabled', () => { diff --git a/test/components/StatefulButton.test.js b/test/components/StatefulButton.test.js index 49cf160d6..05fca8fdc 100644 --- a/test/components/StatefulButton.test.js +++ b/test/components/StatefulButton.test.js @@ -1,13 +1,9 @@ import React from 'react'; -import renderer from 'react-test-renderer'; +import { mount } from 'enzyme'; import StatefulButton from '../../src/button/StatefulButton'; import clone from 'lodash/clone'; -// Because of this bug: https://github.com/facebook/react/issues/7386 -// Should be fixed in react 15.4 -jest.mock('react-dom'); - function timeoutPromise(millis) { return new Promise((resolve) => { setTimeout(resolve, millis); @@ -38,13 +34,11 @@ function mkComponent(overrides) { describe('StatefulButton', () => { - // ignored because react-dom is mocked (see above) - // which is used by TextOverflow (used by Button, used by StatefulButton) - xit('renders correctly', () => { - const component = renderer.create( + it('renders correctly', () => { + const component = mount( ); - expect(component).toMatchSnapshot(); + expect(component.html()).toMatchSnapshot(); }); it('behaves correctly in base state', () => { diff --git a/test/components/TimePicker.test.js b/test/components/TimePicker.test.js index bf3cbb9fd..35b0fb6c2 100644 --- a/test/components/TimePicker.test.js +++ b/test/components/TimePicker.test.js @@ -1,14 +1,10 @@ import React from 'react'; -import renderer from 'react-test-renderer'; +import { mount } from 'enzyme'; import TimePicker, { parseInTimeFormat, H24, H12, toOption, filterTime, createTimeList, makeOptions, inputError } from '../../src/time-picker/TimePicker'; -// Because of this bug: https://github.com/facebook/react/issues/7386 -// Should be fixed in react 15.4 -jest.mock('react-dom'); - const exampleProps = { ...TimePicker.defaultProps, id: '12345', @@ -26,13 +22,11 @@ const timePicker = new TimePicker(exampleProps); describe('TimePicker', () => { - // ignored because react-dom is mocked (see above) - // it causes problem with AutosizeInput when using refs - xit('renders correctly', () => { - const component = renderer.create( + it('renders correctly', () => { + const component = mount( ); - expect(component).toMatchSnapshot(); + expect(component.html()).toMatchSnapshot(); }); describe('getLocals', () => { diff --git a/test/components/__snapshots__/LoadingSpinner.test.js.snap b/test/components/__snapshots__/LoadingSpinner.test.js.snap new file mode 100644 index 000000000..47991331e --- /dev/null +++ b/test/components/__snapshots__/LoadingSpinner.test.js.snap @@ -0,0 +1,5 @@ +exports[`LoadingSpinner renders correctly 1`] = `"
"`; + +exports[`LoadingSpinner renders correctly with a message 1`] = `"
"`; + +exports[`LoadingSpinner renders with a warning when parent is not relative or absolute 1`] = `"LoadingSpinner\'s parent node style should have \"position: relative\" or \"position: absolute\""`; diff --git a/test/components/__snapshots__/Menu.test.js.snap b/test/components/__snapshots__/Menu.test.js.snap new file mode 100644 index 000000000..7f02b6ca9 --- /dev/null +++ b/test/components/__snapshots__/Menu.test.js.snap @@ -0,0 +1 @@ +exports[`Menu renders correctly 1`] = `"
Preferences
Preferences
"`; diff --git a/test/components/__snapshots__/StatefulButton.test.js.snap b/test/components/__snapshots__/StatefulButton.test.js.snap new file mode 100644 index 000000000..6a4f24b46 --- /dev/null +++ b/test/components/__snapshots__/StatefulButton.test.js.snap @@ -0,0 +1 @@ +exports[`StatefulButton renders correctly 1`] = `"
BeautifulButton
BeautifulButton
"`; diff --git a/test/components/__snapshots__/TimePicker.test.js.snap b/test/components/__snapshots__/TimePicker.test.js.snap new file mode 100644 index 000000000..f85fef14b --- /dev/null +++ b/test/components/__snapshots__/TimePicker.test.js.snap @@ -0,0 +1 @@ +exports[`TimePicker renders correctly 1`] = `"
06:30
"`;