Auto-indentation problem with promise blocks

[dbaeumer]

From @lumaxis on August 12, 2016 0:7

• VSCode Version: 1.5.0-insider (666ed83a2d465257201cdac215a553ddee3cccbe)
• OS Version: 10.11.6

Steps to Reproduce:

1. Create a Typescript file and start writing code using promises
2. Auto-indent file using Shift+Alt+D Shift+Alt-F

Expected Result:

return output
.then((result: ControllerResponse) => {
  return res
  .status(result.statusCode)
  .json(result.payload);
})

Actual Result:

return output
  .then((result: ControllerResponse) => {
    return res
    .status(result.statusCode)
    .json(result.payload);
  })

Description:

The problem with the current way is that it leads to a strange indentation on the closing braces:

    });
}

Here, the closing curly braces and parentheses for the .then() block are indented 4 spaces instead of 2 spaces as they should be.

Copied from original issue: microsoft/vscode#10453

[dbaeumer]

From @waderyan on August 12, 2016 15:0

Thank you for opening this issue. We appreciate your feedback greatly.

Couple questions.

1. Do you mean Format Code when you say auto-indent? I cannot find the command auto-indent.
2. The keybinding for Format Code is cmd+shift+f. Did you change your keybinding to cmd+shift+d?
3. What is your spacing / tab preferences? (lower bottom right corner)

Here I have copied your code sample and ran format code with spaces set at 4. I have repeated the same test with no issues for spaces preference set to 2 and set to tabs.

[dbaeumer]

From @lumaxis on August 12, 2016 15:41

1. Ah, yes of course. I've ever only used the keyboard shortcut as I was always searching for a command containing "auto" or "indent" but never found Format Code.
2. You're of course right, it's actually alt+shift+f.
3. 2 spaces

[dbaeumer]

From @waderyan on August 12, 2016 19:52

Ok. Unfortunately, I can repo your issue. Is there anything else you can think of the makes your setup different than me?

I'm on the same OS and same Insiders build... I have tried with all spaces / tabs configuration but cannot see the behavior you described.

@dbaeumer - I can't repo. Do you have any ideas?

[dbaeumer]

From @lumaxis on August 12, 2016 21:23

@waderyan But I can see the issue repro in your gif. I'll try to give a clearer example:

Correctly formatted code:

function doStuff() {
  new Promise(function () {
    return "some string";
  })
  .then((something: string) => {
    something.split(" ");
  });
}

After VS Code "Format Code":

function doStuff() {
  new Promise(function () {
    return "some string";
  })
    .then((something: string) => {
      something.split(" ");
    });
}

Notice how the .then() block is indented two more spaces although the scope did not go one level deeper.

[dbaeumer]

From @waderyan on August 12, 2016 21:31

Thank you for clarifying. Yes I see the issue and was able to repo.

I agree with your preference.

[dbaeumer]

This is the tsserver formatting the code that way.

@waderyan to see whether something is a tsserver bug you can enable message tracing by setting "typescript.tsserver.trace": "verbose". Doing so and formatting the above code returns the following response from the tsserver:

Response received: format (3). Request took 47 ms. Success: true 
Result: [
    {
        "start": {
            "line": 5,
            "offset": 1
        },
        "end": {
            "line": 5,
            "offset": 3
        },
        "newText": "    "
    },
    {
        "start": {
            "line": 6,
            "offset": 1
        },
        "end": {
            "line": 6,
            "offset": 5
        },
        "newText": "      "
    },
    {
        "start": {
            "line": 7,
            "offset": 1
        },
        "end": {
            "line": 7,
            "offset": 3
        },
        "newText": "    "
    }
]

Which changes the two spaces to four. Moving to the TS team.

[saschanaz]

Isn't this by design? I thought property accesses are being indented intentionally.

foo
  .bar
  .baz

[lumaxis]

@saschanaz If that is the case it's imo a very questionable decision that at least would need an option to be able to change it.
The biggest problem with the current behavior, as mentioned in my original issue, is the inconsistent indentation of closing curly braces and parentheses:

          });
      });
    });
});

[lumaxis]

I'd like to take a stab at this but as someone new to this codebase, it's pretty hard to figure out where to start or how to debug a change to the server like this.
Can someone point me to the right files/link me to some documentation? Thanks!

[ksairi]

any news on this?
This is still happening in the last version!

[ki11ua]

From @lumaxis on August 12, 2016 0:7

• VSCode Version: 1.5.0-insider (666ed83a2d465257201cdac215a553ddee3cccbe)
• OS Version: 10.11.6

Steps to Reproduce:

1. Create a Typescript file and start writing code using promises
2. Auto-indent file using Shift+Alt+D Shift+Alt-F

Expected Result:

return output
.then((result: ControllerResponse) => {
  return res
  .status(result.statusCode)
  .json(result.payload);
})

Actual Result:

return output
  .then((result: ControllerResponse) => {
    return res
    .status(result.statusCode)
    .json(result.payload);
  })

Description:

The problem with the current way is that it leads to a strange indentation on the closing braces:

    });
}

Here, the closing curly braces and parentheses for the .then() block are indented 4 spaces instead of 2 spaces as they should be.

Copied from original issue: microsoft/vscode#10453

Thsis is not fixed yet right?

[tim92109]

Still no resolution?

[kimberwarden]

And still nothing?