Skip to content

Commit fbd06ee

Browse files
jquenseljharb
authored andcommitted
[New] mount/shallow: .name(): call into adapter’s displayNameOfNode, if present
1 parent 59f8c57 commit fbd06ee

File tree

4 files changed

+184
-121
lines changed

4 files changed

+184
-121
lines changed

packages/enzyme-test-suite/test/ReactWrapper-spec.jsx

Lines changed: 87 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,17 @@ import React from 'react';
33
import PropTypes from 'prop-types';
44
import { expect } from 'chai';
55
import sinon from 'sinon';
6+
import wrap from 'mocha-wrap';
67
import {
78
mount,
89
render,
910
ReactWrapper,
1011
} from 'enzyme';
11-
import { ITERATOR_SYMBOL, sym } from 'enzyme/build/Utils';
12+
import {
13+
ITERATOR_SYMBOL,
14+
sym,
15+
getAdapter,
16+
} from 'enzyme/build/Utils';
1217

1318
import './_helpers/setupAdapters';
1419
import { createClass, createContext, createPortal } from './_helpers/react-compat';
@@ -3992,88 +3997,111 @@ describeWithDOM('mount', () => {
39923997
});
39933998
});
39943999

3995-
describe('.name()', () => {
3996-
describe('node with displayName', () => {
3997-
it('should return the displayName of the node', () => {
3998-
class Foo extends React.Component {
3999-
render() { return <div />; }
4000-
}
4001-
4002-
Foo.displayName = 'CustomWrapper';
4003-
4004-
const wrapper = mount(<Foo />);
4005-
expect(wrapper.name()).to.equal('CustomWrapper');
4006-
});
4007-
4008-
describeIf(is('> 0.13'), 'stateless function components', () => {
4009-
it('should return the name of the node', () => {
4010-
function SFC() {
4011-
return <div />;
4000+
wrap()
4001+
.withOverride(() => getAdapter(), 'displayNameOfNode', () => undefined)
4002+
.describe('.name()', () => {
4003+
describe('node with displayName', () => {
4004+
it('should return the displayName of the node', () => {
4005+
class Foo extends React.Component {
4006+
render() { return <div />; }
40124007
}
40134008

4014-
SFC.displayName = 'CustomWrapper';
4009+
Foo.displayName = 'CustomWrapper';
40154010

4016-
const wrapper = mount(<SFC />);
4011+
const wrapper = mount(<Foo />);
40174012
expect(wrapper.name()).to.equal('CustomWrapper');
40184013
});
4019-
});
40204014

4021-
describe('createClass', () => {
4022-
it('should return the name of the node', () => {
4023-
const Foo = createClass({
4024-
displayName: 'CustomWrapper',
4025-
render() {
4015+
describeIf(is('> 0.13'), 'stateless function components', () => {
4016+
it('should return the name of the node', () => {
4017+
function SFC() {
40264018
return <div />;
4027-
},
4028-
});
4019+
}
40294020

4030-
const wrapper = mount(<Foo />);
4031-
expect(wrapper.name()).to.equal('CustomWrapper');
4021+
SFC.displayName = 'CustomWrapper';
4022+
4023+
const wrapper = mount(<SFC />);
4024+
expect(wrapper.name()).to.equal('CustomWrapper');
4025+
});
40324026
});
4033-
});
4034-
});
40354027

4036-
describe('node without displayName', () => {
4037-
it('should return the name of the node', () => {
4038-
class Foo extends React.Component {
4039-
render() { return <div />; }
4040-
}
4028+
describe('createClass', () => {
4029+
it('should return the name of the node', () => {
4030+
const Foo = createClass({
4031+
displayName: 'CustomWrapper',
4032+
render() {
4033+
return <div />;
4034+
},
4035+
});
4036+
4037+
const wrapper = mount(<Foo />);
4038+
expect(wrapper.name()).to.equal('CustomWrapper');
4039+
});
4040+
});
40414041

4042-
const wrapper = mount(<Foo />);
4043-
expect(wrapper.name()).to.equal('Foo');
4042+
wrap()
4043+
.withOverride(() => getAdapter(), 'displayNameOfNode', () => sinon.stub())
4044+
.describe('adapter has `displayNameOfNode`', () => {
4045+
it('delegates to the adapter’s `displayNameOfNode`', () => {
4046+
class Foo extends React.Component {
4047+
render() { return <div />; }
4048+
}
4049+
const stub = getAdapter().displayNameOfNode;
4050+
const sentinel = {};
4051+
stub.returns(sentinel);
4052+
4053+
const wrapper = mount(<Foo />);
4054+
4055+
expect(wrapper.name()).to.equal(sentinel);
4056+
4057+
expect(stub).to.have.property('callCount', 1);
4058+
const { args } = stub.firstCall;
4059+
expect(args).to.eql([wrapper.getNodeInternal()]);
4060+
});
4061+
});
40444062
});
40454063

4046-
describeIf(is('> 0.13'), 'stateless function components', () => {
4064+
describe('node without displayName', () => {
40474065
it('should return the name of the node', () => {
4048-
function SFC() {
4049-
return <div />;
4066+
class Foo extends React.Component {
4067+
render() { return <div />; }
40504068
}
40514069

4052-
const wrapper = mount(<SFC />);
4053-
expect(wrapper.name()).to.equal('SFC');
4070+
const wrapper = mount(<Foo />);
4071+
expect(wrapper.name()).to.equal('Foo');
4072+
});
4073+
4074+
describeIf(is('> 0.13'), 'stateless function components', () => {
4075+
it('should return the name of the node', () => {
4076+
function SFC() {
4077+
return <div />;
4078+
}
4079+
4080+
const wrapper = mount(<SFC />);
4081+
expect(wrapper.name()).to.equal('SFC');
4082+
});
40544083
});
40554084
});
4056-
});
40574085

4058-
describe('DOM node', () => {
4059-
it('should return the name of the node', () => {
4060-
const wrapper = mount(<div />);
4061-
expect(wrapper.name()).to.equal('div');
4086+
describe('DOM node', () => {
4087+
it('should return the name of the node', () => {
4088+
const wrapper = mount(<div />);
4089+
expect(wrapper.name()).to.equal('div');
4090+
});
40624091
});
4063-
});
40644092

4065-
describe('.ref()', () => {
4066-
it('unavailable ref should return undefined', () => {
4067-
class WithoutRef extends React.Component {
4068-
render() { return <div />; }
4069-
}
4070-
const wrapper = mount(<WithoutRef />);
4071-
const ref = wrapper.ref('not-a-ref');
4093+
describe('.ref()', () => {
4094+
it('unavailable ref should return undefined', () => {
4095+
class WithoutRef extends React.Component {
4096+
render() { return <div />; }
4097+
}
4098+
const wrapper = mount(<WithoutRef />);
4099+
const ref = wrapper.ref('not-a-ref');
40724100

4073-
expect(ref).to.equal(undefined);
4101+
expect(ref).to.equal(undefined);
4102+
});
40744103
});
40754104
});
4076-
});
40774105

40784106
describeIf(ITERATOR_SYMBOL, '@@iterator', () => {
40794107
it('should be iterable', () => {

packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx

Lines changed: 89 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,19 @@ import React from 'react';
22
import PropTypes from 'prop-types';
33
import { expect } from 'chai';
44
import sinon from 'sinon';
5+
import wrap from 'mocha-wrap';
56
import {
67
shallow,
78
render,
89
ShallowWrapper,
910
mount,
1011
} from 'enzyme';
11-
import { ITERATOR_SYMBOL, withSetStateAllowed, sym } from 'enzyme/build/Utils';
12+
import {
13+
ITERATOR_SYMBOL,
14+
withSetStateAllowed,
15+
sym,
16+
getAdapter,
17+
} from 'enzyme/build/Utils';
1218

1319
import './_helpers/setupAdapters';
1420
import { createClass, createContext } from './_helpers/react-compat';
@@ -4855,91 +4861,114 @@ describe('shallow', () => {
48554861
});
48564862
});
48574863

4858-
describe('.name()', () => {
4859-
describe('node with displayName', () => {
4860-
it('should return the displayName of the node', () => {
4861-
class Foo extends React.Component {
4862-
render() { return <div />; }
4863-
}
4864-
4865-
class Wrapper extends React.Component {
4866-
render() { return <Foo />; }
4867-
}
4868-
4869-
Foo.displayName = 'CustomWrapper';
4870-
4871-
const wrapper = shallow(<Wrapper />);
4872-
expect(wrapper.name()).to.equal('CustomWrapper');
4873-
});
4864+
wrap()
4865+
.withOverride(() => getAdapter(), 'displayNameOfNode', () => undefined)
4866+
.describe('.name()', () => {
4867+
describe('node with displayName', () => {
4868+
it('should return the displayName of the node', () => {
4869+
class Foo extends React.Component {
4870+
render() { return <div />; }
4871+
}
48744872

4875-
describeIf(is('> 0.13'), 'stateless function components', () => {
4876-
it('should return the name of the node', () => {
4877-
function SFC() {
4878-
return <div />;
4873+
class Wrapper extends React.Component {
4874+
render() { return <Foo />; }
48794875
}
4880-
const Wrapper = () => <SFC />;
48814876

4882-
SFC.displayName = 'CustomWrapper';
4877+
Foo.displayName = 'CustomWrapper';
48834878

48844879
const wrapper = shallow(<Wrapper />);
48854880
expect(wrapper.name()).to.equal('CustomWrapper');
48864881
});
4887-
});
48884882

4889-
describe('createClass', () => {
4890-
it('should return the name of the node', () => {
4891-
const Foo = createClass({
4892-
displayName: 'CustomWrapper',
4893-
render() {
4883+
describeIf(is('> 0.13'), 'stateless function components', () => {
4884+
it('should return the name of the node', () => {
4885+
function SFC() {
48944886
return <div />;
4895-
},
4896-
});
4897-
const Wrapper = createClass({
4898-
render() {
4899-
return <Foo />;
4900-
},
4887+
}
4888+
const Wrapper = () => <SFC />;
4889+
4890+
SFC.displayName = 'CustomWrapper';
4891+
4892+
const wrapper = shallow(<Wrapper />);
4893+
expect(wrapper.name()).to.equal('CustomWrapper');
49014894
});
4895+
});
49024896

4903-
const wrapper = shallow(<Wrapper />);
4904-
expect(wrapper.name()).to.equal('CustomWrapper');
4897+
describe('createClass', () => {
4898+
it('should return the name of the node', () => {
4899+
const Foo = createClass({
4900+
displayName: 'CustomWrapper',
4901+
render() {
4902+
return <div />;
4903+
},
4904+
});
4905+
const Wrapper = createClass({
4906+
render() {
4907+
return <Foo />;
4908+
},
4909+
});
4910+
4911+
const wrapper = shallow(<Wrapper />);
4912+
expect(wrapper.name()).to.equal('CustomWrapper');
4913+
});
49054914
});
4906-
});
4907-
});
49084915

4909-
describe('node without displayName', () => {
4910-
it('should return the name of the node', () => {
4911-
class Foo extends React.Component {
4912-
render() { return <div />; }
4913-
}
4916+
wrap()
4917+
.withOverride(() => getAdapter(), 'displayNameOfNode', () => sinon.stub())
4918+
.describe('adapter has `displayNameOfNode`', () => {
4919+
it('delegates to the adapter’s `displayNameOfNode`', () => {
4920+
class Foo extends React.Component {
4921+
render() { return <div />; }
4922+
}
4923+
const stub = getAdapter().displayNameOfNode;
4924+
const sentinel = {};
4925+
stub.returns(sentinel);
49144926

4915-
class Wrapper extends React.Component {
4916-
render() { return <Foo />; }
4917-
}
4927+
const wrapper = shallow(<Foo />);
4928+
4929+
expect(wrapper.name()).to.equal(sentinel);
49184930

4919-
const wrapper = shallow(<Wrapper />);
4920-
expect(wrapper.name()).to.equal('Foo');
4931+
expect(stub).to.have.property('callCount', 1);
4932+
const { args } = stub.firstCall;
4933+
expect(args).to.eql([wrapper.getNodeInternal()]);
4934+
});
4935+
});
49214936
});
49224937

4923-
describeIf(is('> 0.13'), 'stateless function components', () => {
4938+
describe('node without displayName', () => {
49244939
it('should return the name of the node', () => {
4925-
function SFC() {
4926-
return <div />;
4940+
class Foo extends React.Component {
4941+
render() { return <div />; }
4942+
}
4943+
4944+
class Wrapper extends React.Component {
4945+
render() { return <Foo />; }
49274946
}
4928-
const Wrapper = () => <SFC />;
49294947

49304948
const wrapper = shallow(<Wrapper />);
4931-
expect(wrapper.name()).to.equal('SFC');
4949+
expect(wrapper.name()).to.equal('Foo');
4950+
});
4951+
4952+
describeIf(is('> 0.13'), 'stateless function components', () => {
4953+
it('should return the name of the node', () => {
4954+
function SFC() {
4955+
return <div />;
4956+
}
4957+
const Wrapper = () => <SFC />;
4958+
4959+
const wrapper = shallow(<Wrapper />);
4960+
expect(wrapper.name()).to.equal('SFC');
4961+
});
49324962
});
49334963
});
4934-
});
49354964

4936-
describe('DOM node', () => {
4937-
it('should return the name of the node', () => {
4938-
const wrapper = shallow(<div />);
4939-
expect(wrapper.name()).to.equal('div');
4965+
describe('DOM node', () => {
4966+
it('should return the name of the node', () => {
4967+
const wrapper = shallow(<div />);
4968+
expect(wrapper.name()).to.equal('div');
4969+
});
49404970
});
49414971
});
4942-
});
49434972

49444973
describe('.dive()', () => {
49454974
class RendersDOM extends React.Component {

packages/enzyme/src/ReactWrapper.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -731,7 +731,10 @@ class ReactWrapper {
731731
* @returns {String}
732732
*/
733733
name() {
734-
return this.single('name', n => displayNameOfNode(n));
734+
const adapter = getAdapter(this[OPTIONS]);
735+
return this.single('name', n => (
736+
adapter.displayNameOfNode ? adapter.displayNameOfNode(n) : displayNameOfNode(n)
737+
));
735738
}
736739

737740
/**

0 commit comments

Comments
 (0)