bad indentation of conditionals

chriswatrous commented 6 years ago

I'm seeing strange indentation of conditionals split into multiple lines.

> atom --version
Atom    : 1.24.0
Electron: 1.6.16
Chrome  : 56.0.2924.87
Node    : 7.4.0

> apm list
Built-in Atom Packages (92)
├── atom-dark-syntax@0.29.0
├── atom-dark-ui@0.53.1
├── atom-light-syntax@0.29.0
├── atom-light-ui@0.46.1
├── base16-tomorrow-dark-theme@1.5.0
├── base16-tomorrow-light-theme@1.5.0
├── one-dark-ui@1.10.9
├── one-light-ui@1.10.9
├── one-dark-syntax@1.8.1
├── one-light-syntax@1.8.1
├── solarized-dark-syntax@1.1.3
├── solarized-light-syntax@1.1.3
├── about@1.7.8
├── archive-view@0.64.1
├── autocomplete-atom-api@0.10.6
├── autocomplete-css@0.17.5
├── autocomplete-html@0.8.4
├── autocomplete-plus@2.40.0
├── autocomplete-snippets@1.11.2
├── autoflow@0.29.0
├── autosave@0.24.6
├── background-tips@0.27.1
├── bookmarks@0.45.0
├── bracket-matcher@0.88.1
├── command-palette@0.43.3
├── dalek@0.2.1
├── deprecation-cop@0.56.9
├── dev-live-reload@0.48.1
├── encoding-selector@0.23.7
├── exception-reporting@0.42.0
├── find-and-replace@0.215.0
├── fuzzy-finder@1.7.3
├── github@0.8.3
├── git-diff@1.3.6
├── go-to-line@0.32.1
├── grammar-selector@0.49.8
├── image-view@0.62.4
├── incompatible-packages@0.27.3
├── keybinding-resolver@0.38.1
├── line-ending-selector@0.7.4
├── link@0.31.4
├── markdown-preview@0.159.20
├── metrics@1.2.6
├── notifications@0.70.2
├── open-on-github@1.3.1
├── package-generator@1.3.0
├── settings-view@0.253.1-0
├── snippets@1.1.9
├── spell-check@0.72.5
├── status-bar@1.8.15
├── styleguide@0.49.9
├── symbols-view@0.118.1
├── tabs@0.109.1
├── timecop@0.36.2
├── tree-view@0.221.3
├── update-package-dependencies@0.13.0
├── welcome@0.36.6
├── whitespace@0.37.5
├── wrap-guide@0.40.3
├── language-c@0.58.1
├── language-clojure@0.22.5
├── language-coffee-script@0.49.3
├── language-csharp@0.14.3
├── language-css@0.42.8
├── language-gfm@0.90.3
├── language-git@0.19.1
├── language-go@0.44.4
├── language-html@0.48.5
├── language-hyperlink@0.16.3
├── language-java@0.27.6
├── language-javascript@0.127.7
├── language-json@0.19.1
├── language-less@0.34.1
├── language-make@0.22.3
├── language-mustache@0.14.4
├── language-objective-c@0.15.1
├── language-perl@0.38.1
├── language-php@0.43.0
├── language-property-list@0.9.1
├── language-python@0.45.6
├── language-ruby@0.71.4
├── language-ruby-on-rails@0.25.3
├── language-sass@0.61.3
├── language-shellscript@0.25.4
├── language-source@0.9.0
├── language-sql@0.25.9
├── language-text@0.7.3
├── language-todo@0.29.3
├── language-toml@0.18.1
├── language-typescript@0.2.3
├── language-xml@0.35.2
└── language-yaml@0.31.1

Community Packages (2) /Users/chris/.atom/packages
├── language-babel@2.84.0
└── vim-mode-plus@1.30.0

config.cson

"*":
  autosave:
    enabled: true
  core:
    audioBeep: false
    projectHome: "*****"
    telemetryConsent: "limited"
  editor:
    fontFamily: "Inconsolata"
    fontSize: 17
    lineHeight: 1.4
    preferredLineLength: 150
  "exception-reporting":
    userId: "*****"
  "language-babel":
    autoIndentJSX: true

// Expected
const somevariable = someConditionBlahBlah ?
  longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr :
  otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;
const somevariable = someConditionBlahBlah ?
  longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr :
  otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;

// Auto indented
const somevariable = someConditionBlahBlah ?
longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr :
otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;
const somevariable = someConditionBlahBlah ?
longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr :
otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;

// Auto indented
const somevariable = someConditionBlahBlah ?
  longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr :  // this line indented manually
  otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;
  const somevariable = someConditionBlahBlah ?
  longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr :
  otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;

It's the same if I put the ? and : at the beginning of the line.

// Expected
const somevariable = someConditionBlahBlah
  ? longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr 
  : otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;
const somevariable = someConditionBlahBlah
  ? longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr 
  : otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;

// Auto indented
const somevariable = someConditionBlahBlah
? longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr 
: otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;
const somevariable = someConditionBlahBlah
? longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr 
: otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;

// Auto indented
const somevariable = someConditionBlahBlah
  ? longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr  // this line indented manually
  : otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;
  const somevariable = someConditionBlahBlah
  ? longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr 
  : otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv;

If I put parenthesis around the whole expression:

// Auto indented
const somevariable = (someConditionBlahBlah
  ? longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr
  : otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv);
  const somevariable = (someConditionBlahBlah
    ? longExpressionQalsdkfjqlwaekjrqlwekrjqlwekjrqlwekrjlqwekjrqlwekjrlqwkejr
    : otherLongExpressionQWqlwekrjqlwekjrqlksadfpgvoiuasdfvpoisdufpoviusdpfoviuspdfoivupsdfoiuvposdfiuv);

gandm commented 6 years ago

I only attempt to autoindent JSX, and only if the autoIndentJSX flag is on. The above doesn't look as though it is inside a JSX block? If it isn't a JSX block then I won't touch it and all auto indentation is handled by Atom or other third party programs. Atom doesn't do autoindentation of ternaries it just aligns the current line with the previous line.

chriswatrous commented 6 years ago

Ok. Thanks.

gandm commented 6 years ago

I would suggest using https://prettier.io/ The Atom module works well.

gandm / language-babel

bad indentation of conditionals #487