Hyowon Kim
32e1417a9c
Automatic update from web-platform-tests Remove and migrate internal tests in fast/dom/elementsFromPoint/ Additional coverage added to WPT: - elementsFromPoint-shadowroot.html: Added argument validation checks for ShadowRoot.elementsFromPoint. - elementsFromPoint-svg.html: Added hit-testing cases including nested svg elements, pointer-events:bounding-box, and foreignObject. Tests removed (fully covered by WPT): - elementsFromPoint-invalid-cases.html - elementsFromPoint-iframes.html - elementsFromPoint-simple.html Change-Id: I310888d6ed9051e8156c199e7eadcf7bc214ce97 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7532739 Reviewed-by: Philip Rogers <pdr@chromium.org> Commit-Queue: Hyowon Kim <hyowon@igalia.com> Cr-Commit-Position: refs/heads/main@{#1579845} -- wpt-commits: 09acb1f036c3f8929da267fbdc25f933e043f50e wpt-pr: 57580
90 lines
3.8 KiB
HTML
90 lines
3.8 KiB
HTML
<!DOCTYPE HTML>
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script src="resources/elementsFromPoint.js"></script>
|
|
<style>
|
|
html, body {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
#svg {
|
|
margin: 100px;
|
|
background-color: rgba(0,180,0,0.2);
|
|
}
|
|
rect {
|
|
fill: rgba(180,0,0,0.2);
|
|
}
|
|
#topRightSvg, #middleG1, #middleG2, #bottomLeftG, #bottomRightG1, #bottomRightG2 {
|
|
pointer-events: bounding-box;
|
|
}
|
|
#topLeftRect2NoHitTest {
|
|
pointer-events: none;
|
|
}
|
|
</style>
|
|
<div id='sandbox'>
|
|
<svg id='svg' width='300' height='300'>
|
|
<rect id='topLeftRect1' x='5' y='5' width='90' height='90'/>
|
|
<rect id='topLeftRect2NoHitTest' x='10' y='10' width='80' height='80'/>
|
|
<rect id='topLeftRect3' x='15' y='15' width='70' height='70'/>
|
|
|
|
<foreignObject id="fo" x="210" y="110" width="80" height="80">
|
|
<div id="foDiv" style="width: 80px; height: 80px; background-color: rgba(180,0,0,0.2)"></div>
|
|
</foreignObject>
|
|
|
|
<svg id='topRightSvg' x='205' y='5' width='90' height='90'>
|
|
<rect id='topRightRect1' x='5' y='5' width='80' height='80'/>
|
|
<rect id='topRightRect2' x='10' y='10' width='70' height='70'/>
|
|
</svg>
|
|
|
|
<g id='middleG1'>
|
|
<g id='middleG2'>
|
|
<rect id='middleRect1' x='105' y='105' width='90' height='90'/>
|
|
<rect id='middleRect2' x='110' y='110' width='80' height='80'/>
|
|
</g>
|
|
</g>
|
|
|
|
<g id='bottomLeftG'>
|
|
<image id='bottomLeftImage1' x='5' y='205' width='90' height='90' xlink:href='data:image/svg+xml;utf8,<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg"><rect width="100%" height="100%" fill="rgba(180,0,0,0.2)"/></svg>'/>
|
|
<image id='bottomLeftImage2' x='10' y='210' width='80' height='80' xlink:href='data:image/svg+xml;utf8,<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg"><rect width="100%" height="100%" fill="rgba(180,0,0,0.2)"/></svg>'/>
|
|
</g>
|
|
|
|
<g id='bottomRightG1' transform='translate(300, 300)'>
|
|
<g id='bottomRightG2' transform='translate(-100, -100)'>
|
|
<rect id='bottomRightRect1' x='5' y='5' width='90' height='90'/>
|
|
<rect id='bottomRightRect2' x='110' y='110' width='80' height='80' transform='translate(-100, -100)'/>
|
|
</g>
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
<script>
|
|
test(function() {
|
|
assertElementsFromPoint('document', 125, 125,
|
|
[topLeftRect3, topLeftRect1, svg, sandbox, document.body, document.documentElement]);
|
|
}, 'elementsFromPoint for a point inside two rects');
|
|
|
|
test(function() {
|
|
assertElementsFromPoint('document', 325, 125,
|
|
[topRightRect2, topRightRect1, topRightSvg, svg, sandbox, document.body, document.documentElement]);
|
|
}, 'elementsFromPoint for a point inside two rects that are inside an svg element with pointer-events: bounding-box');
|
|
|
|
test(function() {
|
|
assertElementsFromPoint('document', 225, 225,
|
|
[middleRect2, middleRect1, middleG2, middleG1, svg, sandbox, document.body, document.documentElement]);
|
|
}, 'elementsFromPoint for a point inside two rects that are inside a <g>');
|
|
|
|
test(function() {
|
|
assertElementsFromPoint('document', 125, 325,
|
|
[bottomLeftImage2, bottomLeftImage1, bottomLeftG, svg, sandbox, document.body, document.documentElement]);
|
|
}, 'elementsFromPoint for a point inside two images');
|
|
|
|
test(function() {
|
|
assertElementsFromPoint('document', 325, 325,
|
|
[bottomRightRect2, bottomRightRect1, bottomRightG2, bottomRightG1, svg, sandbox, document.body, document.documentElement]);
|
|
}, 'elementsFromPoint for a point inside transformed rects and <g>');
|
|
|
|
test(function() {
|
|
assertElementsFromPoint('document', 350, 250,
|
|
[foDiv, fo, svg, sandbox, document.body, document.documentElement]);
|
|
}, 'elementsFromPoint for a point inside a foreignObject');
|
|
</script>
|