Eslint-plugin-react: jsx-indent rule doesn't properly validate ternary (?:) expressions with no parens

Created on 23 Jul 2017  路  3Comments  路  Source: yannickcr/eslint-plugin-react

Prior related issues:

https://github.com/yannickcr/eslint-plugin-react/issues/540
https://github.com/yannickcr/eslint-plugin-react/issues/625

Patterns:

{ condition
  ? <div>
      <div> something </div>
    </div>
  : <div>
      <div> something </div>
    </div>
}

{ condition
    ? <div>
        <div> something </div>
      </div>
    : <div>
        <div> something </div>
      </div>
}

{
  condition
  ? <div>
      <div> something </div>
    </div>
  : <div>
      <div> something </div>
    </div>
}

{
  condition
    ? <div>
        <div> something </div>
      </div>
    : <div>
        <div> something </div>
      </div>
}

Expected behavior:
All of these patterns properly validate and flag no errors.

Actual behavior:
All of these patterns flag errors for lines following and indented after the ternary result clauses (after ? and : lines).

help wanted

Most helpful comment

Note: Also an issue with jsx-indent-props, e.g.:

{
  condition
    ? <El
        prop1={ 1 }
        prop2={ 2 }
      />
    : <OtherEl
        prop1={ 1 }
        prop2={ 2 }
      />
}

I could make a separate issue for this if necessary.

All 3 comments

Note: Also an issue with jsx-indent-props, e.g.:

{
  condition
    ? <El
        prop1={ 1 }
        prop2={ 2 }
      />
    : <OtherEl
        prop1={ 1 }
        prop2={ 2 }
      />
}

I could make a separate issue for this if necessary.

I've also experienced these issues. Any idea what steps we could take to get moving on a fix?

Someone coming forward with a PR would be helpful; however, #1317 may have mitigated this and isn't yet released, afaik.

Was this page helpful?
0 / 5 - 0 ratings