Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

JSX transform doesn't always preserve line numbers #335

Closed
sophiebits opened this issue Sep 10, 2013 · 1 comment · Fixed by #336
Closed

JSX transform doesn't always preserve line numbers #335

sophiebits opened this issue Sep 10, 2013 · 1 comment · Fixed by #336

Comments

@sophiebits
Copy link
Collaborator

Transforming this JSX:

/** @jsx React.DOM */
var HelloMessage = React.createClass({
  render: function() {
    return <div>
      Look!
      <a href=
        "http://www.facebook.com/">Facebook
      </a>
    </div>;
  }
});

gives

/** @jsx React.DOM */
var HelloMessage = React.createClass({displayName: 'HelloMessage',
  render: function() {
    return React.DOM.div(null,
" Look! ",      React.DOM.a( {href:"http://www.facebook.com/"}, "Facebook "      ),
    );
  }
});

Looks like we lost the line break after Look!, href=, and Facebook. I admit that breaking after href= is weird but since it compiles, it'd be nice if the line numbers were preserved so that lint errors, etc. can correspond easily.

sophiebits added a commit to sophiebits/react that referenced this issue Sep 11, 2013
Fixes facebook#335.

Now this JSX:

```
/** @jsx React.DOM */
var HelloMessage = React.createClass({
  render: function() {
    return <div>
      Look!
      <a href=
        "http://www.facebook.com/">Facebook
      </a>
    </div>;
  }
});
```

produces

```
/** @jsx React.DOM */
var HelloMessage = React.createClass({displayName: 'HelloMessage',
  render: function() {
    return React.DOM.div(null,
      " Look! ",
      React.DOM.a( {href:
        "http://www.facebook.com/"}, "Facebook "
      )
    );
  }
});
```

rather than the less-desirable

```
/** @jsx React.DOM */
var HelloMessage = React.createClass({displayName: 'HelloMessage',
  render: function() {
    return React.DOM.div(null,
" Look! ",      React.DOM.a( {href:"http://www.facebook.com/"}, "Facebook "      ),
    );
  }
});
```
bvaughn pushed a commit to bvaughn/react that referenced this issue Aug 13, 2019
* Add version 4 react-devtools and react-devtools-core packages which support both React Native and e.g. Safari or iframe DOM usage.
* Replaces typed operations arrays with regular arrays in order to support Hermes. This is unfortunate, since in theory a typed array buffer could be more efficiently transferred between frontend and backend for the web extension, but this never actually worked properly in v8, only Spidermonkey, and it fails entirely in Hermes so for the time being- it's been removed.
* Adds support for React Native (paper renderer)
* Adds a style editor for react-native and react-native-web
@hossain666
Copy link

/** @jsx React.DOM */
var HelloMessage = React.createClass({displayName: 'HelloMessage',
render: function() {
return React.DOM.div(null,
" Look! ", React.DOM.a( {href:"http://www.facebook.com/"}, "Facebook " ),
);
}
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants