Dart, why does using innerHtml to set shadow root content work but appendHtml doesn't?

Question

I have made this Gist to show the issue but essentially I have found that using shadowRoot.innerHtml = '...' works but using shadowRoot.appendHtml('...') doesn't work, it causes the console warning Removing disallowed element <STYLE> which I can't explain. Anyone know if this is simple the way it is meant to be or is it specific to Dart?

Answer 1

Removing disallowed element indicates that you need a NodeValidator.

shadowRoot.append(
    new document.body.createFragment('....'), 
    validator: new NodeValidationBuilder().allow(...);