| <!DOCTYPE HTML> |
| <title>:valid and :invalid pseudo-class on output element</title> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| |
| <output id='output_test'></output> |
| |
| <script> |
| |
| test(() => { |
| let output = document.getElementById("output_test"); |
| assert_false(output.matches(":valid"), "should not match :valid pseudo-class"); |
| assert_false(output.matches(":invalid"), "should not match :invalid pseudo-class"); |
| |
| output.setCustomValidity("custom error"); |
| assert_equals(output.validationMessage, "", "should not have a validation message"); |
| assert_true(output.validity.customError, "should have a custom error"); |
| assert_false(output.validity.valid, "should not be valid with a custom error"); |
| assert_false(output.matches(":valid"), "should still not match :valid pseudo-class"); |
| assert_false(output.matches(":invalid"), "should still not match :invalid pseudo-class"); |
| }, ":valid and :invalid pseudo-class on output element") |
| |
| </script> |