Skip to content

Commit 4f413d4

Browse files
duncanbeeversljharb
authored andcommitted
[Tests] component detection: Add testing scaffolding
Test detection of Class Components and Stateless Function Components Lay scaffolding for other flavors of tests including further component types, pragma detection, and utils functions
1 parent 32f2e24 commit 4f413d4

File tree

2 files changed

+81
-0
lines changed

2 files changed

+81
-0
lines changed

CHANGELOG.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,9 @@ This change log adheres to standards from [Keep a CHANGELOG](http://keepachangel
77

88
### Changed
99
* [Refactor] [`no-arrow-function-lifecycle`], [`no-unused-class-component-methods`]: use report/messages convention (@ljharb)
10+
* [Tests] component detection: Add testing scaffolding ([#3149][] @duncanbeevers)
11+
12+
[#3149]: https://github.com/yannickcr/eslint-plugin-react/pull/3149
1013

1114
## [7.27.1] - 2021.11.18
1215

tests/util/Component.js

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
'use strict';
2+
3+
const assert = require('assert');
4+
const eslint = require('eslint');
5+
const Components = require('../../lib/util/Components');
6+
const parsers = require('../helpers/parsers');
7+
8+
const ruleTester = new eslint.RuleTester({
9+
parserOptions: {
10+
ecmaVersion: 2018,
11+
sourceType: 'module',
12+
ecmaFeatures: {
13+
jsx: true,
14+
},
15+
},
16+
});
17+
18+
describe('Components', () => {
19+
describe('static detect', () => {
20+
function testComponentsDetect(test, done) {
21+
const rule = Components.detect((context, components, util) => ({
22+
'Program:exit'() {
23+
done(context, components, util);
24+
},
25+
}));
26+
27+
const tests = {
28+
valid: parsers.all([Object.assign({}, test, {
29+
settings: {
30+
react: {
31+
version: 'detect',
32+
},
33+
},
34+
})]),
35+
invalid: [],
36+
};
37+
ruleTester.run(test.code, rule, tests);
38+
}
39+
40+
it('should detect Stateless Function Component', () => {
41+
testComponentsDetect({
42+
code: `import React from 'react'
43+
function MyStatelessComponent() {
44+
return <React.Fragment />;
45+
}`,
46+
}, (_context, components) => {
47+
assert.equal(components.length(), 1, 'MyStatelessComponent should be detected component');
48+
Object.values(components.list()).forEach((component) => {
49+
assert.equal(
50+
component.node.id.name,
51+
'MyStatelessComponent',
52+
'MyStatelessComponent should be detected component'
53+
);
54+
});
55+
});
56+
});
57+
58+
it('should detect Class Components', () => {
59+
testComponentsDetect({
60+
code: `import React from 'react'
61+
class MyClassComponent extends React.Component {
62+
render() {
63+
return <React.Fragment />;
64+
}
65+
}`,
66+
}, (_context, components) => {
67+
assert(components.length() === 1, 'MyClassComponent should be detected component');
68+
Object.values(components.list()).forEach((component) => {
69+
assert.equal(
70+
component.node.id.name,
71+
'MyClassComponent',
72+
'MyClassComponent should be detected component'
73+
);
74+
});
75+
});
76+
});
77+
});
78+
});

0 commit comments

Comments
 (0)