Set up Visual Studio Code with multiple containers - visual-studio-code

I have an application consisting of a Flask web application and a RQ worker application. Both live in separate containers but use the same image. I would like to use Visual Studio Code's Remote Extension to run the containers and debug inside them. This all works well for either container using devcontainer.json and the automatically generated .devcontainer/docker-compose.yml which overwrite mine partially.
This Article explains that connecting to multiple containers is possible using multiple windows. They assume the two containers to have different source, stored in different folders which can be used to store separate devcontainer.json files.
I don't understand though how to configure the startup. When starting any of the two containers I would need the other one to start as well. That's easily achieved using the original docker-compose.yml. I could then manually run and debug the application in the started devcontainer.
Yet how would I connect to the other, then also running container and run and debug there?

First, install the Docker extension.
In VS Code, you can right-click on the docker-compose.yaml File and click on compose up to start all the containers.
You debug your script in exactly one terminal shell. This is the reason why you have just one VS Code window per container.
However, you can attach VS Code afterwards to as many already started containers as you like (e.g. after docker compose up) by right-click on the container and click on Attach Visual Studio code in the Docker tab.

Related

Is it possible to use DocumentLink and registerUriHandler when using the remote containers?

I installed laravel goto config extension in the remote containers and whenever I click on the link that extension generates and that should jump to another file vscode crashes and restarts
I've created the github issue with the extension creator but author doesn't have any experience with remote extensions. In the github issue I also linked github repository that you can use to reproduce the issue. Note that instead of
./vendor/bin/sail up -d --build
you can use
docker-compose up -d --build
to start the containers
Once containers start you can follow the readme or you can directly open example link below that crashes the vscode
vscode://ctf0.laravel-goto-config/var/www/html/config/app.php?name
File /var/www/html/config/app.php exists in the docker container
I don't know too much about developing vscode extensions but I managed to find out that extension uses DocumentLink and registerUriHandler under the hood to generate the link to the file and to handle incoming links. I even downloaded the extensions and tried to debug the issue, but I only managed to get the debugger and breakpoints working when using vscode directly on the host. Once I connect to remote container debugging doesn't stop on breakpoints anymore and vscode crashes when I use the vscode://... link
Is it possible to use vscode://... with remote containers to open the files?
EDIT:
I found one example where opening files trough links work. In the file .devcontainer/devcontainer.json when I hover on the files in the "dockerComposeFile": [...] list I can see the link and when I click on it it will open the file. Hovering on the link shows following value
vscode-remote://dev-container+2f55...../<absolute-path-to-file>
but this handles link with vscode and not with registerUriHandler
I managed to pinpoint the issue. In the extension there was a line
vscode.commands.executeCommand('vscode.openFolder', vscode.Uri.file(path))
that was causing vscode to reload even if it's the same folder. This only happened in remote containers
Changing this line to
vscode.commands.executeCommand('vscode.open', vscode.Uri.file(path))
solved the issue.
Command vscode.openFolder should be changed to vscode.open
I found more info about these commands in the docs

How to create settings.json and extensions.json outside of image and named config level for an ATTACHED VSCode Container

I'm using WSL 2 for Windows, and I'm currently working on a ddev repo where I am creating a development environment using ddev and VSCode. On initiation of the ddev environment, I am starting up all my containers. With my custom "ddev code" command, I am attaching VSCode to the web container via the hex representation of the web container using
'code --folder-uri="vscode-remote://attached-container+646465762d646465762d7673636f64652d646576636f6e7461696e65722d64727570616c392d74656d706c6174652d776562%/var/www/html"'
Now, I would like to automatically enable a bunch of extensions and settings. Currently, I am using workspace settings in my projects folder structure in the form of .vscode/settings.json and extension settings in the form of .vscode/extensions.json. But this is just a workaround, since VSCode will use these settings as "workspace settings" and not "devcontainer settings". I would like to define the settings and install the extensions directly on my attached VSCode container rather than in my workspace settings, since I can only use "recommendations" in the extensions.json, because it is seen as a workspace.
I know I can set the settings and extensions under "AppData\Roaming\Code\User\globalStorage\ms-vscode-remote.remote-containers\imageConfigs" or "nameConfigs" but I would like to have them in Ubuntu or rather in my project's folder directory. I also know that there is the devcontainer.json for standalone VSCode Containers where you can set the Docker files and settings/extensions, but how can I use such a file for my attached container?
Another way would be to install the extensions via command after attaching VSCode using
code --install-extension <extension-id>
But this will only install them locally. And executing this command in the web Container via ssh will throw an error.
Maybe someone knows a solution? If further information is needed I can of course provide it :)
Here is the repository I am working on:
https://github.com/webksde/ddev-vscode-devcontainer-drupal9-template
EDIT: Maybe this issue from our repo can also give more insight:
https://github.com/webksde/ddev-vscode-devcontainer-drupal9-template/issues/28

Mutliple SSH connections inside Visual Studio Code

Is it possible that I can use multiple SSH connections inside Visual Studio Code? I have created 8 different SSH Targets. I think a good solution could be that inside the same window I only have to switch the terminal from one target to the next target.
Also, I have created a workspace. code-workspace file in which I have opened different network drives together as one workspace. The point is if I open one SSH target it would be opened inside a new window and if not, the workspace gets closed. Is it possible to combine both solutions?
Thanks in advance and kind regards
The remote SSH capability added to VSCode (and documented here) is only valid for one remote SSH connection at a time (seen in the lower-left corner)
If you want to develop locally, but still have multiple terminals, each one with their own SSH connection, you would need to:
declare multiple terminals
configure them to launch their own ssh command when starting their session (using terminal.integrated.shellArgs.<OS>": )

No "open folder in container" or any other command in remote-containers vs code

I'm using a remote machine, and want to run a docker inside that machine (local->remote->docker) and wish to use the Remote development in Containers tools of vs code
Unfortunatlly, I do not see any of the actions after installing the extension.
My view (ctrl+shift+p -> type remote-containers)
While the tutorial has actions I don't even see:
You need to make sure you are not connected to your remote host via Remote-SSH in VSCode. If you are, you will not see "Open Folder in Container..." or the other options.
Try opening up VSCode without connecting using Remote-SSH. You will find that the option is now present.
To set up a remote Docker host, you first need to be able to access your remote host using key based authentication as describe here
You then set
"docker.host":"ssh://your-remote-user#your-remote-machine-fqdn-or-ip-here"
in setting.json.
Once that is setup, you can only attach to running containers. Test this out before proceeding:
Start a container on the remote host
Hit F1 in your vscode and then select "Attach to Running Container..."
You should see the container you started and you should be able to attach to this
Once you are past this point, you will need to create your devcontainer.json file as per the documentation
Make sure you have installed Remote Container extension.
and ssh as mentioned on the comment above.
Once installed, click on Docker icon, under containers, right click on the container you need to work with vcode and select attach vscode.
I had this issue when I opened vscode for the first time in a year after only needing to install it for some random project that wanted me to use "dev containers" for, I don't remember what.
But I don't care about dev containers anymore and I don't remember that project, however, vscode was functionally unusable because it opened in that old project directory and was trying to do... something with containers. I don't know, I don't care, I just wanted to open another folder so a junior programmer could use an IDE on my machine they're familiar with instead of emacs/vim/whatever.
The solution for me was to use the "extensions" tab CTRL+SHIFT+X, disable the "Dev Containers" extension, then use "File -> Open Recent Folder" to select some other directory. This gets around the "can't open in container" bug. If you don't have a history of other opened directories, I think you need to completely reinstall Vscode or something.

How to "Attach Visual Studio Code" to container on remote EC2 instance

For the last month I can only connect VS Code to remote docker containers maybe 10% of the time I try to do it. When it works, it works great, but I cannot reliably connect when I want to.
Right now I'm not setting docker.host in VS Code settings. Things have worked without setting that, some of the time. Right now I'm consistently seeing this:
I can connect via SSH to the remote instance.
I can see the docker container is running (docker ps).
The Docker->containers list shows the container.
But "Attach Visual Studio Code" does not show the container as an option.
My question is how can I attach to the container that's definitely right there and running?
Maybe notable I have the Remote Extensions installed locally, but there is no option to install any of the extensions on the remote instance. And there is no "Attach To Running Container" option. I don't know how to get that option to come back.
Thanks for any ideas.