From da2168e1102c9b58496186fc85df578a638d4a70 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nicol=C3=B2=20Ribaudo?= Date: Thu, 5 Aug 2021 09:04:57 +0200 Subject: [PATCH] Revert "Add display name after create context (#13501)" (#13637) This reverts commit e9bc7c18c0de029e1cc0e0935c26f208a683e75b. --- .../src/index.js | 173 ++++++------------ .../input.js | 2 - .../output.js | 3 - .../assignment-expression/input.js | 1 - .../assignment-expression/output.js | 2 - .../display-name-context/nested/input.js | 1 - .../display-name-context/nested/output.js | 3 - .../object-property/input.js | 3 - .../object-property/output.js | 5 - .../display-name-context/options.json | 3 - .../variable-declarator/input.js | 1 - .../variable-declarator/output.js | 2 - 12 files changed, 51 insertions(+), 148 deletions(-) delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression-and-display-name/input.js delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression-and-display-name/output.js delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression/input.js delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression/output.js delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/nested/input.js delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/nested/output.js delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/object-property/input.js delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/object-property/output.js delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/options.json delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/variable-declarator/input.js delete mode 100644 packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/variable-declarator/output.js 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 7c024563aa..f19c4dd055 100644 --- a/packages/babel-plugin-transform-react-display-name/src/index.js +++ b/packages/babel-plugin-transform-react-display-name/src/index.js @@ -2,117 +2,29 @@ import { declare } from "@babel/helper-plugin-utils"; import path from "path"; import { types as t } from "@babel/core"; -function addDisplayNameInCreateClass(id, call) { - const props = call.arguments[0].properties; - let safe = true; - - for (let i = 0; i < props.length; i++) { - const prop = props[i]; - const key = t.toComputedKey(prop); - if (t.isLiteral(key, { value: "displayName" })) { - safe = false; - break; - } - } - - if (safe) { - props.unshift( - t.objectProperty(t.identifier("displayName"), t.stringLiteral(id)), - ); - } -} - -function getDisplayNameReferenceIdentifier( - path: NodePath, -): ?t.Identifier { - 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; - } - - // identifiers are the only thing we can reliably get a name from - if (!t.isIdentifier(id)) return; - - return id; -} - -function isCreateContext(node) { - let callee; - return ( - t.isCallExpression(node) && - t.isMemberExpression((callee = node.callee)) && - t.isIdentifier(callee.object, { name: "React" }) && - ((!callee.computed && - t.isIdentifier(callee.property, { name: "createContext" })) || - t.isStringLiteral(callee.property, { value: "createContext" })) - ); -} - -function buildDisplayNameAssignment(ref, displayName) { - return t.assignmentExpression( - "=", - t.memberExpression(t.cloneNode(ref), t.identifier("displayName")), - t.stringLiteral(displayName), - ); -} - -function addDisplayNameAfterCreateContext( - id, - path: t.NodePath, -) { - const { parentPath } = path; - if (parentPath.isVariableDeclarator()) { - // FooContext = React.createContext() - const ref = parentPath.node.id; - // parentPath.parentPath must be a VariableDeclaration because getDisplayNameReferenceIdentifier - // does not support patterns - parentPath.parentPath.insertAfter(buildDisplayNameAssignment(ref, id)); - } else if (parentPath.isAssignmentExpression()) { - // var FooContext = React.createContext() - const ref = parentPath.node.left; - parentPath.insertAfter(buildDisplayNameAssignment(ref, id)); - } else { - // (ref = React.createContext(), ref.displayName = "id", ref) - const { scope } = path; - const ref = scope.generateUidIdentifier("ref"); - scope.push({ id: ref }); - path.replaceWith( - t.sequenceExpression([ - t.assignmentExpression("=", t.cloneNode(ref), path.node), - buildDisplayNameAssignment(ref, id), - t.cloneNode(ref), - ]), - ); - } -} - -const createContextVisited = new WeakSet(); - export default declare(api => { api.assertVersion(7); + function addDisplayName(id, call) { + const props = call.arguments[0].properties; + let safe = true; + + for (let i = 0; i < props.length; i++) { + const prop = props[i]; + const key = t.toComputedKey(prop); + if (t.isLiteral(key, { value: "displayName" })) { + safe = false; + break; + } + } + + if (safe) { + props.unshift( + t.objectProperty(t.identifier("displayName"), t.stringLiteral(id)), + ); + } + } + const isCreateClassCallExpression = t.buildMatchMemberExpression("React.createClass"); const isCreateClassAddon = callee => callee.name === "createReactClass"; @@ -154,27 +66,44 @@ export default declare(api => { displayName = path.basename(path.dirname(filename)); } - addDisplayNameInCreateClass(displayName, node.declaration); + addDisplayName(displayName, node.declaration); } }, CallExpression(path) { const { node } = path; - if (isCreateClass(node)) { - const id = getDisplayNameReferenceIdentifier(path); - if (id) { - addDisplayNameInCreateClass(id.name, node); - } - } else if (isCreateContext(node)) { - if (createContextVisited.has(node)) { - return; - } - createContextVisited.add(node); - const id = getDisplayNameReferenceIdentifier(path); + if (!isCreateClass(node)) return; - if (id) { - addDisplayNameAfterCreateContext(id.name, path); + 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; + } + + // 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-context/assignment-expression-and-display-name/input.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression-and-display-name/input.js deleted file mode 100644 index ee4c559729..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression-and-display-name/input.js +++ /dev/null @@ -1,2 +0,0 @@ -ThemeContext = React.createContext("light"); -ThemeContext.displayName = "CustomThemeContext"; diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression-and-display-name/output.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression-and-display-name/output.js deleted file mode 100644 index dd68935643..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression-and-display-name/output.js +++ /dev/null @@ -1,3 +0,0 @@ -ThemeContext = React.createContext("light"); -ThemeContext.displayName = "ThemeContext"; -ThemeContext.displayName = "CustomThemeContext"; diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression/input.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression/input.js deleted file mode 100644 index e75d864191..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression/input.js +++ /dev/null @@ -1 +0,0 @@ -ThemeContext = React.createContext("light"); diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression/output.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression/output.js deleted file mode 100644 index ab2bd9acd8..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/assignment-expression/output.js +++ /dev/null @@ -1,2 +0,0 @@ -ThemeContext = React.createContext("light"); -ThemeContext.displayName = "ThemeContext"; diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/nested/input.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/nested/input.js deleted file mode 100644 index ebc6657153..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/nested/input.js +++ /dev/null @@ -1 +0,0 @@ -var enhancedContext = qux(React.createContext("light")); diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/nested/output.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/nested/output.js deleted file mode 100644 index 7eb898174a..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/nested/output.js +++ /dev/null @@ -1,3 +0,0 @@ -var _ref; - -var enhancedContext = qux((_ref = React.createContext("light"), _ref.displayName = "enhancedContext", _ref)); diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/object-property/input.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/object-property/input.js deleted file mode 100644 index 4e99a0ec8c..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/object-property/input.js +++ /dev/null @@ -1,3 +0,0 @@ -({ - ThemeContext: React.createContext("light") -}); diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/object-property/output.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/object-property/output.js deleted file mode 100644 index fdc05dbe85..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/object-property/output.js +++ /dev/null @@ -1,5 +0,0 @@ -var _ref; - -({ - ThemeContext: (_ref = React.createContext("light"), _ref.displayName = "ThemeContext", _ref) -}); diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/options.json b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/options.json deleted file mode 100644 index e21e418ca9..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/options.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "plugins": ["transform-react-display-name"] -} diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/variable-declarator/input.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/variable-declarator/input.js deleted file mode 100644 index e79fa34777..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/variable-declarator/input.js +++ /dev/null @@ -1 +0,0 @@ -var ThemeContext = React.createContext("light"); diff --git a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/variable-declarator/output.js b/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/variable-declarator/output.js deleted file mode 100644 index 717112ea86..0000000000 --- a/packages/babel-plugin-transform-react-display-name/test/fixtures/display-name-context/variable-declarator/output.js +++ /dev/null @@ -1,2 +0,0 @@ -var ThemeContext = React.createContext("light"); -ThemeContext.displayName = "ThemeContext"