Vscode: Allow autoSave and formatOnSave

[andrecasal]

VS Code documentation regarding configuration says that formatOnSave only works when autoSave is turned off.

The formatOnSave config:

// Format a file on save. A formatter must be available, the file must not be auto-saved,
// and editor must not be shutting down.
  "editor.formatOnSave": true,

and the autoSave config:

// Controls auto save of dirty files. Accepted values:  'off', 'afterDelay',
// 'onFocusChange' (editor loses focus), 'onWindowChange' (window loses focus).
// If set to 'afterDelay', you can configure the delay in 'files.autoSaveDelay'.
  "files.autoSave": "off",

// Controls the delay in ms after which a dirty file is saved automatically.
// Only applies when 'files.autoSave' is set to 'afterDelay'
  "files.autoSaveDelay": 1000,

Both live inside the user settings.

It would be a great developer experience to have files automatically saved AND format the documents automatically.

There's a closed issue with a similar title #37820, but the author was looking to solve an extension bug and it got closed when it was solved. I think this issue remains an important feature request.

[campelo]

I think this issue remains an important feature request.

I agree with you.

[eladcandroid]

Any news about this issue? It can be very helpful...

[varthc]

+1 This feature would be awesome.

[ildarmgt]

Might be related: it doesn't say it for "files.trimTrailingWhitespace": true, but it doesn't seem to trim trailing white spaces when it auto saves "files.autoSave": "afterDelay", but works when you save the file (like with ctrl-s). Similar behavior seen elsewhere. Autosave treated differently than regular Save on my end.

[andraz]

I would paraphrase the request a bit:

How can we get the functionality a setting named "editor.formatOnAutoSave": true would provide us?

At the moment I am struggling to make Prettier format code as soon as I change focus which triggers auto-save. Both work on their own, but do not work together.

expected result:
File gets formatted first, then gets saved.

actual result:
File gets saved without formatting.

edit: We could manage to hack together a solution using this extension and prettier's command line interface, but why should all other less hack-wise users stay affected by this bug?

https://github.com/emeraldwalk/vscode-runonsave

[JerryGreen]

expected result:
File gets formatted first, then gets saved.

actual result:
File gets saved without formatting.

This is not true. Having autoSave and formatOnSave both set to true, it works properly: it gets formatted, then saved.

_However_, I agree that "editor.formatOnAutoSave": true | false setting is a good idea. I don't want my file to be formatted on autoSave, I want it to get formatted on a manual save only.

If you try to make a keybinding cmd+s to assign editor.action.format, then yes - it works improperly, it gets saved, then gets formatted.

[lopsch]

expected result:
File gets formatted first, then gets saved.

actual result:
File gets saved without formatting.

This is not true. Having autoSave and formatOnSave both set to true, it works properly: it gets formatted, then saved.

autoSave can't be set to true. If it is set to afterDelay the formatOnSave will not work even if this is set to true:

Format a file on save. A formatter must be available, the file must not be saved after delay, and the editor must not be shutting down.

At least this is my understanding.

[JerryGreen]

@lopsch oh sorry by autoSave set to true I actually meant it's not disabled, and in my case it's set to onFocusChange. What I have, basically, in my settings.json:

"editor.codeActionsOnSave": {
  "source.fixAll.tslint": true
},
"editor.formatOnSave": true,
"files.autoSave": "onFocusChange",

And it works just fine. At least from VSCode side. Sometimes it happened that tslint was broken in newer versions, so I had to change version to an older one (currently 1.2.1 TSLint for VSCode works just fine).

So I don't see any problem here, actually. And...

It would be a great developer experience to have files automatically saved AND format the documents automatically.

It's already working in such a way. Both Prettier (which is controlled by editor.formatOnSave) and TSLint (which is controlled by editor.codeActionsOnSave and source.fixAll.tslint). At least they are working for me. And automatically on save, which is happened when my tab lose its focus (or if I save manually too).

So I think this issue should be closed.

[andrecasal]

This feature isn't yet implemented @JerryGreen

To reproduce:

1. Copy this to an HTML file:

<!DOCTYPE html>
<html>
<head>
    <title>Hello World</title>
</head>
<body>
    <div>Hello world!</div>
</body>
</html>

1. Set the following settings.json settings:

{
    "html.format.indentInnerHtml": true,
    "files.autoSave": "afterDelay",
    "editor.formatOnSave": true,
}

1. Make a change to the file and wait for the afterDelay to trigger a save.
2. Notice that the <head> and the <body> tags are not indented as per the "html.format.indentInnerHtml": true setting.

However, if you save the file manually by pressing Cmd+s, it will trigger a file format.

[JerryGreen]

@andrecasal oh, that's true, - just checked this setting. It does not work together. It has something to do with "files.autoSave": "afterDelay" setting. I don't really like this setting though. In more complex cases (than HTML formatter case) this will work in a pretty weird way, I suppose. But you're right, - it's not working.

[davidbarton]

For me it is very important part of developer experience. I know it is already possible to hack some linters to get the code formatted for you. For example Prettier + TSLint or rust-lang can do that.

As described above this should be possible for all formatters using simple setting. Is there a chance to get official response from team on this issue please? I see @jrieken is now assigned to the issue.

[carlogonzalo]

+1 for this feature and suprising that it is not possible at the moment considering awsome vscode.

[rtbo]

+1
I confirm that auto formatting is done with onFocusChange and onWindowChange, but not with afterDelay.

Note that some formatters take a substantial time to execute and editing experience could quickly become annoying, so the current behavior is not unsound.
An additional setting like editor.formatOnAutoSave is needed.

[symonxdd]

Yup, would be nice to have this feature, 2 years later...

[vscode-triage-bot]

We closed this issue because we don't plan to address it in the foreseeable future. You can find more detailed information about our decision-making process here. If you disagree and feel that this issue is crucial: We are happy to listen and to reconsider.

If you wonder what we are up to, please see our roadmap and issue reporting guidelines.

Thanks for your understanding and happy coding!