dom/tests/mochitest/webcomponents/test_dynamic_content_element_matching.html

Wed, 31 Dec 2014 06:09:35 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 06:09:35 +0100
changeset 0
6474c204b198
permissions
-rw-r--r--

Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.

michael@0 1 <!DOCTYPE HTML>
michael@0 2 <html>
michael@0 3 <!--
michael@0 4 https://bugzilla.mozilla.org/show_bug.cgi?id=806506
michael@0 5 -->
michael@0 6 <head>
michael@0 7 <title>Test for dynamic changes to content matching content elements</title>
michael@0 8 <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
michael@0 9 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
michael@0 10 </head>
michael@0 11 <body>
michael@0 12 <div class="tall" id="bodydiv"></div>
michael@0 13 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=806506">Bug 806506</a>
michael@0 14 <script>
michael@0 15 // Create ShadowRoot.
michael@0 16 var elem = document.createElement("div");
michael@0 17 var root = elem.createShadowRoot();
michael@0 18
michael@0 19 var redInsertionPoint = document.createElement("content");
michael@0 20 redInsertionPoint.select = "*[data-color=red]";
michael@0 21
michael@0 22 var blueInsertionPoint = document.createElement("content");
michael@0 23 blueInsertionPoint.select = "*[data-color=blue]";
michael@0 24
michael@0 25 root.appendChild(redInsertionPoint);
michael@0 26 root.appendChild(blueInsertionPoint);
michael@0 27
michael@0 28 is(blueInsertionPoint.getDistributedNodes().length, 0, "Blue insertion point should have no distributed nodes.");
michael@0 29 is(redInsertionPoint.getDistributedNodes().length, 0, "Red insertion point should have no distrubted nodes.");
michael@0 30
michael@0 31 var matchElement = document.createElement("div");
michael@0 32 matchElement.setAttribute("data-color", "red");
michael@0 33 elem.appendChild(matchElement);
michael@0 34
michael@0 35 is(blueInsertionPoint.getDistributedNodes().length, 0, "Blue insertion point should have no distributed nodes.");
michael@0 36 is(redInsertionPoint.getDistributedNodes().length, 1, "Red insertion point should match recently inserted div.");
michael@0 37
michael@0 38 matchElement.setAttribute("data-color", "blue");
michael@0 39 is(blueInsertionPoint.getDistributedNodes().length, 1, "Blue insertion point should match element after changing attribute value.");
michael@0 40 is(redInsertionPoint.getDistributedNodes().length, 0, "Red insertion point should not match element after changing attribute value.");
michael@0 41
michael@0 42 matchElement.removeAttribute("data-color");
michael@0 43
michael@0 44 is(blueInsertionPoint.getDistributedNodes().length, 0, "Blue insertion point should have no distributed nodes after removing the matching attribute.");
michael@0 45 is(redInsertionPoint.getDistributedNodes().length, 0, "Red insertion point should have no distrubted nodes after removing the matching attribute.");
michael@0 46
michael@0 47 </script>
michael@0 48 </body>
michael@0 49 </html>
michael@0 50

mercurial