Can custom elements' attributes be camelCased?

Question

I have a custom element with attributes:

class MyElement extends HTMLElement {
    ...
    static get observedAttributes() {
        return ["camelCaseAttribute"];
    }

    set camelCaseAttribute(a) {
        this._a = a;
    }
    ...
 }

I use it in my HTML like so:

<my-element camelCaseAttribute="blubb"></my-element>

The attribute camelCaseAttribute is not set when writing it in camelCase, but writing it without upper-case-letters works. Why?

Answer 1

In the HTML Living Standard, Section 4.13.3 Core Concepts:

4.13.3 Core concepts

Any namespace-less attribute that is relevant to the element's functioning, as determined by the element's author, may be specified on an autonomous custom element, so long as the attribute name is XML-compatible and contains no ASCII upper alphas. The exception is the is attribute, which must not be specified on an autonomous custom element (and which will have no effect if it is).

It is defined in the HTML Living Standard that a custom element's namespace-less attributes must be XML-compatible with no ASCII uppercase letters, thus your attributes cannot be camelCased.