diff --git a/.travis.yml b/.travis.yml
index 296b0b76..3ae91266 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -2,6 +2,7 @@ language: node_js
os:
- linux
node_js:
+ - "9"
- "8"
- "7"
- "6"
@@ -18,7 +19,11 @@ script:
- 'if [ -n "${TEST-}" ]; then npm run tests-only ; fi'
sudo: false
env:
- - TEST=true
+ - TEST=true REACT=16
+ - TEST=true REACT=15
+ - TEST=true REACT=15.4
+ - TEST=true REACT=0.14
+ - TEST=true REACT=0.13
matrix:
fast_finish: true
include:
@@ -28,3 +33,7 @@ matrix:
- os: osx
- env: TEST=true ALLOW_FAILURE=true
- env: COVERAGE=true
+ - node_js: "9"
+ - node_js: "7"
+ - node_js: "5"
+ - env: TEST=true REACT=0.13
diff --git a/package.json b/package.json
index 7c381a77..b3baad1e 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,9 @@
"pretest": "npm run --silent lint",
"preversion": "npm run test && npm run check-changelog && npm run check-only-changelog-changed",
"tag": "git tag v$npm_package_version",
+ "react": "enzyme-adapter-react-install 15.4",
"test": "npm run tests-only",
+ "pretests-only": "npm run react",
"tests-only": "npm run mocha --silent test",
"version:major": "npm --no-git-tag-version version major",
"version:minor": "npm --no-git-tag-version version minor",
@@ -52,7 +54,7 @@
"babel-register": "^6.26.0",
"chai": "^4.1.2",
"enzyme": "^3.2.0",
- "enzyme-adapter-react-15.4": "^1.0.5",
+ "enzyme-adapter-react-helper": "^1.2.1",
"eslint": "^4.11.0",
"eslint-config-airbnb": "^16.1.0",
"eslint-plugin-import": "^2.8.0",
diff --git a/test/.eslintrc b/test/.eslintrc
index 506af945..aeca955e 100644
--- a/test/.eslintrc
+++ b/test/.eslintrc
@@ -4,8 +4,9 @@
},
"extends": "airbnb",
"rules": {
- "import/no-extraneous-dependencies": [2, {
- "devDependencies": true
- }]
+ "prefer-arrow-callback": 0,
+ "react/prefer-stateless-function": 0,
+ "react/no-multi-comp": 0,
+ "react/prop-types": 0,
}
}
diff --git a/test/_setup.js b/test/_setup.js
index 199147a0..20b4274b 100644
--- a/test/_setup.js
+++ b/test/_setup.js
@@ -1,4 +1,3 @@
-import Adapter from 'enzyme-adapter-react-15.4';
-import { configure } from 'enzyme';
+import configure from 'enzyme-adapter-react-helper';
-configure({ adapter: new Adapter() });
+configure();
diff --git a/test/withStyles_test.jsx b/test/withStyles_test.jsx
index 36357b18..35f30395 100644
--- a/test/withStyles_test.jsx
+++ b/test/withStyles_test.jsx
@@ -5,6 +5,8 @@ import { render, shallow } from 'enzyme';
import deepmerge from 'deepmerge';
import sinon from 'sinon-sandbox';
import DirectionProvider, { DIRECTIONS } from 'react-with-direction/dist/DirectionProvider';
+import ifReact from 'enzyme-adapter-react-helper/build/ifReact';
+import safeSFC from 'enzyme-adapter-react-helper/build/safeSFC';
import ThemedStyleSheet from '../src/ThemedStyleSheet';
import { css, cssNoRTL, withStyles, withStylesPropTypes } from '../src/withStyles';
@@ -59,7 +61,7 @@ describe('withStyles()', () => {
return null;
}
- const WrappedComponent = withStyles(() => ({}))(MyComponent);
+ const WrappedComponent = withStyles(() => ({}))(safeSFC(MyComponent));
shallow();
expect(testInterface.create.callCount).to.equal(1);
});
@@ -69,7 +71,7 @@ describe('withStyles()', () => {
return null;
}
- const result = withStyles(() => ({}))(MyComponent);
+ const result = withStyles(() => ({}))(safeSFC(MyComponent));
expect(result.displayName).to.equal('withStyles(MyComponent)');
});
@@ -79,7 +81,7 @@ describe('withStyles()', () => {
return null;
}
- const Wrapped = withStyles(() => ({}))(MyComponent);
+ const Wrapped = withStyles(() => ({}))(safeSFC(MyComponent));
shallow().dive();
});
@@ -89,7 +91,7 @@ describe('withStyles()', () => {
return null;
}
- const Wrapped = withStyles(() => ({}), { themePropName: 'foo' })(MyComponent);
+ const Wrapped = withStyles(() => ({}), { themePropName: 'foo' })(safeSFC(MyComponent));
shallow().dive();
});
@@ -103,7 +105,7 @@ describe('withStyles()', () => {
foo: {
color: color.red,
},
- }))(MyComponent);
+ }))(safeSFC(MyComponent));
shallow().dive();
});
@@ -113,7 +115,7 @@ describe('withStyles()', () => {
return null;
}
- const Wrapped = withStyles()(MyComponent);
+ const Wrapped = withStyles()(safeSFC(MyComponent));
shallow().dive();
});
@@ -127,7 +129,7 @@ describe('withStyles()', () => {
foo: {
color: '#ff0000',
},
- }), { stylesPropName: 'bar' })(MyComponent);
+ }), { stylesPropName: 'bar' })(safeSFC(MyComponent));
shallow().dive();
});
@@ -136,7 +138,7 @@ describe('withStyles()', () => {
return null;
}
- const Wrapped = withStyles(() => ({}))(MyComponent);
+ const Wrapped = withStyles(() => ({}))(safeSFC(MyComponent));
shallow();
expect(testInterface.flush.callCount).to.equal(0);
});
@@ -146,7 +148,7 @@ describe('withStyles()', () => {
return null;
}
- const Wrapped = withStyles(() => ({}), { flushBefore: true })(MyComponent);
+ const Wrapped = withStyles(() => ({}), { flushBefore: true })(safeSFC(MyComponent));
shallow();
expect(testInterface.flush.callCount).to.equal(1);
});
@@ -157,7 +159,7 @@ describe('withStyles()', () => {
}
MyComponent.foo = 'bar';
- const Wrapped = withStyles(() => ({}), { flushBefore: true })(MyComponent);
+ const Wrapped = withStyles(() => ({}), { flushBefore: true })(safeSFC(MyComponent));
expect(Wrapped.foo).to.equal('bar');
});
@@ -173,7 +175,7 @@ describe('withStyles()', () => {
foo: {
color: color.red,
},
- }))(MyComponent);
+ }))(safeSFC(MyComponent));
const wrapper = shallow().dive();
expect(wrapper.prop('style')).to.eql({ color: '#990000' });
@@ -197,7 +199,7 @@ describe('withStyles()', () => {
foo: {
color: color.red,
},
- }))(MyComponent);
+ }))(safeSFC(MyComponent));
// copied
const expectedPropTypes = deepmerge({}, MyComponent.propTypes);
@@ -218,19 +220,23 @@ describe('withStyles()', () => {
return null;
}
- const Wrapped = withStyles(() => ({}))(MyComponent);
- expect(Object.getPrototypeOf(Wrapped)).to.equal(React.Component);
- expect(Object.getPrototypeOf(Wrapped.prototype)).to.equal(React.Component.prototype);
- expect(Object.getPrototypeOf(Wrapped)).not.to.equal(React.PureComponent);
- expect(Object.getPrototypeOf(Wrapped.prototype)).not.to.equal(React.PureComponent.prototype);
+ const Wrapped = withStyles(() => ({}))(safeSFC(MyComponent));
+ const wrappedProto = Object.getPrototypeOf(Wrapped);
+ const wrappedProtoProto = Object.getPrototypeOf(Wrapped.prototype);
+ expect(wrappedProto).to.equal(React.Component);
+ expect(wrappedProtoProto).to.equal(React.Component.prototype);
+ if (React.PureComponent) {
+ expect(wrappedProto).not.to.equal(React.PureComponent);
+ expect(wrappedProtoProto).not.to.equal(React.PureComponent.prototype);
+ }
});
- it('with the pureComponent option set, extends React.PureComponent', () => {
+ ifReact('>= 15.3', it, it.skip)('with the pureComponent option set, extends React.PureComponent', () => {
function MyComponent() {
return null;
}
- const Wrapped = withStyles(() => ({}), { pureComponent: true })(MyComponent);
+ const Wrapped = withStyles(() => ({}), { pureComponent: true })(safeSFC(MyComponent));
expect(Object.getPrototypeOf(Wrapped)).not.to.equal(React.Component);
expect(Object.getPrototypeOf(Wrapped.prototype)).not.to.equal(React.Component.prototype);
expect(Object.getPrototypeOf(Wrapped)).to.equal(React.PureComponent);
@@ -240,18 +246,18 @@ describe('withStyles()', () => {
describe('css/cssNoRTL', () => {
it('css calls resolve method', () => {
- function MyComponent() {
+ const MyComponent = safeSFC(function MyComponent() {
return
;
- }
+ });
shallow();
expect(testInterfaceResolveStub.callCount).to.equal(1);
});
it('cssNoRTL calls resolve method if resolveNoRTL does not exist', () => {
- function MyComponent() {
+ const MyComponent = safeSFC(function MyComponent() {
return ;
- }
+ });
shallow();
expect(testInterfaceResolveStub.callCount).to.equal(1);
@@ -291,9 +297,9 @@ describe('RTL support', () => {
describe('css/cssNoRTL', () => {
it('css calls resolve method', () => {
- function MyComponent() {
+ const MyComponent = safeSFC(function MyComponent() {
return ;
- }
+ });
shallow();
expect(resolveStub.callCount).to.equal(1);
@@ -301,9 +307,9 @@ describe('RTL support', () => {
});
it('cssNoRTL calls resolve method if resolveNoRTL does not exist', () => {
- function MyComponent() {
+ const MyComponent = safeSFC(function MyComponent() {
return ;
- }
+ });
shallow();
expect(resolveStub.callCount).to.equal(0);
@@ -317,7 +323,7 @@ describe('RTL support', () => {
return null;
}
- const WrappedComponent = withStyles(() => ({}))(MyComponent);
+ const WrappedComponent = withStyles(() => ({}))(safeSFC(MyComponent));
render();
expect(testInterface.create).to.have.property('callCount', 1);
});
@@ -327,7 +333,7 @@ describe('RTL support', () => {
return null;
}
- const WrappedComponent = withStyles(() => ({}))(MyComponent);
+ const WrappedComponent = withStyles(() => ({}))(safeSFC(MyComponent));
render((
@@ -341,7 +347,7 @@ describe('RTL support', () => {
return null;
}
- const WrappedComponent = withStyles(() => ({}))(MyComponent);
+ const WrappedComponent = withStyles(() => ({}))(safeSFC(MyComponent));
render((