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.
- a) Will fire a regular change event on the component
- b) Will fire a change event with composed/bubbles on the component
- c) Will will run our test which will either log succesfully or log exception message and strack trace
- d) Will will run (a) and then (c) syncronously
- e) Will will run (b) and then (c) syncronously
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)
- In Examples (1) and (2), Click (a) then click (c) and the test will fail
- In Examples (1) and (2), Click (b) then click (c) and the test will fail
- In Examples (1) and (2), Click (d) TWO times and the test will fail
- In Examples (1) and (2), Click (e) TWO times the test will fail
- In Examples (3) and (4), no actions will fail the test from a clean slate
- In Examples (3) and (4), and having already caused a failure followig one of the above steps, clicking (c), (d), or
(e) will cause a failure
- For all examples, provoking a failure will cause (c) to always fail for all examples
- For all examples, after provoking a failure, clicking the _gCrWeb.message.getMessageQueue function will return force
all examples to work the same as a clean slate
- After calling _gCrWeb.message.getMessageQueue, attempting to cause failures following
the above steps may not cause failures any longer
Conclusions
In conclusion the following is noted
- No differences between shadow and non shadow components in v71+
- Test procuedure slighty different in chrome 64 vs chrome 71+
this.setAttribute('tabindex',0) is required in chrome 71+
- change event dispatch and function passed to
component (or parent / ancestor) required to reproduce bug