anchor warning on removal of Tabbutton from a tabBar

TabBar {
        id: tabBar
        width: 500
        height: 44
        anchors.top: parent.top
        background: Rectangle {
            color: "gray"
        }

        TabButton {
            id: defaultTab
            width: 120
            height: tabBar.height 
            anchors.top: parent.top  // If user comments this, tabbutton will not be positioned correctly.
            /** background rectangle for default tab */
            background: Rectangle {
                id: tabBackground
                border.color: (defaultTab.activeFocus ||
                               defaultTab.hovered) ?
                                  "blue" : "red"
                border.width: 1
                color: "yellow"
            }
        }
    }
    Button {
        id: button
        width: 50
        height: 50
        text: "close"
        anchors.centerIn:parent
        onClicked:{
            tabBar.removeItem(tabBar.itemAt(tabBar.currentIndex));
        }
    }

TypeError: Cannot read property 'top' of null