1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
|
```javascript
npm install --save react-display-name
```
Get the displayName from a Component. This is a common pattern with React Higher Order Components (HoCs). This is a simple reusable utility to get the name of a component.
Usage:
```javascript
import {expect} from 'chai';
import React, {Component} from 'react';
import getDisplayName from 'react-display-name';
const container = (WrappedComponent) => {
class Container extends Component {
static displayName = `Container(${getDisplayName(WrappedComponent)})`;
render() {
return (
<WrappedComponent />
);
}
}
return Container;
}
class HelloWorld extends Component {
render() {
return (
<div>Hello</div>
);
}
}
const HelloWorldPrime = container(HelloWorld);
expect(getDisplayName(HelloWorldPrime)).to.equal('Container(HelloWorld)');
expect(HelloWorldPrime.displayName).to.equal('Container(HelloWorld)');
```
|
