Magento 2 Debug Helper Module usage with PHPStorm and Xdebug

Debugging technique

Some time ago I stumbled upon youtube video, by Matheus Gontijo @mhgontijo, about one interesting technique of debugging Magento 2 with PHPStorm and Xdebug.

I was impressed by how quick and easy it allows to track code parts and objects, which are responsible for some frontend changes or data output.

The bottom side of that debugging technique was the requirement to constantly edit IDE breakpoint rules and four times write the searched query as well as other tiny inconveniences that was not so promising in day to day work.

With the soul of programmer, I’m obsessive about writing efficient code and looking for productive ways of the workflow as well. I had a need to automate these routine tasks, so the idea of Magento Debug Helper module was born.

Needless to say, PHPStorm may be replaced with your favorite IDE which supports debugging with Xdebug. But in this article, I’ll cover PHPStorm IDE.

Magento 2 Debug Helper Module

What it does:

• Takes searched query from the address bar by extra param
• Skips Magento cache to check actual code execution
• Hits PHPStorm Xdebug if the searched query was found

No need of code breakpoints and no need to edit breakpoints rules. The only requirement is one extra param in the browser’s address bar with the searched query. Of-course configured Xdebug is also required, which is must-have for PHP debugging.

Module checks if XDEBUG_SESSION cookie value is set, to determine if debugging is active. Make sure that you have set it up. By the way, the Xdebug Helper browser extension helps to do it easily.

Installation

To install the Magento 2 Debug Helper module, simply run the command below

composer require --dev shkoliar/magento-debug-helper

Then enable the module

bin/magento module:enable Shkoliar_DebugHelper

Another few extra commands to ensure that the module is properly registered and classes are generated.

bin/magento setup:upgrade
bin/magento setup:di:compile

Usage

With enabled extension and active Xdebug, copy the text what you want to search with debugger and add it to page URL with query param XDS. For example to search for $22.00 on /radiant-tee.html page, use /radiant-tee.html?XDS=$22.00. Once the searched query had found, PHPStorm will hit a breakpoint, and you will be able to check the call stack or step further.

This extension saves time in my day to day work and I believe it can save yours.

Cheers!