When dom-repeat is used with chunked rendering, it schedules a requestAnimationFrame which is not cancelled when the element is disconnected from the DOM. As a result, even after the component is detached from the DOM, it keeps running code.
No RAF should have been printed after the component is detached
Actual Results
There is at least a couple more.
Browsers Affected
[X] Chrome
[ ] Firefox
[ ] Edge
[ ] Safari 11
[ ] Safari 10
[ ] IE 11
I only tested on Chrome, but looking at the implementation of dom-repeat it should affect all of them.
Versions
Polymer: 2.8.0 and 3.4.1
webcomponents: v1
Potential fix
Adding cancelAnimationFrame(this.__chunkingId); to disconnectedCallback in dom-repeat.js seems to resolve the issue, but I don't know what other consequences that could have.
Description
When
dom-repeatis used with chunked rendering, it schedules arequestAnimationFramewhich is not cancelled when the element is disconnected from the DOM. As a result, even after the component is detached from the DOM, it keeps running code.Live Demo
https://jsbin.com/sirelojane/1/edit?html,console,output
Steps to Reproduce
Run the script, look at the console.
Expected Results
No
RAFshould have been printed after the component is detachedActual Results
There is at least a couple more.
Browsers Affected
I only tested on Chrome, but looking at the implementation of
dom-repeatit should affect all of them.Versions
Potential fix
Adding
cancelAnimationFrame(this.__chunkingId);todisconnectedCallbackin dom-repeat.js seems to resolve the issue, but I don't know what other consequences that could have.