diff --git a/lib/rules/forbid-dom-props.js b/lib/rules/forbid-dom-props.js index 4638a8700d..dddcef068e 100644 --- a/lib/rules/forbid-dom-props.js +++ b/lib/rules/forbid-dom-props.js @@ -96,9 +96,12 @@ module.exports = { return { JSXAttribute(node) { - const tag = node.parent.name.name; - if (!(tag && typeof tag === 'string' && tag[0] !== tag[0].toUpperCase())) { - // This is a Component, not a DOM node, so exit. + const parentName = node.parent.name; + // Extract a component name when using a "namespace", e.g. ``. + const tag = parentName.name || `${parentName.object.name}.${parentName.property.name}`; + const componentName = parentName.name || parentName.property.name; + const isDomNode = componentName && typeof componentName[0] === 'string' && componentName[0] !== componentName[0].toUpperCase(); + if (!isDomNode) { return; } diff --git a/tests/lib/rules/forbid-dom-props.js b/tests/lib/rules/forbid-dom-props.js index a11d39fe00..e3ab279b39 100644 --- a/tests/lib/rules/forbid-dom-props.js +++ b/tests/lib/rules/forbid-dom-props.js @@ -64,11 +64,11 @@ ruleTester.run('forbid-dom-props', rule, { code: ` class First extends createReactClass { render() { - return ; + return ; } } `, - options: [{ forbid: ['id'] }], + options: [{ forbid: ['style'] }], }, { code: ` @@ -112,6 +112,17 @@ ruleTester.run('forbid-dom-props', rule, { }, ], }, + { + code: ` + const First = (props) => ( + + ); + const Second = (props) => ( + + ); + `, + options: [{ forbid: ['id'] }], + }, ]), invalid: parsers.all([ @@ -324,5 +335,32 @@ ruleTester.run('forbid-dom-props', rule, { }, ], }, + { + code: ` + const First = (props) => ( + + ); + const Second = (props) => ( + + ); + `, + options: [{ forbid: ['id'] }], + errors: [ + { + messageId: 'propIsForbidden', + data: { prop: 'id' }, + line: 3, + column: 21, + type: 'JSXAttribute', + }, + { + messageId: 'propIsForbidden', + data: { prop: 'id' }, + line: 6, + column: 18, + type: 'JSXAttribute', + }, + ], + }, ]), });