Xdebug 3: Debugging the Symfony Demo App in Docker with VS Code

in this video we're going to have a look at how to run symfony's demo application in a docker container and setting up debugging with vs code or visual studio code i have created a demo project with composer called xd book symphony i can start php's web server to run this in my browser window you can see that this application works the first step is to configure docker itself to make that work i have created three extra files in the symfony demo root directory the first one to look at is the dockerfile itself i have created a minimal dockerfile here we're using the php docker 7.4 cli image and then i'm installing the xd book extension as well as copying its configuration file to the rights directory we'll have a look at this configuration file in a moment we're exposing our web server at port 8111 and as my docker entry point i'm changing to the demo xdebug symfony directory and start my web server with the correct argument in the docker compose file we are setting up a few more things we only have one servers the php servers and we name our container xdebug symphony if you're on linux you need to create an extra host configuration to point host.internal to hostgateway this allows applications in a docker container to connect back to the host that runs the docker container itself this is the way how xdebug can talk back to your ide running on the same machine we expose the port 811 we create a volume to set our target directory slash demo and we also create a volume to put our log files in as perhaps in the future profiling files and trace files in the xdiba configuration we load our extension with the zend extension line we configure xd box modes to develop comma debug this enables the step debugger we tell xd book to start with every request we make sure to turn off the discover client host setting because that does not work in a docker environment we set the client host to host.docker.internal which is the one that we have configured in a docker compose jammel file xdebug will use this host to connect to to start a debugging session we also configure xdbox lock so that we can see what is going on there we can now create our docker container through docker compose it warns about the xdebug underscore mode variable not being set but that's okay once we have built our docker container we can start it in our browser we can now access our application again if we look at the log file that has been created you see that xdebug is trying to connect to host docker internal on port 9003 but we can't connect that is of course because we don't have our ide running yet let's start vs code i have already loaded it in the right folder but we want to debug this in order to debug we need to install the xdebug plugin we go to preferences extensions and search for xdebug the extension that you want to install is a php debug extension by felix becker now that we have installed the extension we need to create a launch configuration to do that we go to run and debug and select create a launch.json file and as environment we select php the standard launch.json file that the extension creates still has the old xdebuc.2 port 9000 in there which we need to change to 9003 in order to start a debugger you select run and debug and in the top you pick the listen for xdebug configuration and then click the start debugging arrow this now put vs code in debugging mode in our browser we can reload a new file vs code pops up with a warning saying that it cannot open its file that is because we have not created a path mapping pop mappings are a way to map the parts on a remote file in this case demo xdebug symphony vendor doctrine annotations lib doctrine blah blah blah to our local file system because we haven't made that vs code cannot find the file on the local system and hence cannot find a file and debug it that is our next step making part mappings let's stop debugging for now part mappings are made in the launch.json file let's add them to the configuration in our docker composer gemma file we have mapped the project's route to the demo directory we need to make the exact same mapping in vs code's path mappings so let's change the documented variant to what we actually want to do and save the file now we can start the debugger again go to run and debug and go to listen for x debug we can then press the arrow again we put vs code in debugging mode and load a new page in our symfony demo application now vs code no longer warns that it can't find a files because it can now resolve them through our part mappings however it will stop on the first exception that occurs this is perhaps not as expected but it is part of the vs code debugging extension by default the vs code extension breaks on everything which you can see in the breakpoints here this is not often something that you want so you need to disable this we can now press f5 or continue to continue debugging and you see it does not stop again in order to set a breakpoint in some codes you can click in the margin so that our vat dot shows up when we now request a page through our browser it should stop on that line and here we go after reloading it instantly stops on the line where we want it to do in the top left you have now all the local variables some of them are still being uninitialized but you can also see the path and the locale that are being passed in as arguments to this function by clicking on the debug buttons above you can step over lines as i'm doing here you can also step into functions by f11 or clicking the step into button you can use step out to step out of the current function and go back to its parent function on the left hand side you can check all your variables you can see the call stack and go to previous stack elements explore the contents of objects and its properties and so on and so on hopefully this showed you how you can set up xdebug running in docker with vs.code thank you very much

Channel: Derick Rethans

Views: 11,049

Keywords:

Id: ZIGdBSD6zvU

Length: 6min 32sec (392 seconds)

Published: Mon May 17 2021