Extension Development: ensure package.json contributions match the implementation

When developing extensions for VS Code, a lot of string keys are used. These keys are usually defined in the contribution section of a package.json and must match the keys used in the code to register the implementation. It is very easy to rename one part and forgetting the other.

Example

package.json

...
"activationEvents": [
	"onCustomEditor:hediet.vscode-drawio"
],
"contributes": {
	"customEditors": [
		{
			"viewType": "hediet.vscode-drawio",
			...
		},
	],
}

extension.ts

vscode.window.registerCustomEditorProvider2(
	"hediet.vscode-drawio",
	new DrawioEditorProvider(server),
	{
		supportsMultipleEditorsPerDocument: false,
		webviewOptions: { retainContextWhenHidden: true },
	}
)

Problem

All hediet.vscode-drawio strings have to match. This is also the case when declaring config properties. I managed multiple times now to rename one or two of them and forgetting about the others. This caused preventable bugs.

Solution

It would be really great if this could be improved. I have two ideas for that:

1. Implementing lint rules that check that those keys align. This would include a check that all viewTypes used in the code must be mentioned in the package.json.
2. Specifying all contributions with typescript and updating package.json automatically on each build.

The last idea could look like this: contributions.ts

const myCustomEditorViewTypeId = new vscode.ViewTypeId("hediet.vscode-drawio");
const myConfigProperty = new vscode.ConfigProperty<string>("hediet.vscode-drawio.my-property", { type: "string" });
export const contributions = new vscode.Contributions({   
   customEditors: [{ viewTypeId: myCustomEditorViewTypeId }],
   configurations: [{ property: myConfigProperty }]
});

Discussion

I really like 2) since it would also enable type safe config properties, go to definition and other features provided by the great tooling around TypeScript. However, I don’t see good ways to automatically update/generate a package.json on each build.

What do you think?

[connor4312]

I’d be interested in something in this space. There are many places where constants are shared between the contributions and registrations in the extension. For the js-debugger I made an ad-hoc script to generate parts of my contributions, where my commands, debugger options, and localized strings are typed checked nicely.

I think that a good first step for exploration would be some vscode-typed-contributions package that extension authors could grab and mix into their build process. In js-debug I made type-guard functions for VS Code APIs, but I think with some cleverness you could have a drop-in replacement package that adds strong typings to the API in a forwards-compatible way.

[vscode-triage-bot]

🙁 In the last 60 days, this feature request has received less than 20 community upvotes and we closed it. Still a big Thank You to you for taking the time to create this issue! To learn more about how we handle feature requests, please see our documentation.

Happy Coding!