ExtJS debugging "[E] Layout run failed" (in a custom component)

Question

I have developed a custom kind of combo box that uses a grid instead of the standard combo picker (mainly to benefit from buffered rendering with huge data sets). I am now trying to make it compatible with Ext 4.2.1 but I ran into this error:

[E] Layout run failed

Please, see the demo pages for test cases. The error is raised once for each combo, but only the first time it is expanded.

This error didn't happen with 4.2.0 (see demo page with 4.2.0). The breaking changes I had identified in 4.2.1 at the time were about the query filter, not rendering or layout... However, I have already been facing this error with 4.2.0 in a situation where the grid picker was sitting in a window, but it was in a code base with lots of overrides and that used the sandboxed version of Ext4... So I just hopped it was not coming from my component and silenced it (another demo page proves that grid picker + window is not enough to trigger the error).

The error doesn't seem to have any side effects, but it makes me feel bad.

Does anyone know what is causing that or, even better, what must be done to prevent it?

Or does someone understand Ext's layout engine well enough to give me some pieces of advice on how to track down this kind of error? Or at least give me reassurance that the error will remain harmless in any situation?

Answer 1

Actually it was the Grid panel layout that was failing, because it was set to shrink-wrap its content but there was no content at the time of the layout run. The simplest way to fix this is to set a width on the panel (which is your picker), so it won't try to shrink-wrap anymore.

See my pull request: https://github.com/rixo/GridPicker/pull/3

I would also suggest extending Picker field instead of the Combobox, the Combo does a lot of things you probably don't need. See how I dealt with that in my MultiSelect ux: https://github.com/nohuhu/Ext.ux.form.field.MultiSelect

Answer 2

I got this error when (by mistake) I changed the layout of a panel from:

layout : fit

to

layout : {
    type: 'vbox',
    align: 'stretch'
}

In some cases the panel had only one item added and in these cases the error appeared.

Hope this info to be useful for someone.