Re: [custom-elements] Invoking lifecycle callbacks before invoking author scripts

> On Feb 24, 2016, at 9:06 PM, Elliott Sprehn <esprehn@chromium.org> wrote:
> 
> Can you give a code example of how this happens?

For example, execCommand('Delete') would result in sequentially deleting nodes as needed.
During this compound operation, unload events may fire on iframes that got deleted by this operation.

I would like components to be notified that they got removed/disconnected from the document
before such an event is getting fired.

```html
<script>

ElementWithInDocumentFlag extends HTMLElement {
  constructor(...args) {
     super(...args);
     this.inDocument = false;
  }

  connectedWithDocument() {
     this.inDocument = true;
  }

  disconnectedWithDocument() {
     this.inDocument = false;
  }
}

document.defineElement('hello-world', ElementWithInDocumentFlag);

</script>
<div id="editor" contenteditable>
  <hello-world></hello-world>
  <iframe src="about:blank"></iframe>
  sucks
</div>
<script>

var helloWorld = document.querySelector('hello-world');
var container = document.getElementById('editor');

setTimeout(function () {
  document.querySelector('iframe').contentWindow.onunload = function () {
    console.log(container.innerHTML); // This does not contain hello-world
    console.assert(!helloWorld.inDocument); // This should be false!
  }
  container.focus();
  getSelection().selectAllChildren(container);
  setTimeout(function () {
    document.execCommand('Delete');
  }, 500);
}, 500);

</script>
```

- R. Niwa

Received on Friday, 26 February 2016 23:10:20 UTC