Js-beautify: Ternary Operator Forced Into Multiple Lines

[gpresland]

Input

Ternary operators are forced into multiple lines.

let test = (true) ? true : false;

Expected Output

let test = (true) ? true : false;

Actual Output

let test = (true)
    ? true
    : false;

Settings

{
    "indent_size": 2,
    "indent_char": " ",
    "indent_level": 0,
    "indent_with_tabs": false,
    "preserve_newlines": true,
    "max_preserve_newlines": 2,
    "jslint_happy": false,
    "space_after_anon_function": true,
    "brace_style": "collapse-preserve-inline",
    "keep_array_indentation": false,
    "keep_function_indentation": false,
    "space_before_conditional": true,
    "break_chained_methods": false,
    "eval_code": false,
    "unescape_strings": false,
    "wrap_line_length": 0
}

[bitwiseman]

This doesn't repro on http://jsbeautifier.org/. What tool are you using to run this?

[gpresland]

Using the Atom plugin, with a .jsbeautifyrc. This is in an ES6 JSX file.

[bitwiseman]

@gpresland -
Have your tried uninstalling and reinstalling the atom-beautify plugin?

If so, can you show more of the code around this problem? It seems like there's some other part of the input that might be causing this.

Are the settings accurate? What you show looks like indent_size of 4, not 2.

[gpresland]

I have uninstalled and reinstalled the Atom package and the problem persists.

Input

import './Test.less';

import React from 'react';
import classNames from 'classnames';

const propTypes = {
  //
};

const defaultProps = {
  //
};

export class Test extends React.Component {

  constructor(props) {
    super(props);
  };

  render() {

    let test = (true) ? true : false;

    return (
      <div>Test</div>
    );
  }
}

Test.propTypes = propTypes;
Test.defaultProps = defaultProps;

export default Test;

Output

import './Test.less';

import React from 'react';
import classNames from 'classnames';

const propTypes = {
  //
};

const defaultProps = {
  //
};

export class Test extends React.Component {

  constructor(props) {
    super(props);
  };

  render() {

    let test = (true)
      ? true
      : false;

    return (
      <div>Test</div>
    );
  }
}

Test.propTypes = propTypes;
Test.defaultProps = defaultProps;

export default Test;

Settings

{
    "indent_size": 2,
    "indent_char": " ",
    "indent_level": 0,
    "indent_with_tabs": false,
    "preserve_newlines": true,
    "max_preserve_newlines": 2,
    "jslint_happy": false,
    "space_after_anon_function": true,
    "brace_style": "collapse-preserve-inline",
    "keep_array_indentation": false,
    "keep_function_indentation": false,
    "space_before_conditional": true,
    "break_chained_methods": false,
    "eval_code": false,
    "unescape_strings": false,
    "wrap_line_length": 0
}

[bitwiseman]

Even with that added code, I still can't reproduce this on http://jsbeautifier.org/ . Sorry.

I suspect operator_position is being set by atom-beautify, https://github.com/Glavin001/atom-beautify. Please take a look at https://github.com/Glavin001/atom-beautify/blob/master/CONTRIBUTING.md#new-issues-bugs-questions-etc and generate debugging info and include that here.

[gpresland]

I will move the issue to the atom-beautify repo since the issue appears to be coming from them.

[fabdouglas]

For your information, I'd to dig into the repository of atom-beautify to find the fix.
Add option "preserve_ternary_lines":true in .jsbeautifyrc

See https://github.com/Glavin001/atom-beautify/pull/726