<html>
<head>
<script src="../../resources/js-test-pre.js"></script>
<script>
description(":link inside :not should be always matched when visited match type is enabled.");
jsTestIsAsync = true;

if (window.testRunner)
    window.testRunner.keepWebHistory();

var count = 0;
function finish() {
    if (++count === 4) {
        finishJSTest();
    }
}

function compareStyles()
{
    if (window.internals) {
        oneStyle = internals.computedStyleIncludingVisitedInfo(document.getElementById("one"));
        twoStyle = internals.computedStyleIncludingVisitedInfo(document.getElementById("two"));
        threeStyle = internals.computedStyleIncludingVisitedInfo(document.getElementById("three"));
        fourStyle = internals.computedStyleIncludingVisitedInfo(document.getElementById("four"));
        shouldBecomeEqualToString("oneStyle.color", "rgb(255, 0, 0)", finish);
        shouldBecomeEqualToString("twoStyle.color", "rgb(0, 128, 0)", finish);
        shouldBecomeEqualToString("threeStyle.color", "rgb(0, 128, 0)", finish);
        shouldBecomeEqualToString("fourStyle.color", "rgb(0, 128, 0)", finish);
    }
}
</script>
<style>
/* After https://bugs.webkit.org/show_bug.cgi?id=135293, :not(:link) simply considered as :not(:any-link) in the selector matching. */
a { color: red; }
#area1 a:not(:link) {
    color: green;
}

#area2 :not(:link) {
    color: green;
}

/* In this case, :not(:link)'s visited match type is disabled. So isLink() check is used instead. */
#area3 span {
    color: green;
}
#area3 :not(:link) + span {
    color: red;
}

#area4 :not(:link) + span {
    color: green;
}
</style>
</head>
<body onload="compareStyles()">
<iframe src="resources/dummy.html" style="display:none"></iframe>

<p>color of One should be red, and those of Two, Three, and Four should be green:</p>
<p>

<p id="area1">
    <a id="one" href="resources/dummy.html">One</a>
</p>

<p><a href="resources/dummy.html"><span id="area2"><span id="two">Two</span></span></a></p>

<p id="area3">
    <a href="resources/dummy.html"></a>
    <span id="three">Three</span>
</p>

<p id="area4">
    <span></span>
    <span id="four">Four</span>
</p>
</p>

<div id=console></div>
</body>
<script src="../../resources/js-test-post.js"></script>
</html>
