OLD | NEW |
| 1 <!-- Based on compositing/overflow/text-match-highlight.html --> |
1 <!DOCTYPE HTML> | 2 <!DOCTYPE HTML> |
2 <script src="../../fast/repaint/resources/text-based-repaint.js"></script> | 3 <script src="resources/paint-invalidation-test.js"></script> |
3 <script> | 4 <script> |
| 5 if (window.testRunner) |
| 6 testRunner.dumpAsTextWithPixelResults(); |
| 7 |
4 function highlightRange(id, start, end, active) { | 8 function highlightRange(id, start, end, active) { |
5 var range = document.createRange(); | 9 var range = document.createRange(); |
6 var elem = document.getElementById(id).firstChild; | 10 var elem = document.getElementById(id).firstChild; |
7 range.setStart(elem, start); | 11 range.setStart(elem, start); |
8 range.setEnd(elem, end); | 12 range.setEnd(elem, end); |
9 internals.addTextMatchMarker(range, active); | 13 internals.addTextMatchMarker(range, active); |
10 } | 14 } |
11 function repaintTest() { | 15 window.expectedPaintInvalidationObjects = [ |
| 16 "LayoutText #text", |
| 17 "InlineTextBox 'findme'", |
| 18 "LayoutText #text", |
| 19 "InlineTextBox 'findme'", |
| 20 "LayoutText #text", |
| 21 "InlineTextBox 'findme'", |
| 22 "LayoutText #text", |
| 23 "InlineTextBox 'findme'", |
| 24 "LayoutText #text", |
| 25 "InlineTextBox 'findme'", |
| 26 "LayoutSVGInlineText #text", |
| 27 "InlineTextBox 'Can you findme in this boring text?'", |
| 28 "LayoutSVGInlineText #text", |
| 29 "InlineTextBox 'Findme in a typewriter!'", |
| 30 "LayoutSVGInlineText #text", |
| 31 "InlineTextBox 'Findme on a path! Did you findme?'", |
| 32 ]; |
| 33 function paintInvalidationTest() { |
12 highlightRange('1', 0, 6, false); | 34 highlightRange('1', 0, 6, false); |
13 highlightRange('2', 0, 6, false); | 35 highlightRange('2', 0, 6, false); |
14 highlightRange('3', 0, 6, false); | 36 highlightRange('3', 0, 6, false); |
15 highlightRange('4', 0, 6, false); | 37 highlightRange('4', 0, 6, false); |
16 highlightRange('5', 0, 6, false); | 38 highlightRange('5', 0, 6, false); |
17 highlightRange('svg1', 8, 14, true); | 39 highlightRange('svg1', 8, 14, true); |
18 highlightRange('svg2', 0, 6, false); | 40 highlightRange('svg2', 0, 6, false); |
19 highlightRange('svg3', 0, 6, false); | 41 highlightRange('svg3', 0, 6, false); |
20 highlightRange('svg3', 26, 32, false); | 42 highlightRange('svg3', 26, 32, false); |
21 internals.setMarkedTextMatchesAreHighlighted(document, true); | 43 internals.setMarkedTextMatchesAreHighlighted(document, true); |
22 } | 44 } |
23 if (window.internals) | 45 if (window.internals) |
24 onload = runRepaintTest; | 46 onload = runPaintInvalidationTest; |
25 </script> | 47 </script> |
26 <style> | 48 <style> |
27 body { margin: 0 } | 49 body { margin: 0 } |
28 </style> | 50 </style> |
29 Based on svg/custom/text-match-highlight.html. Here run it as a repaint test to
check correctness of invalidation.<br> | 51 Based on svg/custom/text-match-highlight.html. Here run it as a repaint test to
check correctness of invalidation.<br> |
30 Automatic test requires run-layout-test. To manually test, open this file in Chr
ome and find 'findme' in the page.<br> | 52 Automatic test requires run-layout-test. To manually test, open this file in Chr
ome and find 'findme' in the page.<br> |
31 There should be 9 highlighted instances of "<span id="1">findme</span>". The 6th
higlighted instance should be active.<br> | 53 There should be 9 highlighted instances of "<span id="1">findme</span>". The 6th
higlighted instance should be active.<br> |
32 <div style="overflow: scroll; height: 500px"> | 54 <div style="overflow: scroll; height: 500px"> |
33 Lorum ipsum <span id="2">findme</span> lorum ipsum <span id="3">findme</span><
span id="4">findme</span> lorum.<br/> | 55 Lorum ipsum <span id="2">findme</span> lorum ipsum <span id="3">findme</span><
span id="4">findme</span> lorum.<br/> |
34 longtext<span id="5">findme</span>noyou.<br/> | 56 longtext<span id="5">findme</span>noyou.<br/> |
35 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xl
ink" width="450" height="300"> | 57 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xl
ink" width="450" height="300"> |
36 <defs> | 58 <defs> |
37 <path id="textpath" | 59 <path id="textpath" |
38 d="M 100 200 | 60 d="M 100 200 |
39 C 200 100 300 0 400 100 | 61 C 200 100 300 0 400 100 |
40 C 500 200 600 300 700 200 | 62 C 500 200 600 300 700 200 |
41 C 800 100 900 100 900 100" /> | 63 C 800 100 900 100 900 100" /> |
42 </defs> | 64 </defs> |
43 <text x="10" y="50" id="svg1">Can you findme in this boring text?</text> | 65 <text x="10" y="50" id="svg1">Can you findme in this boring text?</text> |
44 <text x="10" y="100" style="font-size: 10px; font-family: monospace;" id="sv
g2">Findme in a typewriter!</text> | 66 <text x="10" y="100" style="font-size: 10px; font-family: monospace;" id="sv
g2">Findme in a typewriter!</text> |
45 <g transform="scale(0.3) translate(0 400)"> | 67 <g transform="scale(0.3) translate(0 400)"> |
46 <text font-family="Verdana" font-size="42.5" fill="blue" > | 68 <text font-family="Verdana" font-size="42.5" fill="blue" > |
47 <textPath xlink:href="#textpath" id="svg3">Findme on a path! Did you fin
dme?</textPath> | 69 <textPath xlink:href="#textpath" id="svg3">Findme on a path! Did you fin
dme?</textPath> |
48 </text> | 70 </text> |
49 </g> | 71 </g> |
50 </svg> | 72 </svg> |
51 <div style="height: 1000px"></div> | 73 <div style="height: 1000px"></div> |
52 </div> | 74 </div> |
53 | 75 |
OLD | NEW |