Runtime created elements (button) do not processed (from Dart)

[VladimirCores]

Expected Behavior

Runtime added buttons show correct styling

Actual Behavior

Runtime created buttons stay the same as default browser <button ...>

Reproduce Scenario (including but not limited to)

Repo: https://github.com/DQvsRA/Wire
Example: Counter (web)
See: example/counter/web/components/counter_button.dart

Steps to Reproduce

1. Clone repo
2. Open in IntelliJ IDEA
3. Create build configuration - Dart Web
4. Add path to example/counter/index.html
5. Debug

Browser name/version/os (ie Chrome Version 62.0.3202.94 (Official Build) (64-bit) MacOS)

Any browser

Coral Spectrum version

I use: https://opensource.adobe.com/coral-spectrum/dist/playground/dist/css/coral.css

Sample Code that illustrates the problem (use the Playground if possible)

It works in playground with JS: https://opensource.adobe.com/coral-spectrum/dist/playground/#?livereload=true&screen=vertical&code=MTczLDE0Niw2MSw3OSw0LDMzLDE2LDEzNCwyMzUsMjE5LDk1LDEyOSw4OCwyMzYsMTUzLDIzMiwyMTAsMjcsMTE4LDE5LDE5MSwxMCwxMSw2MywxOCwxMDksNDQsODksMjQsMTExLDgxLDE0LDg2LDEwMiwyNDYsMjQ0LDI1MiwyNDUsMTk0LDIyNSwyNDksMTcsMTQxLDE0OSwyMTMsNDgsMjA0LDE5NSw1OSwyNDMsMiwxMTQsMjMxLDI0NCwyMzQsMjI4LDI0NiwyMzgsMjUwLDE0MCwxMywxODAsMTE2LDkzLDM3LDE4MywxLDE0OCwyMzMsNDIsMTk4LDE2NCwxNzksMjU0LDE0NSw2OSwxMTIsNDUsNzEsOTAsNTksMTkyLDEsMTI4LDU2LDI3LDM0LDIyMCwxODMsMTI0LDMyLDI2LDI0MSw4MCwxMzYsNDgsMTMwLDE5OSw0OCw2OSwxMywxNDEsNTAsMTYxLDEzNSw3MCwxMzUsMTY1LDIwOCwzMyw0MiwxMTksMTI4LDM1LDEwNCwxMzgsMjExLDgyLDI0LDEzOSwzNiw3MCwxNjcsMjE0LDEzOSwyNCwzOCwxMTEsNzQsMTc0LDE3LDExLDIxNSwxNjQsMjEsMjMsMTU1LDEzNCwxNjgsMTYzLDI5LDEzNyw5NywyMTIsMjU1LDIwOCwyMjQsOTcsMTcxLDI1NSwxMjgsMTg4LDE0NywxNjIsMTA0LDM5LDEyMywxNjIsMjQ4LDE0NywxMjUsNDgsMTA3LDE2NiwxNTcsNjYsMTA4LDEyMSwyMDksNTksMTEyLDExOCw0OSwxNiwyMTksMzgsNDIsNDYsMTI4LDExOSwyMTMsNzYsMjYsMTg3LDI1MCw0LDYxLDQxLDIzNSwzMywxMTQsMTAyLDc3LDIwMyw5OSw4LDE0OCwxNDUsMTUzLDIzNiwzOSwxNjIsMjI0LDE1MywyNTMsMTYsNDMsMjcsMTg4LDU5LDI0Nyw1OCwxMzAsNjYsMTQ0LDE2MiwyMzYsMjUyLDc3LDE1OSwxOTQsMTUsOTAsMzgsNTksMTcxLDYwLDExOSwzMCw1NiwxOTcsMTczLDE0NSwyMTcsNzQsNjksMjMwLDEyMywyMTQsNTAsMTksMjQ0LDE4MCw0LDc5LDc3LDYyLDc1LDExMiwyMzAsMzIsMTAzLDI0MywxODYsNzIsMjEyLDEyMywyMTMsMjA0LDI0NywxMyw4OSwxMTQsMTQ0LDk2LDEyNiw5LDIwNywyMzYsMTg0LDE4MCwyMTksMjAsMTcyLDc5LDExOCwxMTAsMjI1LDEzMywxMjYsNDMsMzQsMjA4LDE3LDgxLDE4MCw3MywxMCwyMzAsMTgxLDE5NywxMjIsMTU5LDIxMyw5NSwzOSwxMjYsMjMsMjU1LDE0MiwxNjUsMTkzLDE3MiwyNDIsMTQ4LDg5LDMsMjQ3LDEwNiwxMTQsMjQ0LDQzLDEzNCwyNDYsMjEsNTAsMTE1LDE0NSwxNzEsMjE3LDc2LDE5MCwyMDUsMTc1LDExOCwxNTgsMzgsMTM2LDIzNSwyNywxMTIsMjMzLDE0OSw2NywxNTYsMjE1LDE4NywxODUsMTU4LDIxNywyOCwyNyw1MywxNjYsMTQzLDk3LDIzMCwxOTAsMjIzLDE3MSwxOTAsNjEsMjM4LDIzMCwxNSwxOTEsMQ==&

Screenshots (if applicable)

[icaraps]

@DQvsRA Please use document.createElement('button', {is: 'coral-button'}) to instantiate the button see document.createElement API and examples https://developer.mozilla.org/en-US/docs/Web/API/Document/createElement#Web_component_example

[VladimirCores]

@icaraps in the attached Playground it works with later defining button properties, same as I do in the Dart example:

var nb = document.createElement('button')
nb.title = "New Button"
nb.innerText = "New Button"
nb.setAttribute('is', 'coral-button')
nb.setAttribute('variant', 'default')
nb.setAttribute('size', 'M')
var root = document.querySelector('#root')
root.append(nb)

[VladimirCores]

I extracted example into separate branch - https://github.com/DQvsRA/Wire/tree/examples/counter-coral