Debug Tool
Magento 2 Developer Debug Tool

Magento 2 Developer Debug Tool

ced-pdf-title-image

Running short of time? Get PDF of the blog in your mail.

sharepost
Play Now

Developer Debug Tool by CedCommerce, a developing and debugging extension, provides a complete set of data to the developers related to a current page request. Reading the code flow and understanding it seems to be a difficult process especially when it comes to Magento-2. The Magento-2 Team has completely changed the structure of files and folders and has come up with many new and advanced features in comparison to Magento-1.

Though it has been done to reduce the complexity and provide flexibility to the developers by improving performance & scalability and introducing automated testing, but, majority of the developers who are beginners, find it difficult to grasp. With enhanced technology comes intricacy leading to perplexity for a novice developer. CedCommerce has a somewhat different perspective. CedCommerce believes that if right guidance is given and correct steps are chosen, nothing remains difficult.

 

Comparison between Magento-2 and Magento-1

m2-m1-difference

 

Therefore, in order to resolve the problem faced by the developers in understanding the calling procedure of controllers, block, template files, events-observers, etc. CedCommerce has developed a Magento 2 Developer-Debug Tool extension which will display the currently called controllers, actions, blocks, template files, events, observers, etc on a particular page request.

 

Fixing the problem with Debug Tool

 

The Magento-2 Developer-Debug Tool by CedCommerce truly serves our purpose. It provides us the information about all the controllers, blocks and phtmls, observers and events, models, etc that are executing on a particular page. The developers can simply traverse the site and get to see the list of blocks, observers, events, phtml files and models called on respective pages. After installing the module, a section appears at the bottom of the page displaying separate tabs for “Request”, “Models”, “Collections”, “Observer Events”, “System Tasks”, “All Preferences/Rewrites” and “Handles, Blocks and Templates”.

 

request

The Request tab displays the Name of the Controller, Action Name, Module Name and Path Information of the controller which is called on a particular page.

 

model

The Model tab displays the Model class and the Resource Model’s class and the number of times that model and its resource model has been called.

 

collection

The Collections tab lists the SQL queries which are used for fetching the collection. It also displays the class of that collection and the type of table i.e. whether it is EAV or Flat table. Since in case of EAV the data is fetched from 2 or more tables therefore JOIN query is used to fetch the record as a whole.

 

observer events

The Observer Events tab displays the Event name, its corresponding Observer Name which is observing that event, the Observer Function which should execute when the event is called, the Observer Class where the Observer Function is defined and the Count which indicated the number of times that event is called.

 

events-xml

For instance, here we have created a custom observer ced_devtool_core_collection_abstract_load_before which is observing the event core_collection_abstract_load_before and its respective function onEveryCollectionLoad is defined in Ced\DevTool\Model\Observer. It can be seen in the events.xml file present at magento2 root directory\app\code\Ced\DevTool\etc\frontend on line number 6, our custom event is defined along with the observer, its class and its related method in the <observer> tag.

 

system task

The System Tasks tab shows some of the common functionalities of the admin panel which a developer needs to do every now and then. The purpose of providing this tab is to facilitate the user/developer to perform these common tasks from frontend itself without having to switch from frontend to admin panel again and again. The Enable Path Hint button is used to turn on the Template Path Hints with the help of which the user/developer can easily find the path of the phtml files being loaded on the current page. Similarly, Enable Block Hint is used to turn on the Block Hints with which the blocks that loaded on the current page can be seen. Flush Cache feature is used to flush/clean the Magento-2 cache and Toggle Cache feature is used to Enable/Disable the cache as may be the need.

 

rewrites

The Preferences/Rewrites tab lists all the rewrites which happen in Magento-2. It displays the Parent Interface (Extended Class) and the Child Class which implements that interface. For example, Magento\Framework\Logger\Monolog class implements the Psr\Log\LoggerInterface.

 

handle,blocks

The Handles, Blocks and Templates tab enlists the Blocks which are called on that page, Handle shows the name of the block which is used for calling that block on any phtml file and the Associated Template displays the path of the phtml files which are rendered when their respective blocks are called.

 

To enable or disable the Magento-2 Developer-Debug Tool module a system configuration setting has been provided in the admin panel under CEDCOMMERCE tab. Enable Developer Tools field can be set as Yes to enable the module and Allowed IPs field is used to provide the IP(s) for which this module should be enabled. The IP addresses entered over here should be separated by comma.

admin_configuration

 

Conclusion

Well, with all this explanatory description I have tried to expose the problems faced by the naive developers and tried to justify the solution for it. Magento-2 Developer-Debug Tool by CedCommerce makes debugging easy and not only saves time but also provides a clear understanding of Magento-2 Structure and helps detects blocks, phtml files, controllers, events, observers, models, classes, functions and collections in a convenient manner. If you are still facing issues with construction of your website, you can Hire Magento Developer to make your task easier.

To get a more practical experience related to the working of Magento-2 Developer-Debug Tool module and how to use it, have a look at this video.

CedCommerce always keeps room for improvement and always comes up with regular upgrades of all its products. The stuff from CedCommerce developed in Magento-2 includes Refer a Friend Module, Advance rate Shipping, Blog Extension, Module Creator Service and many more. Not only in Magento-2 but plenty of products are developed in Magento-1 as well which will transform your E-commerce store into a multi-vendor store. You can also find CedCommerce extensions and addons on Magento Connect.

For more details please visit :  www.cedcommerce.com.

How do you like the POST? Feel free to express your ideas with us in the comment section. Any suggestions or opinions would be greatly appreciated 🙂

 

1
  1. Avatar for CedCommerce

    i have installed but get error exception undefine index: method
    Seem problems from Ced\DevTool\Model\Framework\Event\Invoker\InvokerDefault class missing configuration method
    tested on magento 2 latest version

  2. Avatar for CedCommerce

    I followed the same procedure of installing the module and added my Ipv4 IP as well, the module is not working, it shows nothing in the bottom of the page as shown in the video. Im using Magento 2.0.1
    I get

    Fatal error: Uncaught exception ‘Exception’ with message ‘Warning: Cannot modify header information – headers already sent by (output started at C:xampphtdocsmagento2x_2vendorzendframeworkzend-httpsrcPhpEnvironmentResponse.php:116) in C:xampphtdocsmagento2x_2libinternalMagentoFrameworkStdlibCookiePhpCookieManager.php on line 126’ in C:xampphtdocsmagento2x_2libinternalMagentoFrameworkAppErrorHandler.php on line 61

Leave a Reply