1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/dom/tests/mochitest/webcomponents/test_dynamic_content_element_matching.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,50 @@
1.4 +<!DOCTYPE HTML>
1.5 +<html>
1.6 +<!--
1.7 +https://bugzilla.mozilla.org/show_bug.cgi?id=806506
1.8 +-->
1.9 +<head>
1.10 + <title>Test for dynamic changes to content matching content elements</title>
1.11 + <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
1.12 + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
1.13 +</head>
1.14 +<body>
1.15 +<div class="tall" id="bodydiv"></div>
1.16 +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=806506">Bug 806506</a>
1.17 +<script>
1.18 +// Create ShadowRoot.
1.19 +var elem = document.createElement("div");
1.20 +var root = elem.createShadowRoot();
1.21 +
1.22 +var redInsertionPoint = document.createElement("content");
1.23 +redInsertionPoint.select = "*[data-color=red]";
1.24 +
1.25 +var blueInsertionPoint = document.createElement("content");
1.26 +blueInsertionPoint.select = "*[data-color=blue]";
1.27 +
1.28 +root.appendChild(redInsertionPoint);
1.29 +root.appendChild(blueInsertionPoint);
1.30 +
1.31 +is(blueInsertionPoint.getDistributedNodes().length, 0, "Blue insertion point should have no distributed nodes.");
1.32 +is(redInsertionPoint.getDistributedNodes().length, 0, "Red insertion point should have no distrubted nodes.");
1.33 +
1.34 +var matchElement = document.createElement("div");
1.35 +matchElement.setAttribute("data-color", "red");
1.36 +elem.appendChild(matchElement);
1.37 +
1.38 +is(blueInsertionPoint.getDistributedNodes().length, 0, "Blue insertion point should have no distributed nodes.");
1.39 +is(redInsertionPoint.getDistributedNodes().length, 1, "Red insertion point should match recently inserted div.");
1.40 +
1.41 +matchElement.setAttribute("data-color", "blue");
1.42 +is(blueInsertionPoint.getDistributedNodes().length, 1, "Blue insertion point should match element after changing attribute value.");
1.43 +is(redInsertionPoint.getDistributedNodes().length, 0, "Red insertion point should not match element after changing attribute value.");
1.44 +
1.45 +matchElement.removeAttribute("data-color");
1.46 +
1.47 +is(blueInsertionPoint.getDistributedNodes().length, 0, "Blue insertion point should have no distributed nodes after removing the matching attribute.");
1.48 +is(redInsertionPoint.getDistributedNodes().length, 0, "Red insertion point should have no distrubted nodes after removing the matching attribute.");
1.49 +
1.50 +</script>
1.51 +</body>
1.52 +</html>
1.53 +
