Debug tip – Sencha extension for Chrome
Sometimes we need to inspect a particular Ext JS component we have instantiated for debugging purposes. Finding which methods are available and the current attributes and configurations that are set in the object can be a little tricky. When working in MVC, we might need to find the Store ID created and the stores that are alive in the application. Using console.log to output a particular object to inspect it is a lot of work!
The Sencha Labs team released a free extension for Chrome called Sencha App Inspector. When working with Ext JS (or Sencha Touch), it is recommended that you use this extension to help debug the application. In the following screenshot, we can see the extension in action—stores that have been instantiated by the application and the data that has been loaded into it:
Note
For more information about Sencha App Inspector and the download link please visit https://github.com/senchalabs/AppInspector/.
