event.stopPropagation() works for pointerdown but not for pointer up

I was reading over this issue from github , and was able to fix my main problem using event.stopPropagation(). (Main issue was being able to click things through my UI)

However using event.stopPropagation only seems to work for pointerdown events and not pointerup events? If I change the listener attached to the layer variable to pointerup instead of pointerdown I am still able to call the this.getCoordinates callback function. Has anyone experienced this?

create(){
  var layer;
  
  for(var i = 0; i < map.layers.length; i++) {
      layer = map.createLayer(i , map.tilesets[0]);
  } 
        
  layer.setInteractive()
  layer.addListener('pointerdown' , this.getCoordinates , this)
 // If the above line is pointerup , this.getCoordinates still gets called!

//...

this.element = this.add.dom(screenCenterX,200).createFromCache('nameform');

this.element.addListener('mousedown')
this.element.addListener('mousup')

this.element.on('mousedown', function (event) {
    event.stopPropagation();
});

this.element.on('mouseup', function (event) {
     event.stopPropagation();
}); 
//...





}

I am currently using Version 3.55.2

layer.addListener('pointerup', function (pointer) {
  const { type, target, currentTarget } = pointer.event;

  console.log(type, target, currentTarget);
}