[BUG] Accessing panorama view object duplicate all onactivate events

[darkphoenics]

Hi,

I found out this weird behavior while bulding my app, here is a Minimal demonstration of the issue : 

If you access a panorama view by id via a getElementById, all the child button element onactivate (and possibly more) are duplicated.

You can see it in action with the following gist : https://gist.github.com/remygrandin/e741047c9440967851f9213c130eb5c2

If you comment the line 8 of index.js, all is fine, you press the button, the event is triggered and a line is printed in the console.

If you include this line 8, you will see that the event is now called 2 times when the button is pressed

This has been confimed both on my ionic and on the simlator.

To add the the bug report, this is while targetting SDK 4.1 in the studio. If you target SDK 4.0, the opposite happend : with the line 8, the event is not triggered at all and without it is called normally.

[JonFitbit]

It's hard to tell what's happening there, but I'd always recommend using the parent container ID. But you might also need to use the actual panorama item as the parent if you need to have multiple instances of btntest.

const hview = document.getElementById("hview");
const btntest = hview.getElementById("btntest");

btntest.addEventListener("activate", (evt) => {
  console.log("triggered");
});

[LekoFraggle]

I wonder, if you put the button in an `<SVG> </SVG>` tag would that solve the problem?  I had that happen in my panorama view.

[darkphoenics]

@JonFitbit : I tried your snippet, the double trigger is still present.

@LekoFraggle : I just tried that too, wrapping the button in a simple <svg> tag, still the same issue.

[LekoFraggle]

Actually, I just realized I am seeing the same thing.  Here is my snippet.  The whole app is a bit of a mess, but I am definitely seeing an oddity.  I wonder if there is a way to debounce it or something.

<svg>
  <use id="AddItUp" href="#square-button" y="5" fill="fb-red">
    <set href="#text" attributeName="text-buffer" to="AddItUp!" />
  </use>      
</svg>

[darkphoenics]

yeah, we can always debounce it with a settimeout and a variable, but that would men one for each and every one of the event handler, wich would be a pain. (I have like 20+ buttons in my panorama, ... 😞 )