| <!doctype html> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| <style> |
| * { |
| background-color:white; |
| } |
| :any-link { |
| background-color:rgb(1, 2, 3); |
| } |
| </style> |
| </head> |
| <body> |
| <div style="display:none"> |
| <div data-description="Anchors basics."> |
| <a id="target-tag-1">Anchors without href are no links.</a> |
| |
| <a id="target-tag-2" href>Anchors with an empty href are links.</a> |
| <a id="target-tag-3" href="">Anchors with an empty href are links.</a> |
| <a id="target-tag-4" href="a">An anchor with any href is a link.</a> |
| <a id="target-tag-5" href="http://www.webkit.org">An anchor with a valid href is a link.</a> |
| |
| <!-- Case sensitivity of the attribute name --> |
| <a id="target-tag-6" Href>Anchors with an empty href are links.</a> |
| <a id="target-tag-7" HREF="">Anchors with an empty href are links.</a> |
| <a id="target-tag-8" hreF="a">An anchor with any href is a link.</a> |
| <a id="target-tag-9" hReF="http://www.webkit.org">An anchor with a valid href is a link.</a> |
| </div> |
| |
| <div data-description="Standalone images are not link."> |
| <!-- The WebKit version of "any-link" was incorrectly classifying images with "usemap" as links. --> |
| <img id="target-tag-10" href="http://www.webkit.org"></img> |
| <img id="target-tag-11" usemap></img> |
| <img id="target-tag-12" usemap=""></img> |
| |
| <map id="target-tag-13" name="image-map-1"> |
| <area id="target-tag-14" href="http://www.webkit.org" shape="rect" coords="10,10,10,10"> |
| </map> |
| <img id="target-tag-15" src="invalid.png" usemap="#image-map-1"> |
| </div> |
| |
| <div data-description="Area basics.."> |
| <!-- No href -> not a link. --> |
| <area id="target-tag-16"> |
| |
| <area id="target-tag-17" href> |
| <area id="target-tag-18" href=""> |
| <area id="target-tag-19" href="http://www.webkit.org"> |
| <area id="target-tag-20" HREF="http://www.webkit.org"> |
| <map id="target-tag-21" name="image-map-2"> |
| <area id="target-tag-22" href> |
| <area id="target-tag-23" href=""> |
| <area id="target-tag-24" href="http://www.webkit.org"> |
| <area id="target-tag-25" HREF="http://www.webkit.org"> |
| </map> |
| </div> |
| |
| <div data-description="SVG basics."> |
| <svg> |
| <a id="target-tag-26"><text>No href.</text></a> |
| |
| <a id="target-tag-27" href><text>Link.</text></a> |
| <a id="target-tag-28" href=""><text>Link.</text></a> |
| <a id="target-tag-29" href="http://www.webkit.org"><text>Link.</text></a> |
| <a id="target-tag-30" HREF="http://www.webkit.org"><text>Link.</text></a> |
| |
| <a id="target-tag-31" xlink:href><text>Link.</text></a> |
| <a id="target-tag-32" xlink:href=""><text>Link.</text></a> |
| <a id="target-tag-33" xlink:href="http://www.webkit.org"><text>Link.</text></a> |
| <a id="target-tag-34" xlink:HREF="http://www.webkit.org"><text>Link.</text></a> |
| </svg> |
| </div> |
| </div> |
| </body> |
| <script> |
| description('Test the basic matching of the :any-link selector.'); |
| |
| // Query Selector. |
| var expectedIds = ['target-tag-2', |
| 'target-tag-3', |
| 'target-tag-4', |
| 'target-tag-5', |
| 'target-tag-6', |
| 'target-tag-7', |
| 'target-tag-8', |
| 'target-tag-9', |
| 'target-tag-14', |
| 'target-tag-17', |
| 'target-tag-18', |
| 'target-tag-19', |
| 'target-tag-20', |
| 'target-tag-22', |
| 'target-tag-23', |
| 'target-tag-24', |
| 'target-tag-25', |
| 'target-tag-27', |
| 'target-tag-28', |
| 'target-tag-29', |
| 'target-tag-30', |
| 'target-tag-31', |
| 'target-tag-32', |
| 'target-tag-33', |
| 'target-tag-34']; |
| |
| shouldBe('document.querySelectorAll(":any-link").length', expectedIds.length.toString()); |
| |
| for (var i = 0; i < expectedIds.length; ++i) |
| shouldBe('document.querySelectorAll(":any-link")[' + i + ']', 'document.getElementById("' + expectedIds[i] + '")'); |
| |
| // Styling. |
| var expectedStyles = [['target-tag-1', 'rgb(255, 255, 255)'], |
| ['target-tag-2', 'rgb(1, 2, 3)'], |
| ['target-tag-3', 'rgb(1, 2, 3)'], |
| ['target-tag-4', 'rgb(1, 2, 3)'], |
| ['target-tag-5', 'rgb(1, 2, 3)'], |
| ['target-tag-6', 'rgb(1, 2, 3)'], |
| ['target-tag-7', 'rgb(1, 2, 3)'], |
| ['target-tag-8', 'rgb(1, 2, 3)'], |
| ['target-tag-9', 'rgb(1, 2, 3)'], |
| ['target-tag-10', 'rgb(255, 255, 255)'], |
| ['target-tag-11', 'rgb(255, 255, 255)'], |
| ['target-tag-12', 'rgb(255, 255, 255)'], |
| ['target-tag-13', 'rgb(255, 255, 255)'], |
| ['target-tag-14', 'rgb(1, 2, 3)'], |
| ['target-tag-15', 'rgb(255, 255, 255)'], |
| ['target-tag-16', 'rgb(255, 255, 255)'], |
| ['target-tag-17', 'rgb(1, 2, 3)'], |
| ['target-tag-18', 'rgb(1, 2, 3)'], |
| ['target-tag-19', 'rgb(1, 2, 3)'], |
| ['target-tag-20', 'rgb(1, 2, 3)'], |
| ['target-tag-21', 'rgb(255, 255, 255)'], |
| ['target-tag-22', 'rgb(1, 2, 3)'], |
| ['target-tag-23', 'rgb(1, 2, 3)'], |
| ['target-tag-24', 'rgb(1, 2, 3)'], |
| ['target-tag-25', 'rgb(1, 2, 3)'], |
| ['target-tag-26', 'rgb(255, 255, 255)'], |
| ['target-tag-27', 'rgb(1, 2, 3)'], |
| ['target-tag-28', 'rgb(1, 2, 3)'], |
| ['target-tag-29', 'rgb(1, 2, 3)'], |
| ['target-tag-30', 'rgb(1, 2, 3)'], |
| ['target-tag-31', 'rgb(1, 2, 3)'], |
| ['target-tag-32', 'rgb(1, 2, 3)'], |
| ['target-tag-33', 'rgb(1, 2, 3)'], |
| ['target-tag-34', 'rgb(1, 2, 3)']]; |
| |
| for (var i = 0; i < expectedStyles.length; ++i) |
| shouldBeEqualToString('getComputedStyle(document.getElementById("' + expectedStyles[i][0] + '")).backgroundColor', "" + expectedStyles[i][1]); |
| |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </html> |
