Bug: Error this.resumeFrames is not a function when reattached to DOM

[johnemau]

Reproduction steps:

1. Go to https://unpkg.com/[email protected]/demo/demo-01.html
2. Open the browser DevTools (F12 / Context menu -> Inspect)
3. Run the following in the DevTools Console document.body.append(document.querySelector('progress-ring'))

Expect:
No error

Actual:

TypeError: this.resumeFrames is not a function
    at a.connectedCallback (p-2ec5f97f.entry.js:1:7049)
    at A (p-bc0fba79.js:1:4729)
    at q (p-bc0fba79.js:1:5837)
    at p-bc0fba79.js:1:6407
    at p-bc0fba79.js:1:7104
    at Object.jmp (p-bc0fba79.js:1:107)
    at a.connectedCallback (p-bc0fba79.js:1:6341)
    at <anonymous>:1:15

This might be a bug with stencil, I am not familiar with their component lifecycle, but somehow the resumeFrames function is null when the components connectedCallback is invoked.

I assume that disconnecting the component from the DOM somehow clears the resumeFrames reference without reseting the isLoaded state, so when we reattach to the DOM the component is in a bad state.

[johnemau]

Although the reproduction steps may seem convoluted, they are really just an easy minimum reproduction. I encountered this issue when manipulating a list of <progress-ring>'s and needing to move a component from one positing in the list to another by changing it's DOM position.

[taisuke-j]

@johnemau Please let me know if the issue still persists with 1.0.35.