Javascript indented method chaining

 Hi, I've tried several combinations of options already and there doesn't seem to be much or any difference between them. I'm looking for 1) a way to enable alignment of chained method calls in a less ridiculous format or 2) a way to disable the auto formatting of chained method calls so I can indent myself.

Sample code:

http.fetch('myStuff', {
method: 'GET',
}).then(response => response.json())
.then(data => {
this.stuff = data
});


Expected format:

http.fetch('myStuff', {
method: 'GET',
}).then(response => response.json())
.then(data => {
this.stuff = data
});

 

4 comments
Comment actions Permalink

Hmm... With the basic, 'Default' code style scheme, I get your code formatted as:

http.fetch('myStuff', {
method: 'GET',
})
.then(response => response.json())
.then(data => {
this.stuff = data
});

Looks pretty much the same as your desired formatting...

P.S. I'm using 2016.3 EAP

0
Comment actions Permalink

Note that you can exclude certain code fragments from formatting - this can be done by surrounding the regions you don't like to be touched by formatter with the formatter markers, like

//@formatter:off
your code here
//@formatter:on

But you need to make sure to enable these markers in Settings | Editor | Code Style, Enable formatter markers in comments

0
Comment actions Permalink

To my eyes, it looks very different and actually makes it harder for me to visualise scope blocks when writing anything more than very basic code. That little indent to me indicates that the code below is nested within it, when really it's at the same level of scope.

0
Comment actions Permalink

hmm... but your 'Expected format:' example is also indented - the only difference is that yours seems to have 4 spaces indented, and mine is using 2 spaces indentation...

OK, here is the configuration that seems to produce exactly the expected result:

 <codeStyleSettings language="JavaScript">
    <indentOptions>
      <option name="CONTINUATION_INDENT_SIZE" value="2" />
    </indentOptions>
  </codeStyleSettings>

 

http.fetch('myStuff', {
method: 'GET',
}).then(response => response.json())
.then(data => {
this.stuff = data
});
0

Please sign in to leave a comment.