diff --git a/packages/babel-plugin-transform-react-display-name/src/index.js b/packages/babel-plugin-transform-react-display-name/src/index.js index 9d5cde642f..43206810e7 100644 --- a/packages/babel-plugin-transform-react-display-name/src/index.js +++ b/packages/babel-plugin-transform-react-display-name/src/index.js @@ -53,26 +53,40 @@ export default function ({ types: t }) { } }, - "AssignmentExpression|ObjectProperty|VariableDeclarator"({ node }) { - let left, right; + CallExpression(path) { + let { node } = path; + if (!isCreateClass(node)) return; - if (t.isAssignmentExpression(node)) { - left = node.left; - right = node.right; - } else if (t.isObjectProperty(node)) { - left = node.key; - right = node.value; - } else if (t.isVariableDeclarator(node)) { - left = node.id; - right = node.init; + let id; + + // crawl up the ancestry looking for possible candidates for displayName inference + path.find(function (path) { + if (path.isAssignmentExpression()) { + id = path.node.left; + } else if (path.isObjectProperty()) { + id = path.node.key; + } else if (path.isVariableDeclarator()) { + id = path.node.id; + } else if (path.isStatement()) { + // we've hit a statement, we should stop crawling up + return true; + } + + // we've got an id! no need to continue + if (id) return true; + }); + + // ensure that we have an identifier we can inherit from + if (!id) return; + + // foo.bar -> bar + if (t.isMemberExpression(id)) { + id = id.property; } - if (t.isMemberExpression(left)) { - left = left.property; - } - - if (t.isIdentifier(left) && isCreateClass(right)) { - addDisplayName(left.name, right); + // identifiers are the only thing we can reliably get a name from + if (t.isIdentifier(id)) { + addDisplayName(id.name, node); } } } diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/assignment-expression/actual.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/assignment-expression/actual.js new file mode 100644 index 0000000000..59a5805ac5 --- /dev/null +++ b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/assignment-expression/actual.js @@ -0,0 +1 @@ +foo = React.createClass({}); diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/assignment-expression/expected.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/assignment-expression/expected.js new file mode 100644 index 0000000000..0acce9a865 --- /dev/null +++ b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/assignment-expression/expected.js @@ -0,0 +1,3 @@ +foo = React.createClass({ + displayName: "foo" +}); \ No newline at end of file diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/nested/actual.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/nested/actual.js new file mode 100644 index 0000000000..d0948f5bfd --- /dev/null +++ b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/nested/actual.js @@ -0,0 +1 @@ +var foo = bar(React.createClass({})); diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/nested/expected.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/nested/expected.js new file mode 100644 index 0000000000..9c1a454330 --- /dev/null +++ b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/nested/expected.js @@ -0,0 +1,3 @@ +var foo = bar(React.createClass({ + displayName: "foo" +})); \ No newline at end of file diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/object-property/actual.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/object-property/actual.js new file mode 100644 index 0000000000..42c53a9cbc --- /dev/null +++ b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/object-property/actual.js @@ -0,0 +1,3 @@ +({ + foo: React.createClass({}) +}); diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/object-property/expected.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/object-property/expected.js new file mode 100644 index 0000000000..f09344b241 --- /dev/null +++ b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/object-property/expected.js @@ -0,0 +1,5 @@ +({ + foo: React.createClass({ + displayName: "foo" + }) +}); \ No newline at end of file diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/options.json b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/options.json new file mode 100644 index 0000000000..e21e418ca9 --- /dev/null +++ b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/options.json @@ -0,0 +1,3 @@ +{ + "plugins": ["transform-react-display-name"] +} diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/variable-declarator/actual.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/variable-declarator/actual.js new file mode 100644 index 0000000000..a1ce86e321 --- /dev/null +++ b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/variable-declarator/actual.js @@ -0,0 +1 @@ +var foo = React.createClass({}); diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/variable-declarator/expected.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/variable-declarator/expected.js new file mode 100644 index 0000000000..763399a62b --- /dev/null +++ b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name/variable-declarator/expected.js @@ -0,0 +1,3 @@ +var foo = React.createClass({ + displayName: "foo" +}); \ No newline at end of file diff --git a/packages/babel-plugin-transform-react-display-name/test/index.js b/packages/babel-plugin-transform-react-display-name/test/index.js new file mode 100644 index 0000000000..1f6634aabd --- /dev/null +++ b/packages/babel-plugin-transform-react-display-name/test/index.js @@ -0,0 +1 @@ +require("babel-helper-plugin-test-runner")(__dirname);