Multiple tags in the same line results in 'unexpected identifier' error

[mtarnovan]

This code produces the aforementioned error:

  ...
  render: ->
    <span>foo</span><span>bar</span>

while this works:

  ...
  render: ->
    <span>foo</span>
    <span>bar</span>

Is this expected? Thanks.

[sophiebits]

You can't return two tags from render. Your second example returns only the second tag.

[mtarnovan]

@spicyj I gave a wrong example, what I mean was - this results in an error:

...
render: ->
  <div>
    <span>foo></span><span>bar<span/>
  </div>

[jsdf]

You've got some malformed tags there... your code should be:

...
render: ->
  <div>
    <span>foo</span><span>bar</span>
  </div>

Or was the > after foo intentional? In that case it should be compiled as an escaped character.

[mtarnovan]

That rogue > was 100% accidental. Actually, offending code looks something like this:

  render: ->
    <div className="comments" id="comments" name="comments">
      <h3 className="h3-text">
        Add your comments
        <span className="faded">
          — <i className="fa fa-comment"></i> <span className="comment-list__title__counter">{this.state.totalCommentsCount}</span>
        </span>
      </h3>

The error is unexpected indentation at the line with the <i> tag. I should mention I'm using sprockets-coffee-react in a Rails app. I solved this by adding a newline after the <i> tag, like this:

        <span className="faded">
          — <i className="fa fa-comment"></i>
          <span className="comment-list__title__counter">{this.state.totalCommentsCount}</span>
        </span>

Thanks

[jsdf]

Okay thanks, this gives me a enough information to say this is a genuine issue and I'll move forward with some changes I've been considering which should eliminate this class of white space related issues.