Failed to execute 'setAttribute' on 'Element': '-class' is not a valid attribute name.

[RedHatter]

I can't seam to get Button to work. I'm not sure if I'm just using the library wrong or if it's not working.

A very simple App.html

<Button>Test</Button>

<script>
  export default {
    components: {
      Button: 'svelte-material-components/dist/Button.js'
    }
  };
</script>

Results in the following error.

proxy.js:135 DOMException: Failed to execute 'setAttribute' on 'Element': '-class' is not a valid attribute name.
    at setAttribute (http://localhost:1234/main.ca0b3409.js:159:7)
    at setAttributes (http://localhost:1234/main.ca0b3409.js:167:71)
    at Object.c (http://localhost:1234/main.ca0b3409.js:681:4)
    at Object.c (http://localhost:1234/main.ca0b3409.js:463:13)
    at Object.c (http://localhost:1234/main.ca0b3409.js:1155:21)
    at new App (http://localhost:1234/main.ca0b3409.js:1185:18)
    at proxyComponent._register (http://localhost:1234/main.ca0b3409.js:951:28)
    at new proxyComponent (http://localhost:1234/main.ca0b3409.js:877:12)
    at Object.parcelRequire.2../App.svelte (http://localhost:1234/main.ca0b3409.js:1360:11)
    at newRequire (http://localhost:1234/main.ca0b3409.js:48:24)

[RedHatter]

The issues seems to be arising from the call to processAttributes at Button.html:40. I don't see what the processAtrributes function was intended for. All it does is pre-pend a - to the keys of an object in a convoluted way. I assume that was not the original intention?

[fjorgemota]

I answered your question on the pull request comment. I'm going to probably remove the support for custom attributes like that soon.

[fjorgemota]

I take a look on the support for custom attributes and even preact-material-components support it. So I decided to maintain the support here too.

BUT I'll probably remove that processAttributes function after sveltejs/svelte#887 be fixed. =) (or just work for replace '_' to '-' instead of camel case to '-')