Magento2 UI Components Debugging – How to Guide

debuggingmagento2uicomponent

I'm trying to build a CRUD module that uses UI components for admin grid and form.
I've did this before and worked, but this one is a bit different and apparently I screwed something up.
The problem is in the UI component file or some class referenced by the UI component file for sure. If I remove the UI component reference from the layout file, the page loads (without the grid obviously).
When including the UI component the page is blank and there is no error logged anywhere, even when on developer mode.

How/where can I start debugging the loading and rendering of the UI components?

Best Answer

What I found so far is that when rendering the layout this stack is followed.

  • \Magento\Framework\View\Layout::generateElements
  • \Magento\Framework\View\Layout\GeneratorPool::process

Now, depending on the type of the layout a different layout generator is called in 

foreach ($this->generators as $generator) {
    $generator->process($readerContext, $generatorContext);
}

For the Ui components ... continuing the stack:

  • \Magento\Framework\View\Layout\Generator\UiComponent::process()
  • \Magento\Framework\View\Layout\Generator\UiComponent::generateComponent()
  • \Magento\Framework\View\Element\UiComponentFactory::create()
  • \Magento\Ui\Model\Manager::prepareData()
  • \Magento\Ui\Model\Manager::evaluateComponents()
  • Magento\Framework\Data\Argument\InterpreterInterface::evaluate.

Here again it depends on the argument type that needs to be interpreted.
You can find some interpreters here lib/internal/Magento/Framework/Data/Argument/Interpreter/

This is as far as I got.
I know it's not a full explanation, but these are some points where you can identify if something is wrong with your ui component.

Related Topic