babel-plugin-react-transform icon indicating copy to clipboard operation
babel-plugin-react-transform copied to clipboard

static class property displayName not taken into account for displayName

Open nikgraf opened this issue 10 years ago • 2 comments

While upgrading to react-transform I noticed in case displayName is defined as a class property the name is not taken into account e.g.

class CustomDisplayNameComponent {
  static displayName = 'Custom Name';
  render() {}
}

Here out in the wild: https://github.com/nikgraf/belle/blob/75aa7dad0a2ba03ad755a97efe3193bdcf76b3a3/src/components/Card.jsx#L27 For Belle we will migrate the display names, but others might run into the same issue.

I investigated and learned that findDisplayName takes the name in case it's a class node and has an ID or leverages the arguments from createClass. I couldn't figure out how to get the properties from a class node. Any hint? I'm happy to submit a PR.

nikgraf avatar Sep 08 '15 10:09 nikgraf

Yep, a PR for supporting this would be great.

gaearon avatar Mar 05 '16 04:03 gaearon

if someone wants to submit a PR it should be something like this: out of all the paths of the body of the class declaration find one (if any) that satisfies path.isClassProperty(), and is static path.node.static, and is called displayName path.node.key == 'displayName'. Its path.node.value should then be the displayName This probably doesn't work exactly like this but it should get you some of the way there. (look here for inspiration https://github.com/babel/babel/blob/master/packages/babel-plugin-transform-class-properties/src/index.js#L33)

nfcampos avatar Mar 05 '16 09:03 nfcampos