observe document.documentElement again

lukeburns commented 6 years ago

https://github.com/shama/on-load/pull/18 was proposed back when when on-load was observing document.body and reverts https://github.com/shama/on-load/pull/34.

https://github.com/shama/on-load/pull/18 forces the user to listen for the DOMContentLoaded event before mutating the DOM if they want to observe those mutations. Before this change, the user could mutate the dom even while document.readyState was loading and observe changes without any trouble. E.g. this breaks the example in morphable which relies on on-load.

Mutating the dom while the document is still loading won't cause problems when we observe document.documentElement, because <html></html> always exists, even if the script is loaded in <head></head>.

This PR goes back to observing document.documentElement. With this change, the following works again as expected.

index.js browserified into bundle.js:

const html = require('nanohtml')
const onload = require('on-load')

document.body = onload(html`<body>hello world</body>`, () => console.log('loaded body'))

index.html:

<html>
  <head>
    <script src="bundle.js"></script>
  </head>
</html>

Note, that document.documentElement is supported even by old browsers so this approach is also less restrictive.