testing/web-platform/tests/css/selectors/selector-placeholder-shown-emptify-placeholder.html

   1 <!DOCTYPE html>
   2 <title>When non-empty placeholder becomes empty, :placeholder-shown test</title>
   3 <script src="/resources/testharness.js"></script>
   4 <script src="/resources/testharnessreport.js"></script>
   5 <link rel="help" href="https://drafts.csswg.org/selectors-4/#placeholder">
   6 <input id="myinput" type="text" placeholder="FAIL">
   7 <textarea id="mytextarea" placeholder="FAIL"></textarea>
   8 <script>
   9 test(() => {
  10   const input = document.querySelector("input");
  11   input.placeholder = "";
  12   input.value = "NO RED";
  13   assert_false(input.matches(":placeholder-shown"));
  14 }, "input:placeholder-shown should not be matched");
  15
  16 test(() => {
  17   const textarea = document.querySelector("textarea");
  18   textarea.placeholder = "";
  19   textarea.value = "No RED";
  20   assert_false(textarea.matches(":placeholder-shown"));
  21 }, "textarea:placeholder-shown should not be matched");
  22 </script>