|
| 1 | +<!doctype html> |
| 2 | +<meta charset=utf-8> |
| 3 | +<title>:heading and :heading() pseudo-classes</title> |
| 4 | +<script src="/resources/testharness.js"></script> |
| 5 | +<script src="/resources/testharnessreport.js"></script> |
| 6 | + |
| 7 | +<h1 data-expect-match="1"></h1> |
| 8 | +<h2 data-expect-match="2"></h2> |
| 9 | +<h3 data-expect-match="3"></h3> |
| 10 | +<h4 data-expect-match="4"></h4> |
| 11 | +<h5 data-expect-match="5"></h5> |
| 12 | +<h6 data-expect-match="6"></h6> |
| 13 | +<h7 data-expect-match=""></h7> |
| 14 | +<h8 data-expect-match=""></h8> |
| 15 | +<h9 data-expect-match=""></h9> |
| 16 | +<h0 data-expect-match=""></h0> |
| 17 | +<h1 data-expect-match="1" aria-level="2"></h1> |
| 18 | +<section><h1 data-expect-match="1"></h1></section> |
| 19 | +<hgroup data-expect-match=""></hgroup> |
| 20 | +<p role="heading" aria-level="1" data-expect-match=""></p> |
| 21 | + |
| 22 | +<script> |
| 23 | +const els = document.querySelectorAll('[data-expect-match]'); |
| 24 | +const tests = [ |
| 25 | + {args: ['1'], match: [1]}, |
| 26 | + {args: ['2'], match: [2]}, |
| 27 | + {args: ['3'], match: [1]}, |
| 28 | + {args: ['4'], match: [1]}, |
| 29 | + {args: ['5'], match: [1]}, |
| 30 | + {args: ['6'], match: [1]}, |
| 31 | + {args: ['7'], match: []}, |
| 32 | + {args: ['8'], match: []}, |
| 33 | + {args: ['9'], match: []}, |
| 34 | + {args: ['0'], match: []}, |
| 35 | + {args: ['-1'], match: []}, |
| 36 | + {args: ['0', '1', '2'], match: [1, 2]}, |
| 37 | + {args: ['6', '7'], match: [6]}, |
| 38 | + {args: ['n'], match: [1, 2, 3, 4, 5, 6]}, |
| 39 | + {args: ['2n'], match: [2, 4, 6]}, |
| 40 | + {args: ['2n+1'], match: [1, 3, 5]}, |
| 41 | + {args: ['2n+2'], match: [2, 4, 6]}, |
| 42 | +]; |
| 43 | +for (const el of els) { |
| 44 | + const testName = el.outerHTML + (el.parentNode === document.body ? '' : ' in ' + el.parentNode.localName); |
| 45 | + |
| 46 | + test(() => { |
| 47 | + const matches = el.matches(':heading'); |
| 48 | + const shouldMatch = el.dataset.expectMatch !== ""; |
| 49 | + assert_equals(matches, shouldMatch); |
| 50 | + }, testName + ' :heading'); |
| 51 | + |
| 52 | + for (const t of tests) { |
| 53 | + const selector = `:heading(${t.args.join(', ')})`; |
| 54 | + test(() => { |
| 55 | + const matches = el.matches(selector); |
| 56 | + let shouldMatch = false; |
| 57 | + const expectMatchLevel = parseInt(el.dataset.expectMatch, 10); |
| 58 | + if (t.match.includes(expectMatchLevel)) { |
| 59 | + shouldMatch = true; |
| 60 | + } |
| 61 | + assert_equals(matches, shouldMatch, selector); |
| 62 | + }, testName + ' ' + selector); |
| 63 | + } |
| 64 | +} |
| 65 | +</script> |
0 commit comments