Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-07-22 23:03:42 +01:00
Code Issues Projects Releases Packages Wiki Activity

Make hit tests against box shadows always fail.

Browse source 
Closes #9268.
This commit is contained in:
Patrick Walton 2016-01-25 16:30:04 -08:00
parent d34641dc3f
commit 32a68a43ec
2 changed files with 47 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

39
components/gfx/display_list/mod.rs
View file

@ -390,23 +390,30 @@ impl DisplayList {
return;
}
if let DisplayItem::BorderClass(ref border) = *item {
// If the point is inside the border, it didn't hit the border!
let interior_rect =
Rect::new(
Point2D::new(border.base.bounds.origin.x +
border.border_widths.left,
border.base.bounds.origin.y +
border.border_widths.top),
Size2D::new(border.base.bounds.size.width -
(border.border_widths.left +
border.border_widths.right),
border.base.bounds.size.height -
(border.border_widths.top +
border.border_widths.bottom)));
if interior_rect.contains(&point) {
return;
match *item {
DisplayItem::BorderClass(ref border) => {
// If the point is inside the border, it didn't hit the border!
let interior_rect =
Rect::new(
Point2D::new(border.base.bounds.origin.x +
border.border_widths.left,
border.base.bounds.origin.y +
border.border_widths.top),
Size2D::new(border.base.bounds.size.width -
(border.border_widths.left +
border.border_widths.right),
border.base.bounds.size.height -
(border.border_widths.top +
border.border_widths.bottom)));
if interior_rect.contains(&point) {
return;
}
}
DisplayItem::BoxShadowClass(_) => {
// Box shadows can never be hit.
return
}
_ => {}
}
// We found a hit!

24
tests/html/shadow-hit-test.html Normal file
View file

@ -0,0 +1,24 @@
<!DOCTYPE html>
<!-- Clicking under the shadow should still activate the green div. -->
<style>
.green {
background: green;
position: absolute;
top: 45px;
left: 170px;
width: 100px;
height: 50px;
}
.red {
background: red;
position: absolute;
top: 20px;
left: 20px;
width: 100px;
height: 100px;
box-shadow: 100px 0 0 rgba(0,0,0,0.1);
transform: translateX(1px);
}
</style>
<div class="green" onclick="console.log('You clicked me!')"></div>
<div class="red"></div>