How to always send group to the back

I am attempting to always render group behind all other objects. I have implemented a custom ordering provider as such:

export default class GroupOrderingProvider extends OrderingProvider {
    constructor(eventBus, canvas) {
        super(eventBus);

        this.canvas = canvas
    }

    getOrdering(element, newParent) {
        if (is(element, 'bpmn:Group')) {
            return {
                parent: this.canvas.getRootElement(),
                index: 0
            }
        }
    }
}

This however is only triggered when I move the group itself. If I move other objects on top of it, the group is not send to the back. If I then touch the group, it is.

Is the ordering provider the wrong way to go here? What would be the best way to ensure groups are always in the background?

Hi @Adrian ,

Why do you want the lane to be in the Back? Remember that Groups go above Pools and Lanes. This means that a Group can stretch across the boundaries of a Pool to surround Diagram elements.

That being said, the ordering provider would be the correct way to do it. It checks the position the element should be in when placing the element in a container. It is only called once for the element you are currently placing/moving.

Your code only overrides the result for the Group, but does not change the general priority of the group. When another Element is placed, it is checked against the list of priorities:

Sees that it should be behind the Group (priority 10) and gets assigned position 0 and placed accordingly. If you want the group to always be in the background, you need to overwrite the priorities of other elements as well.

Cheers!