mousearea outside flickable not working

[joko]

Hi,

I know this is somewhat easy however I can't figure out what prevents the mousearea from working when the parent height of the flickable is less than its (flickable) content height, other than that mousearea is okay.

Item
{
    MouseArea
    {
        id: mouseArea
        anchors.fill: parent
        onClicked: { console.log("yes") }
    }
 
    Flickable
    {
        id: main
        contentHeight: 160
        anchors.fill: parent
        boundsBehavior: Flickable.StopAtBounds
        interactive: parent.height > contentHeight ? false : true
 
        Rectangle
        {
            id: body
            anchors {
                left: parent.left
                right: parent.right
            }
        }
    }
}

Item
{
    MouseArea
    {
        id: mouseArea
        anchors.fill: parent
        onClicked: { console.log("yes") }
    }

    Flickable
    {
        id: main
        contentHeight: 160
        anchors.fill: parent
        boundsBehavior: Flickable.StopAtBounds
        interactive: parent.height > contentHeight ? false : true

        Rectangle
        {
            id: body
            anchors {
                left: parent.left
                right: parent.right
            }
        }
    }
}

To copy to clipboard, switch view to plain text mode 

Thanks.