ListView or Flow add animation gets stuck on remove

import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3

ApplicationWindow {
    visible: true
    width: 640
    height: 480

    Component.onCompleted: stateGroup.state = "scenario"

    ColumnLayout {
        anchors.fill: parent

        Flow {
            Layout.fillWidth: true
            Layout.fillHeight: true
            Layout.preferredHeight: 0

            add: Transition {
                NumberAnimation { properties: "scale"; from: 0.3; to: 1; duration: 3000 }
            }
            move: Transition {
                NumberAnimation { properties: "x,y"; duration: 1000 }
            }

            Repeater {
                model: listModel

                Rectangle {
                    id: rectangle

                    implicitWidth: 200
                    implicitHeight: 60
                    border.color: "black"
                    border.width: 3
                    color: colorName

                    Text {
                        x: 5
                        y: 5
                        text: "%1 scale: %2".arg(index).arg(rectangle.scale)
                    }
                }
            }
        }
        ListView {
            Layout.fillWidth: true
            Layout.fillHeight: true
            Layout.preferredHeight: 0

            add: Transition {
                NumberAnimation { properties: "scale"; from: 0.3; to: 1; duration: 3000 }
            }
            move: Transition {
                NumberAnimation { properties: "x,y"; duration: 1000 }
            }
            model: listModel
            delegate: Rectangle {
                id: rectangle

                implicitWidth: 200
                implicitHeight: 60
                border.color: "black"
                border.width: 3
                color: colorName

                Text {
                    x: 5
                    y: 5
                    text: "%1 scale: %2".arg(index).arg(rectangle.scale)
                }
            }
        }
    }

    ListModel {
        id: listModel

        dynamicRoles: true
    }
    StateGroup {
        id: stateGroup

        states: [
            State {
                name: "scenario"
            }
        ]
        transitions: [
            Transition {
                to: "scenario"

                SequentialAnimation {
                    PauseAnimation { duration: 1000 }
                    ScriptAction { script: listModel.append({colorName: "#4CAF50"}) }
                    PauseAnimation { duration: 1000 }
                    ScriptAction { script: listModel.append({colorName: "orange"}) }
                    PauseAnimation { duration: 1000 } //Change it to 4000 that works
                    ScriptAction { script: listModel.remove({colorName: "#673AB7"}) }
                    PauseAnimation { duration: 1000 }
                    ScriptAction { script: listModel.append({colorName: "#CDDC39"}) }
                    PauseAnimation { duration: 1000 }
                    ScriptAction { script: listModel.append({colorName: "#F48FB1"}) }
                }
            }
        ]
    }
}