1 | /**
|
---|
2 | * @fileoverview Enforce style prop value is an object
|
---|
3 | * @author David Petersen
|
---|
4 | */
|
---|
5 |
|
---|
6 | 'use strict';
|
---|
7 |
|
---|
8 | const variableUtil = require('../util/variable');
|
---|
9 | const docsUrl = require('../util/docsUrl');
|
---|
10 | const isCreateElement = require('../util/isCreateElement');
|
---|
11 | const report = require('../util/report');
|
---|
12 |
|
---|
13 | // ------------------------------------------------------------------------------
|
---|
14 | // Rule Definition
|
---|
15 | // ------------------------------------------------------------------------------
|
---|
16 |
|
---|
17 | const messages = {
|
---|
18 | stylePropNotObject: 'Style prop value must be an object',
|
---|
19 | };
|
---|
20 |
|
---|
21 | /** @type {import('eslint').Rule.RuleModule} */
|
---|
22 | module.exports = {
|
---|
23 | meta: {
|
---|
24 | docs: {
|
---|
25 | description: 'Enforce style prop value is an object',
|
---|
26 | category: 'Possible Errors',
|
---|
27 | recommended: false,
|
---|
28 | url: docsUrl('style-prop-object'),
|
---|
29 | },
|
---|
30 |
|
---|
31 | messages,
|
---|
32 |
|
---|
33 | schema: [
|
---|
34 | {
|
---|
35 | type: 'object',
|
---|
36 | properties: {
|
---|
37 | allow: {
|
---|
38 | type: 'array',
|
---|
39 | items: {
|
---|
40 | type: 'string',
|
---|
41 | },
|
---|
42 | additionalItems: false,
|
---|
43 | uniqueItems: true,
|
---|
44 | },
|
---|
45 | },
|
---|
46 | },
|
---|
47 | ],
|
---|
48 | },
|
---|
49 |
|
---|
50 | create(context) {
|
---|
51 | const allowed = new Set(((context.options.length > 0) && context.options[0].allow) || []);
|
---|
52 |
|
---|
53 | /**
|
---|
54 | * @param {ASTNode} expression An Identifier node
|
---|
55 | * @returns {boolean}
|
---|
56 | */
|
---|
57 | function isNonNullaryLiteral(expression) {
|
---|
58 | return expression.type === 'Literal' && expression.value !== null;
|
---|
59 | }
|
---|
60 |
|
---|
61 | /**
|
---|
62 | * @param {object} node A Identifier node
|
---|
63 | */
|
---|
64 | function checkIdentifiers(node) {
|
---|
65 | const variable = variableUtil.getVariableFromContext(context, node, node.name);
|
---|
66 |
|
---|
67 | if (!variable || !variable.defs[0] || !variable.defs[0].node.init) {
|
---|
68 | return;
|
---|
69 | }
|
---|
70 |
|
---|
71 | if (isNonNullaryLiteral(variable.defs[0].node.init)) {
|
---|
72 | report(context, messages.stylePropNotObject, 'stylePropNotObject', {
|
---|
73 | node,
|
---|
74 | });
|
---|
75 | }
|
---|
76 | }
|
---|
77 |
|
---|
78 | return {
|
---|
79 | CallExpression(node) {
|
---|
80 | if (
|
---|
81 | isCreateElement(context, node)
|
---|
82 | && node.arguments.length > 1
|
---|
83 | ) {
|
---|
84 | if ('name' in node.arguments[0] && node.arguments[0].name) {
|
---|
85 | // store name of component
|
---|
86 | const componentName = node.arguments[0].name;
|
---|
87 |
|
---|
88 | // allowed list contains the name
|
---|
89 | if (allowed.has(componentName)) {
|
---|
90 | // abort operation
|
---|
91 | return;
|
---|
92 | }
|
---|
93 | }
|
---|
94 | if (node.arguments[1].type === 'ObjectExpression') {
|
---|
95 | const style = node.arguments[1].properties.find((property) => (
|
---|
96 | 'key' in property
|
---|
97 | && property.key
|
---|
98 | && 'name' in property.key
|
---|
99 | && property.key.name === 'style'
|
---|
100 | && !property.computed
|
---|
101 | ));
|
---|
102 |
|
---|
103 | if (style && 'value' in style) {
|
---|
104 | if (style.value.type === 'Identifier') {
|
---|
105 | checkIdentifiers(style.value);
|
---|
106 | } else if (isNonNullaryLiteral(style.value)) {
|
---|
107 | report(context, messages.stylePropNotObject, 'stylePropNotObject', {
|
---|
108 | node: style.value,
|
---|
109 | });
|
---|
110 | }
|
---|
111 | }
|
---|
112 | }
|
---|
113 | }
|
---|
114 | },
|
---|
115 |
|
---|
116 | JSXAttribute(node) {
|
---|
117 | if (!node.value || node.name.name !== 'style') {
|
---|
118 | return;
|
---|
119 | }
|
---|
120 | // store parent element
|
---|
121 | const parentElement = node.parent;
|
---|
122 |
|
---|
123 | // parent element is a JSXOpeningElement
|
---|
124 | if (parentElement && parentElement.type === 'JSXOpeningElement') {
|
---|
125 | // get the name of the JSX element
|
---|
126 | const name = parentElement.name && parentElement.name.name;
|
---|
127 |
|
---|
128 | // allowed list contains the name
|
---|
129 | if (allowed.has(name)) {
|
---|
130 | // abort operation
|
---|
131 | return;
|
---|
132 | }
|
---|
133 | }
|
---|
134 |
|
---|
135 | if (node.value.type !== 'JSXExpressionContainer' || isNonNullaryLiteral(node.value.expression)) {
|
---|
136 | report(context, messages.stylePropNotObject, 'stylePropNotObject', {
|
---|
137 | node,
|
---|
138 | });
|
---|
139 | } else if (node.value.expression.type === 'Identifier') {
|
---|
140 | checkIdentifiers(node.value.expression);
|
---|
141 | }
|
---|
142 | },
|
---|
143 | };
|
---|
144 | },
|
---|
145 | };
|
---|