[webcomponents] defined promise (#427)

Following from #425.

The `:defined` pseudo allows basic styling before an element becomes defined, such as reserving space for the element. However, that isn't always sufficient, and it feels like an extensible web violation to be able to react to upgrades via CSS but not via script.

A property that resolves once an element is defined is a more extensible system. Could/should this be a static property on the class?

## I don't want my element to be defined ahead of elements it uses in its shadow

```js
Promise.all([
  Foo.defined,
  Bar.defined,
  Whatever.defined
]).then(() => {
  document.defineElement('my-element', MyElement);
});
```

## I don't want to show an article until all custom elements have defined

```js
fetch(articleURL).then(r => r.text()).then(text => {
  articleContainer.innerHTML = text;
  return Promise.all(
    [...articleContainer.querySelectorAll(':not(:defined)')]
      .map(el => el.constructor.defined)
  );
}).then(showArticle);
```

---
Reply to this email directly or view it on GitHub:
https://github.com/w3c/webcomponents/issues/427