About the Demo (Updated 1/4)

1/4 Update -> Both components now have tabindex being set in the constructor. This causes failures on 71+. Previous version of this Demo was only tested on chrome 64 and did not fail on 71+. Now that the code is updated, Test procedure has also been modified slightly as observed behaviours changed.

All of these instructions can be minimized with the Toggle Instructions button

This demo has 2 instances each of 2 components.
chromium-test-shadow has our reproducer code within shadowDom.
chromium-test-html has our reproducer code within regular html (not shadowDom)
Each of these components has 2 examples below. One where a function is passed in via value property, and one where it is not.
There is a Refresh Demo button up top to reload the page in a clean slate, since this page may be statically hosted without fallbacks for history API, so this is a convience and alternative to hitting the browser refresh button.
At the bottom, there is a button to Call __gCrWeb.message.getMessageQueue. The current observation is that if an "error" state is entered, calling this function will typically clear the errors from happening.

Test Code

Each component test below has 5 buttons which perform the same action across all examples.

Test Procedure (For chrome 71+)

In order to reproduce, here are a few observations noted from playing
(note: Refreshing between tests is recommended, but you can also play with the getMessageQueue function to reset states - this seems to work reliably)

Conclusions

In conclusion the following is noted

Reproducer / Demo

1) Component with ShadowRoot ✅ and passing in function ✅

2) Component without ShadowRoot ❌ and passing in function ✅


3) Component with ShadowRoot ✅ and not passing in function ❌

4) Component without ShadowRoot ❌ and not passing in function ❌


In order prevent further exceptions once they have occured, click this button

Logs will be printed below (latest first)