Giters

standard / eslint-config-standard

ESLint Config for JavaScript Standard Style

Home Page:https://standardjs.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

offsetTernaryExpressions and multiline-ternary conflicts with jsx/indent (standard-react)

jahed opened this issue · comments

commented

What version of this package are you using?
15.0.0

What operating system, Node.js, and npm version?
Fedora 32, Node 12, Yarn 1

What happened?
The offsetTernaryExpressions option for indent rule tries to "fix" JSX code that includes ternaries, but then jsx/indent (via standard-react) gets upset that the indentation isn't what it wants. multiline-ternary may also be contributing to this issue.

Here's some example failing code. Attempting to "autofix" will just trigger the other rule, and so on. I tried manually find a structure that it's happy with but nothing seems to satisfy it.

const Test = ({ children }) => {
  const t = true
  return (
    <div>
      {t ? (
        <div>
          true
        </div>
      ) : (
        <div>
          false
        </div>
      )}
    </div>
  )
}

What did you expect to happen?
Both standard and standard-react are happy to work together.

Are you willing to submit a pull request to fix this bug?

Depends on the agreed solution. I don't know if this is an issue with indent and/or jsx/indent. Disabling offsetTernaryExpressions and multiline-ternary "fixes" the conflict in the mean time.

Personally, I'm happy to stick with 14.x as the ternary rules can't autofix everything and there's a lot of fixes I'll need to make on my end.

commented

Oh hello fellow traveler, I was just about to open this issue. Bitten by this today.

commented

I think the idea here would be to disable the indent rule for JSX, which is covered by standard jsx.

Disable: "JSXElement *"

Though I don't know if there are any assumptions regarding indent applying to jsx nodes and properly overlapping.

Sending in a PR to see what people think.

commented

Fixed in 15.0.1.