Strange ListModel insert() method behaviour

import QtQuick 2.0
import QtQml.Models 2.1

Rectangle {
    id: scene
    width: 300
    height: 360

    GridView {
        id: root
        anchors.fill: parent
        cellWidth: 100; cellHeight: 100

        displaced: Transition {
            id: gridTransition;
            NumberAnimation { properties: "x,y"; easing.type: Easing.OutQuad }
        }

        add: Transition {
            NumberAnimation { id : addAnimX; properties: "x"; easing.type: Easing.OutQuad }
            NumberAnimation { id : addAnimY; properties: "y"; easing.type: Easing.OutQuad }
        }

        property bool ctrl: false
        property bool disabled: false

        focus : true
        Keys.onPressed: {
            if (event.key === Qt.Key_Control)
                ctrl = true;
            else if (event.key === Qt.Key_Alt)
                disabled = !disabled;
        }

        Keys.onReleased: {
            if (event.key === Qt.Key_Control)
                ctrl = false;
        }

        DropArea {
            id : gridDrop
            anchors { fill: parent; }

            property bool disabled: false

            onPositionChanged:  {
                if (drag.source.groupId !== 1111 || root.disabled)
                    return
                var x = drag.x + root.contentX;
                var y = drag.y + root.contentY;
                var effectiveWidth =  Math.floor(root.width / root.cellWidth) * root.cellWidth;
                if (x >= effectiveWidth)
                    x = effectiveWidth - 1;
                var index = root.indexAt(x, y);
                if (index === -1)
                    index = root.count - 1;
                visualModel.items.move(drag.source.visualIndex, index);
            }
        }

        model: DelegateModel {
            id: visualModel
            model: ListModel {
                id: colorModel
                ListElement { color: "blue" }
                ListElement { color: "green" }

            }
            delegate: MouseArea {
                id: delegateRoot

                property int visualIndex: DelegateModel.itemsIndex
                property int groupId: 1111

                width: root.cellWidth; height: root.cellHeight
                drag.target: icon

                onClicked: {
                    console.log("My index is:",visualIndex)
                }

                Rectangle {
                    id: icon
                    width: delegateRoot.width - 8; height: delegateRoot.height - 8
                    anchors {
                        horizontalCenter: parent.horizontalCenter;
                        verticalCenter: parent.verticalCenter
                    }
                    color: model.color
                    radius: 7

                    Text {
                        id: id
                        text: delegateRoot.visualIndex + 1
                        anchors.top: parent.top
                        anchors.left: parent.left
                        anchors.topMargin: 7
                        anchors.leftMargin: 7
                    }

                    Drag.active: delegateRoot.drag.active
                    Drag.source: delegateRoot
                    Drag.hotSpot.x: 36
                    Drag.hotSpot.y: 36

                    states: [
                        State {
                            when: icon.Drag.active
                            ParentChange {
                                target: icon
                                parent: root
                            }

                            AnchorChanges {
                                target: icon;
                                anchors.horizontalCenter: undefined;
                                anchors.verticalCenter: undefined
                            }
                            StateChangeScript {
                                script: {
                                    if (!root.ctrl)
                                        return;
                                    var color = icon.color;
                                    addAnimX.from = delegateRoot.x
                                    addAnimY.from = delegateRoot.y
                                    console.log("Creating copy at index",delegateRoot.visualIndex + 1)
                                    colorModel.insert(delegateRoot.visualIndex + 1, { color: color.toString() });
                                }
                            }
                        }
                    ]
                }
            }
        }
    }
}