diff --git a/package.json b/package.json index 1e251b10..645ff358 100644 --- a/package.json +++ b/package.json @@ -13,13 +13,13 @@ "release:build": "babel-node scripts/release/build_release.js", "release:verifyBuild": "babel-node scripts/release/verify_build.js", "release:publish": "babel-node scripts/release/publish_release.js", - "lint": "eslint src --ext .js,.jsx --ignore-pattern '*.spec.js'", + "lint": "eslint src --ext .js,.jsx,.ts,.tsx --ignore-pattern '*.spec.js'", "lint:fix": "npm run lint -- --fix", "test:lint": "npm run lint -- --quiet", "start": "webpack --progress --watch --config webpack.config.js", "styleguide": "styleguidist server", "styleguide:build": "styleguidist build && node scripts/moveBuildAssets.js", - "test:watch": "npm test -- --watch --bail", + "test:watch": "jest --watch --bail", "test": "jest --silent && npm run test:lint", "test:ci": "jest --silent --maxWorkers=2 && npm run test:lint", "test:generate-coverage-report": "codecov" @@ -64,20 +64,21 @@ "babel-loader": "^8.0.0", "codecov": "^3.1.0", "coveralls": "^3.0.2", - "enzyme": "^3.3.0", - "enzyme-adapter-react-16": "^1.1.1", - "enzyme-to-json": "^3.3.3", + "enzyme": "^3.10.0", + "enzyme-adapter-react-16": "^1.14.0", + "enzyme-to-json": "^3.4.0", "eslint": "5.16.0", "eslint-import-resolver-webpack": "0.11.0", "fs-extra": "^5.0.0", "glob": "7.1.4", "jest": "^24.8.0", + "jest-emotion": "10.0.14", "prettier": "1.16.4", "prompt": "^1.0.0", "react": "16.4.2", "react-dom": "16.4.2", "react-styleguidist": "9.0.9", - "react-test-renderer": "^16.2.0", + "react-test-renderer": "16.4.2", "react-transition-group": "^2.2.1", "sinon": "^2.3.8", "typescript": "^3.2.2", @@ -112,6 +113,7 @@ "transform": { "^.+\\.js$": "babel-jest" }, + "snapshotSerializers": ["jest-emotion"], "coverageDirectory": "./coverage/", "testURL": "http://localhost", "collectCoverage": true, diff --git a/src/components/Buttons/__tests__/Button.spec.js b/src/components/Buttons/__tests__/Button.spec.js index 737d5fc6..3a732a74 100644 --- a/src/components/Buttons/__tests__/Button.spec.js +++ b/src/components/Buttons/__tests__/Button.spec.js @@ -1,6 +1,5 @@ import React from 'react' import renderer from 'react-test-renderer' -import { StyleRoot } from 'radium' import { mount } from 'enzyme' import { spy } from 'sinon' import Icon from '../../Icon/Icon' @@ -16,13 +15,7 @@ describe('Button', () => { ] testCases.forEach(props => { - const tree = renderer - .create( - - - - ) - .toJSON() + const tree = renderer.create().toJSON() expect(tree).toMatchSnapshot() }) }) @@ -36,13 +29,7 @@ describe('Button', () => { ] testCases.forEach(props => { - const tree = renderer - .create( - - - - ) - .toJSON() + const tree = renderer.create().toJSON() expect(tree).toMatchSnapshot() }) }) @@ -50,11 +37,9 @@ describe('Button', () => { it('renders with inverted colors', () => { const tree = renderer .create( - - - + ) .toJSON() expect(tree).toMatchSnapshot() @@ -69,13 +54,7 @@ describe('Button', () => { ] testCases.forEach(props => { - const tree = renderer - .create( - - - - ) - .toJSON() + const tree = renderer.create().toJSON() expect(tree).toMatchSnapshot() }) }) @@ -83,11 +62,9 @@ describe('Button', () => { it('applies the elementAttributes prop correctly', () => { const tree = renderer .create( - - - + ) .toJSON() expect(tree).toMatchSnapshot() @@ -96,13 +73,11 @@ describe('Button', () => { it('fires the onClick prop', () => { const onClick = spy() const wrapper = mount( - -
- -
-
+
+ +
) wrapper.find('button').simulate('click') @@ -113,11 +88,9 @@ describe('Button', () => { it('renders correctly when disabled', () => { const tree = renderer .create( - - - + ) .toJSON() expect(tree).toMatchSnapshot() @@ -126,11 +99,9 @@ describe('Button', () => { it('does not fire the onClick prop when disabled', () => { const onClick = spy() const wrapper = mount( - - - + ) wrapper.find('button').simulate('click') @@ -140,11 +111,9 @@ describe('Button', () => { it('can render as a link if an href is provided', () => { const tree = renderer.create( - - - + ) expect(tree).toMatchSnapshot() }) diff --git a/src/components/Buttons/__tests__/CircleButton.spec.js b/src/components/Buttons/__tests__/CircleButton.spec.js index 7c5029e3..0b7da9eb 100644 --- a/src/components/Buttons/__tests__/CircleButton.spec.js +++ b/src/components/Buttons/__tests__/CircleButton.spec.js @@ -1,6 +1,5 @@ import React from 'react' import renderer from 'react-test-renderer' -import { StyleRoot } from 'radium' import { mount } from 'enzyme' import { spy } from 'sinon' import Icon from '../../Icon/Icon' @@ -9,11 +8,9 @@ import CircleButton from '../CircleButton' it('renders basic CircleButton correctly', () => { const tree = renderer .create( - -
- 1 -
-
+
+ 1 +
) .toJSON() expect(tree).toMatchSnapshot() @@ -22,13 +19,11 @@ it('renders basic CircleButton correctly', () => { it('renders CircleButton with Icon correctly', () => { const tree = renderer .create( - -
- - - -
-
+
+ + + +
) .toJSON() expect(tree).toMatchSnapshot() @@ -37,19 +32,17 @@ it('renders CircleButton with Icon correctly', () => { it('renders CircleButton with passed style prop correctly', () => { const tree = renderer .create( - -
- - 1 - -
-
+
+ + 1 + +
) .toJSON() expect(tree).toMatchSnapshot() @@ -58,11 +51,9 @@ it('renders CircleButton with passed style prop correctly', () => { it('renders CircleButton with passed ariaLabel correctly', () => { const tree = renderer .create( - -
- 1 -
-
+
+ 1 +
) .toJSON() expect(tree).toMatchSnapshot() @@ -71,11 +62,9 @@ it('renders CircleButton with passed ariaLabel correctly', () => { it('renders CircleButton with passed disabled prop correctly', () => { const tree = renderer .create( - -
- 1 -
-
+
+ 1 +
) .toJSON() expect(tree).toMatchSnapshot() @@ -84,11 +73,9 @@ it('renders CircleButton with passed disabled prop correctly', () => { it('calls onClick callback correctly', () => { const onClick = spy() const CButton = mount( - -
- 1 -
-
+
+ 1 +
) const button = CButton.find('button').first() @@ -99,13 +86,11 @@ it('calls onClick callback correctly', () => { it('does not call onClick when disabled prop is true', () => { const onClick = spy() const CButton = mount( - -
- - 1 - -
-
+
+ + 1 + +
) const button = CButton.find('button').first() diff --git a/src/components/Buttons/__tests__/__snapshots__/Button.spec.js.snap b/src/components/Buttons/__tests__/__snapshots__/Button.spec.js.snap index 45e80ad3..7fb9652f 100644 --- a/src/components/Buttons/__tests__/__snapshots__/Button.spec.js.snap +++ b/src/components/Buttons/__tests__/__snapshots__/Button.spec.js.snap @@ -1,979 +1,1048 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Button applies the elementAttributes prop correctly 1`] = ` -
- -