Thank you for reporting this bug. We will make it our priority to review this report.
Different iFrame collapsing ComboBox
Version(s) of Ext GWT
ExtJS 4.1.0 GPL
Browser versions and OS
(and desktop environment, if applicable)
· Internet Explorer 8 & 9, Chrome, FireFox - Win7x64
I have a page with a non-editable ComboBox in a html which is inside a frame and I call that as Frame A on top of the page and inside a viewport, and below that is another frame with another html(hosts the page in an iFrame internally). If I expand the ComboBox, then click somewhere inside the iFrame, the ComboBox does not collapse. If I click next to the ComboBox, it collapses as expected.
Steps to reproduce the problem
1. Create a page with a non-editable ComboBox and a control that uses an iFrame
2. Expand the ComboBox
3. Click inside the iFrame
The ComboBox collapses when it is blurred.
The blur focus hilight inside the ComboBox changes to gray, but the drop-down does not collapse when click not in the top frame.
Debugging already done
The NativePreviewEvent that the TriggerFieldCell is watching but does not fire when clicking inside a different iFrame.
Not sure if this is even possible? But it is definitely a bug for our users, who don't know or care about what we're hosting in an iFrame and what we're not. If it can't be solved for the iFrame case, is there any alternative to an iFrame we could use to host other pages that will give us blur events properly?
Took a example from previous ExtJS version which is still occurring now.
As shown in the image, I click the combobox and it collapse, and i can click on the left frame text which does not trigger the combobox to collapse. but once i click on the center frame it will collapse the combobox.
Tested in 4.1 API Example, it happen too when you click the top combobox "Sencha Doc"
and click the center example, i choose combobox example. "Sencha Doc" combobox not collapsed.
So the ComboBox is outside the iframe but you click in the iframe? That's because technically the click isn't on the top level document.body