How can I bring up the "format document" command?

bendavis · 14 September 2020 16:41

Is the “Format Document” command included in the monaco editor? Grepping the source, I see references to editor.action.formatDocument, but I can’t find the command in Theia. Is it made available through another extension?

vince-fugnitto · 14 September 2020 16:51

@bendavis the editor.action.formatDocument command is included and contributed from the monaco editor. For example: https://github.com/microsoft/monaco-editor/issues/32.

bendavis · 14 September 2020 21:17

@vince-fugnitto Should this command show in the ctrl+shift+P menu? I don’t currently see it. Would that need to be added via a custom extension?

[edit] I just noticed the “Format document” option in the editor context menu, however the option is grayed out / disabled. Any idea why it would be disabled, or how to enable it?

vince-fugnitto · 15 September 2020 19:30

@bendavis it depends on the language, if the document can be formatted then the command will be enabled.
For example, in a typescript file the command is successfully enabled since the TypeScript language-server (tsserver)describes that it can handle formatting of typescript files, and the corresponding extension implements this capability:

export function register(
	selector: DocumentSelector,
	modeId: string,
	client: ITypeScriptServiceClient,
	fileConfigurationManager: FileConfigurationManager
) {
	return conditionalRegistration([
		requireConfiguration(modeId, 'format.enable'),
	], () => {
		const formattingProvider = new TypeScriptFormattingProvider(client, fileConfigurationManager);
		return vscode.Disposable.from(
			vscode.languages.registerOnTypeFormattingEditProvider(selector.syntax, formattingProvider, ';', '}', '\n'),
			vscode.languages.registerDocumentRangeFormattingEditProvider(selector.syntax, formattingProvider),
		);
	});
}

github.com

microsoft/vscode/blob/master/extensions/typescript-language-features/src/languageFeatures/formatting.ts#L14


*--------------------------------------------------------------------------------------------*/

import * as vscode from 'vscode';
import type * as Proto from '../protocol';
import { ITypeScriptServiceClient } from '../typescriptService';
import { conditionalRegistration, requireConfiguration } from '../utils/dependentRegistration';
import { DocumentSelector } from '../utils/documentSelector';
import * as typeConverters from '../utils/typeConverters';
import FileConfigurationManager from './fileConfigurationManager';

class TypeScriptFormattingProvider implements vscode.DocumentRangeFormattingEditProvider, vscode.OnTypeFormattingEditProvider {
	public constructor(
		private readonly client: ITypeScriptServiceClient,
		private readonly formattingOptionsManager: FileConfigurationManager
	) { }

	public async provideDocumentRangeFormattingEdits(
		document: vscode.TextDocument,
		range: vscode.Range,
		options: vscode.FormattingOptions,
		token: vscode.CancellationToken

bendavis · 15 September 2020 17:44

@vince-fugnitto Ok, I was testing in HTML. Is there no formatting provider for HTML?

vince-fugnitto · 15 September 2020 19:30

@bendavis there is formatting for html files using upstream theia (master). It depends on which vscode extensions you have included as part of your application. Formatting for html files comes from vscode-html-builtin-language-features.

bendavis · 15 September 2020 19:29

@vince-fugnitto I see, thanks. I was using the theia-docker image. Looking at the source, it seems vscode-html-builtin-language-features wasn’t included.