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',
+ },
+ ],
+ },
]),
});