Phpstorm Xdebug Docker



PhpStorm provides Docker support using the Docker plugin. The plugin is bundled and enabled by default. The Docker plugin is bundled with PhpStorm and activated by default. If the plugin is disabled, enable it on the Settings/Preferences Plugins page as described in Managing plugins. FROM php:5.6.37-apache EXPOSE 443 80 RUN pecl install xdebug-2.5.5 RUN docker-php-ext-enable xdebug COPY./docker/php5.6-fpm.conf /etc/apache2/conf-available RUN a2enmod headers && a2enmod ssl && a2enmod rewrite && a2enconf php5.6-fpm.conf && a2ensite httpd.conf.

Created at 2020-10-10Updated at 2020-10-11Category Docker Tag Resource / Docker / PHP / PhpStorm / PhpUnit / Linux

I have recently configured my windows 10 laptop with an additional SSD, so I could experiment with Linux. I have already installed Pop!_OS Git, PhpStorm and Docker. I haven’t installed PHP or Composer locally. Next I want to learn how to use this new environment. This is what I have found out so far.

Start with a Project

One of my favorite projects is the Gilded Rose Kata. I can clone that from github as follows:

Create docker-compose.yml

It is possible to run PHP cli without a docker-compose file, I have found it is easier to set up PhpStorm using this intermediate step.

PhpStorm has several preconfigured Docker containers, source:

They can be used as follows:

Php 7.3 CLI and XDebug 2.7

docker-compose.yml

The above will work for Linux, for Windows and MacOS the XDEBUG_CONFIG: will need the changed as follows:

Windows and MacOS

Phpstorm Xdebug Docker

Windows and MacOS replace with XDEBUG_CONFIG:host.docker.internal, which will automatically resolve to the internal address of the host Docker is running on.

MacOS with local Homebrew php-fpm

If you use a local Homebrew php-fpm installation, port 9000 (which is the default debugging port) may become occupied. PhpStorm will remain silent on starting listening for incoming connections. If this is the case, in the Settings | Languages & Frameworks | PHP | Debug, set the Debug port to 9001, and use the following configuration line instead.

Apache, PHP 7.3, XDebug 2.7 and MySQL

For information this is the LAMP version (based on the phpstorm-workshop).

docker-compose.yml

Install dependencies using composer

To keep things simple the composer Docker container can be used to install the dependencies.

Xdebug

This is the script recommended on the docker hub composer page to avoid filesystem permissions problems

By default, Composer runs as root inside the container. This can lead to permission issues on your host filesystem. You can work around this by running the container with a different user:

On windows change $PWD for the full path to the project (note: forward slash / as separator), remove the line end and run the command as one line:

Alternatively, more complex projects will need specific PHP extensions to be installed, which are not included in the Composer Docker container. The following method could be used to install Composer, inside the container and install the dependencies.

  1. Access bash in the php-cli container: docker-compose run --rm php-cli /bin/bash
  2. Install Composer, by following the download instructions for Linux
  3. Still, inside the container, install dependencies: php composer.phar install
  4. Exit the container exit

Note: In Linux, using the second method Composer will create the vendor folder as root! Google network & wireless cards driver download.

Download doma driver. The permissions can be changed using chown:

Further information

Phpstorm Xdebug Docker Free

There is a detailed description about running Docker containers as current host user.

The official documentation on Docker run and docker-compose cli reference.

Configure PhpStorm

Now the project has been cloned from GitHub and the dependencies have been installed. PhpStorm can be setup to use Docker. Thanks to Gary Hockin’s excellent YouTube video Running PHPUnit Tests in PhpStorm with Docker, the setup process can be easily replicated.

There is a four stage process:

  1. Configure PhpStorm to use Docker
  2. Configure the remote interpreter
  3. Configure PhpUnit
  4. Create Test runner

1. Configure PhpStorm to use Docker

  • Settings (Ctrl + Alt + S)
  • Search for Docker
    • Under Build, Execution, Deployment
  • Click + to add
  • Select Unix socket
    • Confirm connection was successful

2. Configure the default CLI interpreter

  • Settings (Ctrl + Alt + S)
  • Search for CLI interpreter
    • Under Language & Frameworks > PHP
  • Click the ellipse button next to CLI Interpreter
  • Click +
  • Select From Docker, Vagrant…
  • Choose Docker Compose
  • Choose the Service from the drop down list (e.g. php-cli)
Docker
  • Select OK
  • Change the name e.g. Docker PHP
  • Apply and OK
  • Check the mapping
    • e.g. for a web project <Project root>→/var/www/html
    • e.g. for an app project <Project root>→/app

3. Configure PhpUnit

  • Settings (Ctrl + Alt + S)
  • Search for Test Frameworks
    • Under Language & Frameworks > PHP
  • Click +
  • Select PhpUnit from remote interpreter
  • Choose the interpreter created above, e.g. Docker PHP
    • Confirm the path mappings, as above <Project root>→/app
    • Input the script path based on the mapping inside the container e.g. /app/vendor/autoload.php
    • Under Test runner, tick Default configuration script, type in the path, in the docker container. e.g. /app/phpunit.xml

4. Create the test runner

  • Click Edit Configuration (next to run test button)
  • Click + to add
  • Select PHPUnit
  • Under Test Runner choose Defined in the configuration file
  • Name - e.g. Docker PHPUnit
  • Click Play to run all the tests!

What about configuring xDebug?

Thanks to this setup, xDebug has been automatically configured! It will use the default PHP Interpreter, which was configured in step 2. A breakpoint can be set in the app or tests can be run with coverage :)

Enjoy the kata!

Edit: Added details on running commands on MacOS and Windows and small tweaks.

Xdebug is an extension for debugging your PHP code. Magento Cloud Docker provides a separate container to handle Xdebug requests in the Docker environment. Use this container to enable Xdebug and debug PHP code in your Docker environment without affecting your Magento Commerce Cloud project configuration.

Xdebug Config

The following instructions explain how to configure Xdebug and PhpStorm to debug in your local Docker environment.

If you use Microsoft Windows, take the following steps before continuing:

  1. Open your Docker settings.
  2. Select the Expose daemon on tcp://localhost:2375 without TLS checkbox.
  3. Wait for the settings to apply.
Phpstorm

Enable Xdebug

  1. To enable Xdebug for your Docker environment, generate the Docker Compose configuration file in developer mode with the --with-xdebug option and any other required options, for example.

    For Linux systems, you must use the --set-docker-host option to add the host.docker.internal entry to the /etc/hosts file for the fpm_xdebug container.

    This command adds the Xdebug configuration to your docker-compose.yml file.

  2. Follow the steps to launch the Docker environment in Developer mode.

    The default Docker environment configuration sets the following Xdebug configuration variables:

  3. Change any Xdebug configuration using the XDEBUG_CONFIG option. For example, to change the xdebug.remote_port option:

    On Linux systems, use the following command instead:

To configure PhpStorm to work with Xdebug:

  1. In your PhpStorm project, open the settings panel.

    • Mac OS X—Select File > Preferences.
    • Windows/Linux—Select File > Settings.
  2. In the Settings panel, expand and locate the Languages & Frameworks > PHP > Servers section.

  3. Click the + to add a PHP Remote Debug server configuration. The project name is in grey at the top.

  4. Configure the following settings for the new server configuration:

    • Name—Enter the name used for the serverName option from PHP_IDE_CONFIG value.
    • Host—Enter localhost.
    • Port—Enter 80.
    • Debugger—Select Xdebug.
  5. Select Use path mappings. In the File/Directory pane, the root of the project for the serverName displays.

  6. In the Absolute path on the server column, click and add a value to the MAGENTO_ROOT option. The default value is /app

  7. Change the Xdebug port to 9001 in the Languages & Frameworks > PHP > Debug > Xdebug > Debug Port panel.

  8. Click Apply.

Use Xdebug

The following steps describe debugging web requests and CLI commands.

To debug web requests:

  1. In your PhpStorm project, click (Start listening) in the top navigation bar.

  2. Add breakpoints in the pub/index.php file.

  3. Install the debug extension in the browser, and then click Debug to enable.

  4. In the browser, open the https://localhost URL.

  5. When PhpStorm recognizes the Xdebug connection, you can begin debugging web requests.

Phpstorm Xdebug Docker Cli

You can debug any Magento command or PHP script using the following steps.

To debug CLI commands:

Phpstorm Xdebug Docker Not Working

  1. In your PhpStorm project, open the Build, Extension, Deployment > Docker panel, and then click + to add a new Docker server and update the following settings:

    • Name—Enter a name for the server, for example Docker Cloud.
    • Connect to Docker daemon with
      • Windows—Select TCP socket and update Engine Api Url with tcp://localhost:2375.
      • Mac OS X—Select Docker for Mac. [default]
  2. In the Languages & Frameworks > PHP > Cli Interpreter panel, click […].

  3. Click [+] to add and configure a new Cli Interpreter from your Docker image. Update the following settings:

    • Name—Enter a name for the new interpreter, such as Magento cloud docker cli.
    • Remote—Select Docker.
      • Server—Select Docker Cloud from the previous step.
      • Image name—Select magento/magento-cloud-docker-php:7.x-cli.
    • Additional > Debugger extension
      • Windows—Enter xdebug.
      • Mac OS X/Linux—Enter xdebug.so.
    • Click Refresh to verify that the interpreter and Xdebug extension are configured properly.
  4. Click Save.

  5. Open the Run/Debug Configuration window and add a new PHP script with the following settings:

    • Name—Enter bin/magento.
    • Configuration > File—Select the path to the bin/magento file in your local environment.
  6. Add breakpoints in the bin/magento file and the debug PHP script created in the previous step.

Using Xdebug Helper

You can install and use the Xdebug Helper Chrome extension to debug your PhP code from the browser.

Xdebug Phpstorm Docker Windows

To use Xdebug Helper with Chrome:

Phpstorm Xdebug Docker Windows

  1. Install the Xdebug Helper extension from the Chrome store.

  2. Enable the extension in Chrome as shown in the following figure.

  3. In Chrome, click in the Chrome toolbar.

  4. From the Xdebug helper menu, click Options.

  5. From the IDE Key list, select PhpStorm.

  6. Click Save.





Comments are closed.