Index: third_party/WebKit/LayoutTests/svg/custom/pointer-events-image-css-transform.svg |
diff --git a/third_party/WebKit/LayoutTests/svg/custom/pointer-events-image-css-transform.svg b/third_party/WebKit/LayoutTests/svg/custom/pointer-events-image-css-transform.svg |
index 20760f03a5471c7750772225138f7f8c3aa7d933..69e95df97f9dfbbfca89e2bf3d4af9118503d79e 100644 |
--- a/third_party/WebKit/LayoutTests/svg/custom/pointer-events-image-css-transform.svg |
+++ b/third_party/WebKit/LayoutTests/svg/custom/pointer-events-image-css-transform.svg |
@@ -1,79 +1,99 @@ |
<?xml version="1.0"?> |
-<!-- This a 1-1 copy of pointer-events-image.svg tests with the addition of -webkit-transform --> |
+<!-- This a 1-1 copy of pointer-events-image.svg tests with the addition of 'transform' --> |
<svg xmlns="http://www.w3.org/2000/svg" |
xmlns:xlink="http://www.w3.org/1999/xlink" onload="fillTestContent()"> |
<script type="text/javascript"> |
<![CDATA[ |
- |
if (window.testRunner) |
- testRunner.waitUntilDone(); |
- |
+ testRunner.waitUntilDone(); |
+ |
var visibleValues = [ 'visible', 'hidden' ]; |
var fillValues = ['none', 'orange' ]; |
var strokeValues = ['none', 'blue' ]; |
- |
+ |
var pointerEventsValues = ['auto', 'visiblePainted', 'visibleFill', 'visibleStroke', 'visible', 'painted', 'fill', 'stroke', 'all', 'none']; |
- |
+ |
+ var pendingClicks = []; |
+ function queueClick(x, y) { |
+ pendingClicks.push({ x: x, y: y }); |
+ } |
+ |
+ function performClick(x, y) { |
+ if (!window.eventSender) |
+ return; |
+ eventSender.mouseMoveTo(x, y); |
+ eventSender.mouseDown(); |
+ eventSender.mouseUp(); |
+ } |
+ |
+ var totalImages = visibleValues.length * fillValues.length * strokeValues.length * pointerEventsValues.length; |
+ var imagesLoaded = 0; |
+ |
+ function imageLoaded() { |
+ // Wait for all images to load, then issue all pending clicks. |
+ if (++imagesLoaded < totalImages) |
+ return; |
+ for (let point of pendingClicks) |
+ performClick(point.x, point.y); |
+ if (window.testRunner) |
+ testRunner.notifyDone(); |
+ } |
+ |
+ var svgNS = "http://www.w3.org/2000/svg"; |
+ |
+ function attachTestImage(container, xOffset, yOffset, attributes) { |
+ var fillText = document.createElementNS(svgNS, 'text'); |
+ fillText.setAttribute('x', xOffset + 5); |
+ fillText.setAttribute('y', yOffset + 20); |
+ fillText.textContent = "miss"; |
+ fillText.setAttribute('pointer-events', 'none'); |
+ |
+ var img = document.createElementNS(svgNS, 'image'); |
+ img.setAttributeNS("http://www.w3.org/1999/xlink", 'href', 'resources/red-checker.png'); |
+ img.setAttribute('x', xOffset / 2); |
+ img.setAttribute('y', yOffset / 2); |
+ img.setAttribute('width', 25); |
+ img.setAttribute('height', 25); |
+ img.setAttribute('visibility', attributes.visibility); |
+ img.setAttribute('fill', attributes.fill); |
+ img.setAttribute('stroke', attributes.stroke); |
+ img.setAttribute('pointer-events', attributes.pointerEvents); |
+ img.setAttribute('style', "transform: scale(2)"); |
+ img.onload = imageLoaded; |
+ img.onclick = function() { fillText.textContent = 'HIT'; }; |
+ |
+ container.appendChild(img); |
+ container.appendChild(fillText); |
+ } |
+ |
var leftEdge = 100; |
var topEdge = 30; |
- |
+ |
var rectSpacing = 57; |
- |
- var svgNS = "http://www.w3.org/2000/svg"; |
- |
- function clickHit(event, identifierString) { |
- var fillText = document.getElementById('fill-text' + identifierString); |
- fillText.textContent = 'HIT'; |
- } |
- |
- function fillTestContent() { |
+ |
+ function fillTestContent() { |
var xOffset = leftEdge; |
var yOffset = topEdge; |
- |
+ |
var testContent = document.getElementById("test-content"); |
- |
+ |
for (var pi = 0; pi < pointerEventsValues.length; pi++) { |
var eventLabel = document.createElementNS(svgNS, 'text'); |
eventLabel.setAttribute('x', 0); |
eventLabel.setAttribute('y', yOffset + 30); |
eventLabel.textContent = pointerEventsValues[pi]; |
testContent.appendChild(eventLabel); |
- |
+ |
for (var vi = 0; vi < visibleValues.length; vi++) { |
for (var fi = 0; fi < fillValues.length; fi++) { |
for (var si = 0; si < strokeValues.length; si++) { |
- |
- var identString = "_" + pi + "_" + vi + "_" + fi + "_" + si; |
- |
- var img = document.createElementNS(svgNS, 'image'); |
- img.setAttributeNS("http://www.w3.org/1999/xlink", 'href', 'resources/red-checker.png'); |
- img.setAttribute('x', xOffset/2); |
- img.setAttribute('y', yOffset/2); |
- img.setAttribute('width', 25); |
- img.setAttribute('height', 25); |
- img.setAttribute('visibility', visibleValues[vi]); |
- img.setAttribute('fill', fillValues[fi]); |
- img.setAttribute('stroke', strokeValues[si]); |
- img.setAttribute('pointer-events', pointerEventsValues[pi]); |
- img.setAttribute('style', "transform: scale(2)"); |
- img.setAttribute('onclick', 'clickHit(evt, "' + identString + '")'); |
- |
- testContent.appendChild(img); |
- |
- var fillText = document.createElementNS(svgNS, 'text'); |
- fillText.setAttribute('x', xOffset + 5); |
- fillText.setAttribute('y', yOffset + 20); |
- fillText.textContent = "miss"; |
- fillText.setAttribute('id', 'fill-text' + identString); |
- fillText.setAttribute('pointer-events', 'none'); |
- testContent.appendChild(fillText); |
- |
- if (window.eventSender) { |
- // Fill click |
- eventSender.mouseMoveTo(xOffset + 30, yOffset + 30); |
- eventSender.mouseDown(); |
- eventSender.mouseUp(); |
- } |
+ attachTestImage(testContent, xOffset, yOffset, { |
+ visibility: visibleValues[vi], |
+ fill: fillValues[fi], |
+ stroke: strokeValues[si], |
+ pointerEvents: pointerEventsValues[pi] |
+ }); |
+ queueClick(xOffset + 30, yOffset + 30); |
xOffset += rectSpacing; |
} |
} |
@@ -81,9 +101,6 @@ |
xOffset = leftEdge; |
yOffset += rectSpacing; |
} |
- |
- if (window.testRunner) |
- testRunner.notifyDone(); |
} |
]]> |
</script> |