Feature Request: Allow Custom Editors To Gracefully Handle Diff Views

[hediet]

It would be awesome if custom editors could influence the diff view (or opt out of it).

These are examples where the default diff view does not really work:

• 
• 

Unfortunately, the individual custom editor only knows if it is readonly, but not if it is right or left of a diff view.

Related:

• Viewing a graphical git diff for .yarn files should default to the built-in Text Editor, not the Yarn Loom editor TranquilMarmot/YarnLoom#19
• Handling/Disabling Diff Views in Custom Text Editors #97683

[Tyriar]

👍 hex editor and luna paint could also provide nicer diff experiences.

[fchen7i]

#171381 is slightly different. we want to use a new webview to do the compare

[starball5]

It would be nice if the user could have control over this using the View: Reopen Editor With... or View: Reopen Editor With Text Editor commands (which is the case for the "compare files" feature). Even nicer might be if such a control (dropdown?) were available in the action bar (at the top right of the workbench).

Related on Stack Overflow:

• How can I compare files in VS Code with an alternative editor?
• Different defaults for editing and comparing?

[zjffun]

Set default editor for diff view

We can use workbench.editorAssociations and configurationDefaults to set default editor for diff view, like:

Text editor diff view:

{
  "configurationDefaults": {
    "workbench.editorAssociations": {
      "{git,gitlens}:/**/*.{drawio,dio,dio.svg,drawio.svg}": "default",
    }
  }
}

Image preview diff view:

{
  "configurationDefaults": {
    "workbench.editorAssociations": {
      "{git,gitlens}:/**/*.{bmp,dib,ico,png,jif,jpe,jpg,jpeg,tga,tpic,webp}": "imagePreview.previewEditor",
    }
  }
}

Set different custom editor for diff view and edit view

{
  "configurationDefaults": {
    "workbench.editorAssociations": {
      "{git,gitlens}:/**/*.custom-ext": "custom-diff-editor",
    }
  },
  "customEditors": [
    {
      "viewType": "custom-editor",
      "displayName": "custom-editor",
      "selector": [
        {
          "filenamePattern": "*.custom-ext"
        }
      ],
      "priority": "default"
    },
    {
      "viewType": "custom-diff-editor",
      "displayName": "custom-diff-editor",
      "selector": [
        {
          "filenamePattern": "*.custom-ext"
        }
      ],
      "priority": "option"
    }
  ]
}

Example

Edit view:

Diff view:

---

PS: Currently it seems some bug with configurationDefaults in VS Code 1.85.0, and it's fixed #194087 . configurationDefaults with workbench.editorAssociations should work fine use in VS Code 1.86.0, and now we can already use workbench.editorAssociations to test various scenes.

[cweijan]

I found the final solution, which is surprisingly simple, and I think this issue can be closed.

{
	"viewType": "viewType",
	"displayName": "Custom Editor",
	"selector": [
		{
			"filenamePattern": "file:/**/*.ext"
		}
	]
}

[hanjoosten]

@cweijan , Could you elaborate? Where should this json be configured?

[rsoika]

@cweijan thanks for your feedback. But I think this is not the solution for the problem. The configuration you mentioned is the general mapping for a file extension and your custom editor. We also use this in our Open-BPMN project to link .bpmn and .bpmn2 files with the editor.

But the question is: How can I overwrite this editor linking for the Diff-Compare View? This is another editor type in vs-code that overtakes the default mappings.
I am searching for a way to re-configure the Diff Editor in some way to show changes in bpmn file not graphical but in a text editor.

[Thomas-Grimmeisen]

@cweijan Thank you this is works like a charm for me!
@rsoika note the file:/ in the beginning of the filenamePattern - this is not present in the project you linked and was missing for me aswell.

[rsoika]

Hi, thanks for your answer. It seems that I am not able to follow your suggestions here. My example was a deep configuration detail in my extension code itself. This is to associate my own extension (providing a custom editor) with a specific file extension. And this all works fine. So I can open a .bpmn file with the extension editor or a default text editor.

But with this configuration in case of a GIT staging situation the Diff Editor View open two graphical editors. And this is what I want to avoid:

@zjffun mentioned something like the following using the priority option:

  "customEditors": [
    {
      "viewType": "custom-editor",
      "displayName": "custom-editor",
      "selector": [
        {
          "filenamePattern": "*.custom-ext"
        }
      ],
      "priority": "default"
    },
    {
      "viewType": "custom-diff-editor",
      "displayName": "custom-diff-editor",
      "selector": [
        {
          "filenamePattern": "*.custom-ext"
        }
      ],
      "priority": "option"
    }

But what I did not understand here is the view type custom-diff-editor ? Is this a vs-code editor feature that I just need to configure with the priority 'option' ? Or was this a suggestion for a possible solution in the future?

[cweijan]

@rsoika @hanjoosten Sorry I didn't explain it clearly. The key point is file:/**/. For example, replace the *.custom-ext with file:/**/*.custom-ext.

Note that this needs to be done by the extension developer.

[rsoika]

@cweijan I still did not get it. I am the extension developer. I do not have the problem that my editor is not opened. I just want to define an optional different editor for the Diff compare view. Is this possible?

[cweijan]

@rsoika This is possible, replace your *.custom-ext with git:/**/*.custom-ext.

[rsoika]

Ok, I finally figured out, that it is only possible to configure the workbench.editorAssociations in the local VS-Code settings.

But it seems to be impossible to set this option in my extension source code directly.

[zjffun]

Ok, I finally figured out, that it is only possible to configure the workbench.editorAssociations in the local VS-Code settings.

But it seems to be impossible to set this option in my extension source code directly.

@rsoika We can use configurationDefaults in package.json of extension to set default workbench.editorAssociations for user.