third_party/WebKit/LayoutTests/svg/custom/resources/use-instanceRoot-event-bubbling.js

   1 window.testIsAsync = true;
   2 description("Tests whether SVG event bubbling works across shadow trees.");
   3
   4 var svgNS = "http://www.w3.org/2000/svg";
   5 var xhtmlNS = "http://www.w3.org/1999/xhtml";
   6 var expected = new Array(4);
   7 var tests = 4;
   8 var counter = 0;
   9 var eventCounter = 0;
  10
  11 function log(message) {
  12     var logDiv = document.getElementById("console");
  13     var newDiv = document.createElementNS(xhtmlNS, "div");
  14     newDiv.appendChild(document.createTextNode(message));
  15     logDiv.appendChild(newDiv);
  16 }
  17
  18 function eventHandler(evt, label) {
  19     var targetId = evt.target.correspondingElement ? evt.target.correspondingElement.id : evt.target.id;
  20     var curTargetId = evt.currentTarget.correspondingElement ? evt.currentTarget.correspondingElement.id : evt.currentTarget.id;
  21
  22     var phaseString = "";
  23     switch (evt.eventPhase) {
  24     case 1: phaseString = "CAPTURING"; break;
  25     case 2: phaseString = "AT_TARGET"; break;
  26     case 3: phaseString = "BUBBLING"; break;
  27     }
  28
  29     msg = '[EventHandler ' + label + '] type: ' + evt.type + ' phase: ' + phaseString +
  30           ' target: '         + evt.target        + ' (id: ' + targetId    + ')' +
  31           ' currentTarget: '  + evt.currentTarget + ' (id: ' + curTargetId + ')';
  32
  33     shouldBeEqualToString("msg", expected[eventCounter]);
  34     ++eventCounter;
  35
  36     if (label == counter)
  37         setTimeout(label == tests ? finishTest : nextTest, 0);
  38 }
  39
  40 function finishTest()
  41 {
  42     successfullyParsed = true;
  43
  44     rectContainer.setAttribute("fill", "green");
  45     shouldBeTrue("successfullyParsed");
  46     debug('<br /><span class="pass">TEST COMPLETE</span>');
  47
  48     finishRepaintTest();
  49 }
  50
  51 function nextTest()
  52 {
  53     eventCounter = 0;
  54     ++counter;
  55
  56     switch (counter) {
  57     case 1:
  58         rect.onclick = function(evt) { eventHandler(evt, 1); };
  59         expected[0] = "[EventHandler 1] type: click phase: AT_TARGET target: [object SVGRectElement] (id: rect) currentTarget: [object SVGRectElement] (id: rect)";
  60         testListeners();
  61         break;
  62     case 2:
  63         rectContainer.addEventListener("click", function(evt) { eventHandler(evt, 2) }, false);
  64         expected[1] = "[EventHandler 2] type: click phase: BUBBLING target: [object SVGRectElement] (id: rect) currentTarget: [object SVGGElement] (id: rectParent)";
  65         testListeners();
  66         break;
  67     case 3:
  68         use.setAttribute("onclick", "eventHandler(evt, 3)");
  69         expected[2] = "[EventHandler 3] type: click phase: AT_TARGET target: [object SVGUseElement] (id: use) currentTarget: [object SVGUseElement] (id: use)";
  70         testListeners();
  71         break;
  72     case 4:
  73         useContainer.onclick = function(evt) { eventHandler(evt, 4) };
  74         expected[3] = "[EventHandler 4] type: click phase: BUBBLING target: [object SVGUseElement] (id: use) currentTarget: [object SVGGElement] (id: useParent)";
  75         testListeners();
  76         break;
  77     }
  78 }
  79
  80 function testListeners()
  81 {
  82     if (window.eventSender) {
  83         eventSender.mouseMoveTo(50, 50);
  84         eventSender.mouseDown();
  85         eventSender.mouseUp();
  86     }
  87 }
  88
  89 // Create root element
  90 var svg = document.createElementNS(svgNS, "svg");
  91 svg.id = "rootSVG";
  92 svg.setAttribute("width", 100);
  93 svg.setAttribute("height", 100);
  94 document.body.insertBefore(svg, document.body.firstChild);
  95
  96 // Create defs section
  97 var defs = document.createElementNS(svgNS, "defs");
  98 svg.appendChild(defs);
  99
 100 var rectContainer = document.createElementNS(svgNS, "g");
 101 rectContainer.id = "rectParent";
 102 defs.appendChild(rectContainer);
 103
 104 var rect = document.createElementNS(svgNS, "rect");
 105 rect.id = "rect";
 106 rect.style.fill = "blue";
 107 rect.width.baseVal.value = 100;
 108 rect.height.baseVal.value = 100;
 109 rectContainer.appendChild(rect);
 110
 111 // Create content section
 112 var useContainer = document.createElementNS(svgNS, "g");
 113 useContainer.id = "useParent";
 114 svg.appendChild(useContainer);
 115
 116 var use = document.createElementNS(svgNS, "use");
 117 use.id = "use";
 118 use.href.baseVal = "#rectParent";
 119 useContainer.appendChild(use);
 120
 121 function repaintTest() {
 122     nextTest();
 123 }