displayName is not populated during transformation of React.createClass

[joshuahhh]

Before react-transform

babel.transform('var Component = React.createClass({fun: "yay"});');

generates

"use strict";

var Component = React.createClass({
  displayName: "Component",
  fun: "yay" });

(which includes the populated displayName).

After react-transform

babel.transform('var Component = React.createClass({fun: "yay"});', {
    plugins: ['react-transform'],
    extra: {
        'react-transform': []
    }
});

generates

"use strict";

var _components = {
  _$Unknown: {}
};

function _wrapComponent(uniqueId) {
  return function (ReactClass) {
    return ReactClass;
  };
}

var Component = _wrapComponent("_$Unknown")(React.createClass({ fun: "yay" }));

(which does not have a displayName).

Using this latter code, dev tools can't get a name for Component.

Is this expected? Am I missing something? Thanks!

Versions

├── [email protected]
└── [email protected]

[gaearon]

https://github.com/gaearon/babel-plugin-react-transform#limitations:

When using React.createClass() and allowing babel to extract the displayName property you must ensure that babel-plugin-react-display-name is included before react-transform. See this github issue for more details.

[joshuahhh]

Ah, I see. That makes sense now. Thanks for the help!