Studio Niantic: Cleaning Up Listeners for button UI

Technical Support
1

Hi everyone!
I don’t see any mention of cleaning up listeners for the UI events in this link: Events | 8th Wall
Do I need to clean up the Listeners for the button? Specifically, this is the code I use to create the button

function createButton(imageSrc, top, bottom, left, right, width) {
  const button = document.createElement('button')
  button.style.position = 'absolute'
  if (top !== 0) {
    button.style.top = `${top}%`
  }
  if (bottom !== 0) {
    button.style.bottom = `${bottom}%`
  }
  if (left !== 0) {
    button.style.left = `${left}%`
  }
  if (right !== 0) {
    button.style.right = `${right}%`
  }
  button.style.width = `${width}%`
  button.style.height = 'auto'
  button.style.backgroundColor = 'transparent'
  button.style.border = 'none'
  button.style.outline = 'none'
  button.style.padding = '0'
  // button.style.cursor = 'pointer'
  button.style.zIndex = '1000'

  const img = document.createElement('img')
  img.src = imageSrc
  img.style.width = '100%'
  img.style.height = '100%'
  img.style.objectFit = 'contain'

  button.appendChild(img)
  return button
}

....

const PlayerStatsManager = ecs.registerComponent({
  name: 'PlayerStatsManager',
  schema: {
  ....
  },
 add: (world, component) => {
// ---------------------------- CREATE BUTTON UI ----------------------------
// Create back button
    btnBack = createButton(GetAssetUrl(9), 6.2, 0, 2, 0, 7.5)

const handleBackBtnClick = () => {
      world.events.dispatch(world.events.globalId, 'LowFreEvent', {eventType: 'pause', type: 0})
      btnBack.remove()
      btnBack = null
      console.log('btnBack was clicked')
    }

    // -------------------------------- HANDLE EVENT --------------------------------
    btnBack.addEventListener('touchstart', handleBackBtnClick)
},
2

Because it’s an HTML button the browser should clean up the events itself. You only need to manually cleanup events registered with ecs.

3

Thanks for your support