| <!DOCTYPE html> |
| <body> |
| <p>Check if a validation bubble is shown</p> |
| <script> |
| class MyControl extends HTMLElement { |
| static get formAssociated() { return true; } |
| |
| constructor() { |
| super(); |
| this.internals_ = this.attachInternals(); |
| } |
| get i() { return this.internals_; } |
| |
| // Must provide ‘value’ setter. |
| set value(v) {} |
| } |
| |
| customElements.define('my-control', MyControl); |
| </script> |
| <my-control title="Please specify four digits." tabindex=0>🆖</my-control> |
| <script> |
| if (window.testRunner) { |
| // Layout tree dump doesn't matter. |
| testRunner.dumpAsTextWithPixelResults(); |
| } |
| const myControl = document.querySelector('my-control'); |
| myControl.i.setValidity({patternMismatch:true}, 'The value does not match to the requested format'); |
| myControl.i.reportValidity(); |
| </script> |
| <body> |
