How to open a file in a remote development container by link?

[boumanb]

Context

❯ code --version
1.74.2
e8a3071ea4344d9d48ef8a4df2c097372b0c5161
x64

❯ code --list-extensions --show-versions | grep container
[email protected]

// .devcontainer.json
// See https://aka.ms/vscode-remote/devcontainer.json for format details.
{
	// See https://aka.ms/vscode-remote/devcontainer.json for format details.
	"name": "Existing Docker Compose (Extend)",
	// Update the 'dockerComposeFile' list if you have more compose files or use different names.
	// The .devcontainer/docker-compose.yml file contains any overrides you need/want to make.
	"dockerComposeFile": [
		"../../../../docker-compose.yml",
		"../../../../docker-compose.override.yml"
	],
	// The 'service' property is the name of the service for the container that VS Code should
	// use. Update this value and .devcontainer/docker-compose.yml to the real service name.
	"service": "php82",
	// The optional 'workspaceFolder' property is the path VS Code should open by default when
	// connected. This is typically a file mount in .devcontainer/docker-compose.yml
	"workspaceFolder": "/shared/httpd/project",
	"shutdownAction": "none",
	// Uncomment the next line if you want to keep your containers running after VS Code shuts down.
	// "shutdownAction": "none",
	// Uncomment the next line if you want to add in default container specific settings.json values
	// "settings":  { "workbench.colorTheme": "Quiet Light" },
	// Uncomment the next line to run commands after the container is created - for example installing git.
	// "postCreateCommand": "apt-get update && apt-get install -y git",
	// Add the IDs of any extensions you want installed in the array below.
	"extensions": [],
	"remoteUser": "devilbox"
}

Explanation

I'm trying to let Laravel Ignition open my files immidiately. I'm working in a remote development container provided by Devilbox, which is already running and an instance of VS Code [Dev Container: Existing Docker Compose (Extend)] is opened and working successfully.

There is a setting IGNITION_EDITOR available that affects the linking like so IGNITION_EDITOR='vscode-remote' => vscode://vscode-remote/<path-to-file> & IGNITION_EDITOR='vscode' => vscode://vscode/<path-to-file>. I however keep running into issues.

What I've tried

Links I've tried (directly in browser):

• vscode://vscode-remote/dev-container+2f686f6d652f62696c6c79622f646576656c6f70HEXSTRING/project see this issue for explanation on hex
• vscode://vscode-remote/dev-container+2f686f6d652f62696c6c79622f646576656c6f70HEXSTRING//project
• vscode://vscode-remote/dev-container+2f686f6d652f62696c6c79622f646576656c6f70HEXSTRING//project/file.txt
• vscode://vscode-remote/dev-container+2f686f6d652f62696c6c79622f646576656c6f70HEXSTRING/project/file.txt
• vscode://vscode-remote/dev-container//project/file.txt
• vscode://vscode-remote/dev-container/project/file.txt
• vscode://vscode/dev-container/project/file.txt
• vscode://vscode/dev-container+2f686f6d652f62696c6c79622f646576656c6f70HEXSTRING/project/file.txt
• vscode://vscode/dev-container/project/file.txt
• vscode://vscode/dev-container/project

I can provide the specific error(s) I receive from VS Code, I don't think they are of any help.

Desire

Ability to open a file through VS Code in a remote container using the link method. Would help with navigating to files from the browsers (coming from a debug display i.e.).

Possibly related

• Navigation with :line:column syntax not working for vscode-remote url microsoft/vscode-remote-release#7787
• Ability to launch .devcontainer project from command line microsoft/vscode-remote-release#2133

[Chuxel]

Yeah, microsoft/vscode-remote-release#2133 is the place where this is being discussed. What is available at the moment is the open command if the Dev Container CLI is installed via VS Code

microsoft/vscode-remote-release#2133 (comment)

TLDR

1. Install devcontainer CLI by running VS Code command palette - Remote-Containers: Install devcontainer CLI
2. After installation from run command devcontainer open instead of code . from directory (Or alternatively devcontainer open *path*) to open the current folder in its corresponding dev container.

[boumanb]

Thanks for responding. That's unfortunate, would love to open a file through VS Code in a remote container using the link method. Would help with navigating to files from the browsers (coming from a debug display i.e.).

[Chuxel]

Makes sense! If you want to giving a 👍 on the issue and adding a note on opening a specific file in the issue above will help the team with prioritization. //cc @bamurtaugh @chrmarti

[bamurtaugh]

In the meantime, perhaps the "Open in Dev Containers" badge would help, as used in repos like: https://github.com/microsoft/vscode-remote-try-node

[wasd171]

I would also add that this would be extremely important for tools like Zeplin. It is very convenient to be able to jump from the design reference to the actual code piece. We already have links set up that point to the relevant files, however currently it is only possible to open them on the host, not in the container

[dunhamjared]

Solution

The remote path schema must be used, with the correct remoteAuthority. For example:

vscode://vscode-remote/{remoteAuthority}/{pathToFile}

Finding the remote authority

The remoteAuthority can be found by using the vscode devtools console, by calling:

window.vscode.context.configuration().workspace.uri._formatted

Which returns something like:

vscode-remote/dev-container+7b22686f737450617468223a226578616d706c65227d/workspace/project

Where you can prepend vscode://, to get a browser friendly link:

vscode://vscode-remote/dev-container+7b22686f737450617468223a226578616d706c65227d/workspace/project

NOTE: Yours may not have "dev-container" if you're using a tunnel, ssh-remote, etc.

And then you could append the path to a file, with line number, etc.

vscode://vscode-remote/dev-container+7b22686f737450617468223a226578616d706c65227d/workspace/project/path/to/file