Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(797)

Side by Side Diff: third_party/WebKit/LayoutTests/svg/hittest/clip-path-shape.html

Issue 2322343003: Add support for <basic-shape> to 'clip-path' on SVG elements (Closed)
Patch Set: Update SPv2 expectations Created 4 years, 3 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <title>Hit-test of clip-path polygon on &lt;div> with box-shadow</title> 2 <title>Hit-test of clip-path polygon</title>
3 <script src="../../resources/testharness.js"></script> 3 <script src="../../resources/testharness.js"></script>
4 <script src="../../resources/testharnessreport.js"></script> 4 <script src="../../resources/testharnessreport.js"></script>
5 <style> 5 <style>
6 body { 6 body {
7 margin: 0; 7 margin: 0;
8 } 8 }
9 .box { 9 #target {
10 width: 100px; 10 fill: blue;
11 height: 100px;
12 background-color: blue;
13 box-shadow: -100px 0px red;
14 -webkit-clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
15 clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); 11 clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
16 } 12 }
17 </style> 13 </style>
18 <div class=box></div> 14 <svg>
15 <rect id="target" x="50" y="25" width="100" height="100"/>
16 </svg>
19 <script> 17 <script>
20 function assert_element_at(element, pointlist) { 18 function assert_element_at(element, pointlist) {
21 for (var point of pointlist) { 19 for (var point of pointlist) {
22 var result = document.elementFromPoint(point[0], point[1]); 20 var result = document.elementFromPoint(point[0], point[1]);
23 assert_equals(result, element, point.join(',')); 21 assert_equals(result, element, point.join(','));
24 } 22 }
25 } 23 }
26 24
27 test(function() { 25 test(function() {
28 var div = document.querySelector('.box'); 26 var div = document.querySelector('#target');
29 27
30 // Points inside clip-path. 28 // Points inside clip-path.
31 assert_element_at(div, [[50, 50], [50, 25], [50, 75], [25, 50], [75, 50]]); 29 assert_element_at(div, [[100, 75], [100, 50], [100, 100], [75, 75], [125, 75]] );
32 30
33 // Points outside clip-path. 31 // Points outside clip-path.
34 assert_element_at(document.body, [[20, 20], [80, 20], [20, 80], [80, 80]]); 32 assert_element_at(document.querySelector('svg'), [[70, 45], [130, 45], [70, 10 5], [130, 105]]);
35 }); 33 });
36 </script> 34 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698