tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

ElementInternals-reportValidity-delegatesFocus.html (883B)

      1 <!DOCTYPE html>
      2 <title>Custom element with delegatesFocus in Form should show validation message on focus delegated element</title>
      3 <link rel=mismatch href=ElementInternals-reportValidity-delegatesFocus-notref.html>
      4 <link rel=help href=https://html.spec.whatwg.org/C/#report-validity-steps>
      5 
      6 <form>
      7 <input-custom-element></input-custom-element>
      8 </form>
      9 
     10 <script>
     11 class InputCustomElement extends HTMLElement {
     12  constructor() {
     13    super();
     14 
     15    this.attachShadow({
     16      mode: "open",
     17      delegatesFocus: true
     18    });
     19    this.shadowRoot.innerHTML = '<input>';
     20    this.elementInternals = this.attachInternals();
     21    this.elementInternals.setValidity({valueMissing: true}, 'value missing');
     22  }
     23 
     24  static get formAssociated() {
     25    return true;
     26  }
     27 }
     28 
     29 customElements.define("input-custom-element", InputCustomElement);
     30 
     31 document.querySelector("form").reportValidity();
     32 
     33 </script>