How to Debug

In order to use the debugging functionality, make sure that you've included the non-minified version of the library - webix.js.

Main Features of Webix Debug

  • Allows inspecting function arguments and some component settings and informs about improper configuration like undefined variables, syntax mistakes, etc. instead of some incomprehensible internal errors;
  • In case data loading goes wrong, there will be a corresponding message with the information about the error;
  • Debugging flags usage;
  • Debugging menu for each component.

Debugging Flags

There are the following options you can enable for debugging:

  • To enable event logging, use:
webix.debug({events: true});

It is the best way to see what events are there.

  • To get the log with info about current component sizes, apply:
webix.debug({size:true});

Before version 6.0 the flags were enabled as:

webix.debug = true;
webix.debug_size = true;

Debugging Menu

Debugging menu is activated with a "Ctrl + right mouse click" combination on the needed component and offers a lot of debugging options:

  • look up into the documentation for this component;
  • learn the component's dimensions;
  • study the component hierarchy on the page;
  • long links to the key features of the component, namely its JS and HTML object, configuration and data for the component.
Back to top