diff --git a/docs/api/ShallowWrapper/hasClass.md b/docs/api/ShallowWrapper/hasClass.md
index 4f61b9841..f22e45f0a 100644
--- a/docs/api/ShallowWrapper/hasClass.md
+++ b/docs/api/ShallowWrapper/hasClass.md
@@ -23,7 +23,7 @@ expect(wrapper.find('.my-button').hasClass('disabled')).to.equal(true);
```jsx
// Searching using RegExp works fine when classes were injected by a jss decorator
-const wrapper = mount();
+const wrapper = shallow();
expect(wrapper.find('.my-button').hasClass(/(ComponentName)-(other)-(\d+)/)).to.equal(true);
```
diff --git a/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx b/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx
index d029e0083..fa91fc33c 100644
--- a/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx
+++ b/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx
@@ -4663,7 +4663,7 @@ describeWithDOM('mount', () => {
});
describe('.hasClass(className)', () => {
- context('When using a DOM component', () => {
+ context('when using a DOM component', () => {
it('returns whether or not node has a certain class', () => {
const wrapper = mount(
);
@@ -4697,7 +4697,7 @@ describeWithDOM('mount', () => {
});
});
- context('When using a Composite class component', () => {
+ context('when using a Composite class component', () => {
it('returns whether or not node has a certain class', () => {
class Foo extends React.Component {
render() {
@@ -4722,7 +4722,7 @@ describeWithDOM('mount', () => {
});
});
- context('When using nested composite components', () => {
+ context('when using nested composite components', () => {
it('returns whether or not node has a certain class', () => {
class Foo extends React.Component {
render() {
@@ -4754,7 +4754,7 @@ describeWithDOM('mount', () => {
});
});
- context('When using a Composite component that renders null', () => {
+ context('when using a Composite component that renders null', () => {
it('returns whether or not node has a certain class', () => {
class Foo extends React.Component {
render() {
@@ -4773,8 +4773,30 @@ describeWithDOM('mount', () => {
return ;
}
}
- const wrapper = mount();
+ const obj = { classA: true, classB: false };
+ const wrapper = mount();
expect(wrapper.hasClass('foo')).to.equal(false);
+ expect(wrapper.hasClass('classA')).to.equal(false);
+ expect(wrapper.hasClass('classB')).to.equal(false);
+ expect(wrapper.hasClass(String(obj))).to.equal(true);
+ });
+
+ it('allows hyphens', () => {
+ const wrapper = mount();
+ expect(wrapper.hasClass('foo-bar')).to.equal(true);
+ });
+
+ it('works if className has a function in toString property', () => {
+ function classes() {}
+ classes.toString = () => 'foo-bar';
+ const wrapper = mount();
+ expect(wrapper.hasClass('foo-bar')).to.equal(true);
+ });
+
+ it('works if searching with a RegExp', () => {
+ const wrapper = mount();
+ expect(wrapper.hasClass(/(ComponentName)-(classname)-(\d+)/)).to.equal(true);
+ expect(wrapper.hasClass(/(ComponentName)-(other)-(\d+)/)).to.equal(false);
});
});
diff --git a/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx b/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx
index 245aa41f0..e66808fa1 100644
--- a/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx
+++ b/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx
@@ -4628,6 +4628,65 @@ describe('shallow', () => {
});
describe('.hasClass(className)', () => {
+ context('when using a DOM component', () => {
+ it('returns whether or not node has a certain class', () => {
+ const wrapper = shallow();
+
+ expect(wrapper.hasClass('foo')).to.equal(true);
+ expect(wrapper.hasClass('bar')).to.equal(true);
+ expect(wrapper.hasClass('baz')).to.equal(true);
+ expect(wrapper.hasClass('some-long-string')).to.equal(true);
+ expect(wrapper.hasClass('FoOo')).to.equal(true);
+ expect(wrapper.hasClass('doesnt-exist')).to.equal(false);
+ });
+ });
+
+ describeIf(is('> 0.13'), 'with stateless function components (SFCs)', () => {
+ it('returns whether or not node has a certain class', () => {
+ const Foo = () => ;
+ const wrapper = shallow();
+
+ expect(wrapper.hasClass('foo')).to.equal(false);
+ expect(wrapper.hasClass('bar')).to.equal(false);
+ expect(wrapper.hasClass('baz')).to.equal(false);
+ expect(wrapper.hasClass('some-long-string')).to.equal(false);
+ expect(wrapper.hasClass('FoOo')).to.equal(false);
+ expect(wrapper.hasClass('doesnt-exist')).to.equal(false);
+
+ expect(wrapper.children().hasClass('foo')).to.equal(true);
+ expect(wrapper.children().hasClass('bar')).to.equal(true);
+ expect(wrapper.children().hasClass('baz')).to.equal(true);
+ expect(wrapper.children().hasClass('some-long-string')).to.equal(true);
+ expect(wrapper.children().hasClass('FoOo')).to.equal(true);
+ expect(wrapper.children().hasClass('doesnt-exist')).to.equal(false);
+ });
+ });
+
+ context('when using a Composite class component', () => {
+ it('returns whether or not node has a certain class', () => {
+ class Foo extends React.Component {
+ render() {
+ return ();
+ }
+ }
+ const wrapper = shallow();
+
+ expect(wrapper.hasClass('foo')).to.equal(false);
+ expect(wrapper.hasClass('bar')).to.equal(false);
+ expect(wrapper.hasClass('baz')).to.equal(false);
+ expect(wrapper.hasClass('some-long-string')).to.equal(false);
+ expect(wrapper.hasClass('FoOo')).to.equal(false);
+ expect(wrapper.hasClass('doesnt-exist')).to.equal(false);
+
+ expect(wrapper.children().hasClass('foo')).to.equal(true);
+ expect(wrapper.children().hasClass('bar')).to.equal(true);
+ expect(wrapper.children().hasClass('baz')).to.equal(true);
+ expect(wrapper.children().hasClass('some-long-string')).to.equal(true);
+ expect(wrapper.children().hasClass('FoOo')).to.equal(true);
+ expect(wrapper.children().hasClass('doesnt-exist')).to.equal(false);
+ });
+ });
+
it('returns whether or not node has a certain class', () => {
const wrapper = shallow((
@@ -4641,14 +4700,49 @@ describe('shallow', () => {
expect(wrapper.hasClass('doesnt-exist')).to.equal(false);
});
+ context('when using a Composite component that renders null', () => {
+ it('returns whether or not node has a certain class', () => {
+ class Foo extends React.Component {
+ render() {
+ return null;
+ }
+ }
+ const wrapper = shallow();
+
+ expect(wrapper.hasClass('foo')).to.equal(false);
+ });
+ });
+
it('works with a non-string `className` prop', () => {
class Foo extends React.Component {
render() {
- return ;
+ return ;
}
}
- const wrapper = shallow();
+ const obj = { classA: true, classB: false };
+ const wrapper = shallow();
expect(wrapper.hasClass('foo')).to.equal(false);
+ expect(wrapper.hasClass('classA')).to.equal(false);
+ expect(wrapper.hasClass('classB')).to.equal(false);
+ expect(wrapper.hasClass(String(obj))).to.equal(true);
+ });
+
+ it('allows hyphens', () => {
+ const wrapper = shallow();
+ expect(wrapper.hasClass('foo-bar')).to.equal(true);
+ });
+
+ it('works if className has a function in toString property', () => {
+ function classes() {}
+ classes.toString = () => 'foo-bar';
+ const wrapper = shallow();
+ expect(wrapper.hasClass('foo-bar')).to.equal(true);
+ });
+
+ it('works if searching with a RegExp', () => {
+ const wrapper = shallow();
+ expect(wrapper.hasClass(/(ComponentName)-(classname)-(\d+)/)).to.equal(true);
+ expect(wrapper.hasClass(/(ComponentName)-(other)-(\d+)/)).to.equal(false);
});
});
diff --git a/packages/enzyme/src/ReactWrapper.js b/packages/enzyme/src/ReactWrapper.js
index d634200a9..4a2d60ed6 100644
--- a/packages/enzyme/src/ReactWrapper.js
+++ b/packages/enzyme/src/ReactWrapper.js
@@ -855,7 +855,7 @@ class ReactWrapper {
* @returns {Boolean}
*/
hasClass(className) {
- if (className && className.indexOf('.') !== -1) {
+ if (typeof className === 'string' && className.indexOf('.') !== -1) {
// eslint-disable-next-line no-console
console.warn('It looks like you\'re calling `ReactWrapper::hasClass()` with a CSS selector. hasClass() expects a class name, not a CSS selector.');
}
diff --git a/packages/enzyme/src/ShallowWrapper.js b/packages/enzyme/src/ShallowWrapper.js
index 7885e5d12..68fe38ffb 100644
--- a/packages/enzyme/src/ShallowWrapper.js
+++ b/packages/enzyme/src/ShallowWrapper.js
@@ -1253,7 +1253,7 @@ class ShallowWrapper {
* @returns {Boolean}
*/
hasClass(className) {
- if (className && className.indexOf('.') !== -1) {
+ if (typeof className === 'string' && className.indexOf('.') !== -1) {
// eslint-disable-next-line no-console
console.warn('It looks like you\'re calling `ShallowWrapper::hasClass()` with a CSS selector. hasClass() expects a class name, not a CSS selector.');
}