Did listeners on panel in Ext JS 5 depends on the panel content?

Question

I wan't to detect 'pinch' event on a Extjs 5 Panel, if I load the panel content using loader property it's working, but if I put an item (Iframe) in the panel, it doesn't work

Panel with an item (IFrame):

Ext.create('Ext.panel.Panel', {
        layout: 'fit',
        autoScroll: true,
        items: [
            Ext.create('Ext.ux.IFrame', {
                autoScroll: true,
                src: 'resources/docs/doc1.html',
                cls: 'iframeStyle'
            })
        ],
        listeners: {
            pinch: function (event) {
                alert('pinch event');
            },
            element: 'body'
        }
    })

Panel that the content was loaded using loader property

Ext.create('Ext.panel.Panel', {
        layout: 'fit',
        loader: {
            url: 'resources/docs/doc1.html',
            autoLoad: true
        },
        listeners: {
            pinch: function (event) {
                alert('pinch event');
            },
            element: 'body'
        }

    })

Can you explain me the difference, and why with an IFrame it doesn't work?? Thank you