Auto merge of #24409 - tigleym:mouse_event_cssom_attributes, r=jdm

Implements pageX and pageY attributes on MouseEvent interface

<!-- Please describe your changes on the following line: -->
Implements missing pageX and pageY on MouseEvent interface.

---
<!-- Thank you for contributing to Servo! Please replace each `[ ]` by `[X]` when the step is complete, and replace `___` with appropriate data: -->
- [X] `./mach build -d` does not report any errors
- [X] `./mach test-tidy` does not report any errors
- [x] These changes fix #24248 (GitHub issue number if applicable)

<!-- Either: -->
- [X] There are tests for these changes OR
- [ ] These changes do not require tests because ___

<!-- Also, please make sure that "Allow edits from maintainers" checkbox is checked, so that we can help you if you get stuck somewhere along the way.-->

<!-- Pull requests that do not address these steps are welcome, but they will require additional verification as part of the review process. -->

<!-- Reviewable:start -->
---
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/24409)
<!-- Reviewable:end -->

components/script/dom/mouseevent.rs

@@ -7,7 +7,7 @@ use crate::dom::bindings::codegen::Bindings::MouseEventBinding::MouseEventMethod
 use crate::dom::bindings::codegen::Bindings::UIEventBinding::UIEventMethods;
 use crate::dom::bindings::error::Fallible;
 use crate::dom::bindings::inheritance::Castable;
-use crate::dom::bindings::reflector::reflect_dom_object;
+use crate::dom::bindings::reflector::{reflect_dom_object, DomObject};
 use crate::dom::bindings::root::{DomRoot, MutNullableDom};
 use crate::dom::bindings::str::DOMString;
 use crate::dom::event::{Event, EventBubbles, EventCancelable};
@@ -27,6 +27,8 @@ pub struct MouseEvent {
     screen_y: Cell<i32>,
     client_x: Cell<i32>,
     client_y: Cell<i32>,
+    page_x: Cell<i32>,
+    page_y: Cell<i32>,
     ctrl_key: Cell<bool>,
     shift_key: Cell<bool>,
     alt_key: Cell<bool>,
@@ -45,6 +47,8 @@ impl MouseEvent {
             screen_y: Cell::new(0),
             client_x: Cell::new(0),
             client_y: Cell::new(0),
+            page_x: Cell::new(0),
+            page_y: Cell::new(0),
             ctrl_key: Cell::new(false),
             shift_key: Cell::new(false),
             alt_key: Cell::new(false),
@@ -104,6 +108,9 @@ impl MouseEvent {
         );
         ev.buttons.set(buttons);
         ev.point_in_target.set(point_in_target);
+        // TODO: Set proper values in https://github.com/servo/servo/issues/24415
+        ev.page_x.set(client_x);
+        ev.page_y.set(client_y);
         ev
     }
 
@@ -163,6 +170,28 @@ impl MouseEventMethods for MouseEvent {
         self.client_y.get()
     }
 
+    // https://drafts.csswg.org/cssom-view/#dom-mouseevent-pagex
+    fn PageX(&self) -> i32 {
+        if self.upcast::<Event>().dispatching() {
+            self.page_x.get()
+        } else {
+            let global = self.global();
+            let window = global.as_window();
+            window.current_viewport().origin.x.to_px() + self.client_x.get()
+        }
+    }
+
+    // https://drafts.csswg.org/cssom-view/#dom-mouseevent-pagey
+    fn PageY(&self) -> i32 {
+        if self.upcast::<Event>().dispatching() {
+            self.page_y.get()
+        } else {
+            let global = self.global();
+            let window = global.as_window();
+            window.current_viewport().origin.y.to_px() + self.client_y.get()
+        }
+    }
+
     // https://w3c.github.io/uievents/#widl-MouseEvent-ctrlKey
     fn CtrlKey(&self) -> bool {
         self.ctrl_key.get()

components/script/dom/webidls/MouseEvent.webidl

@@ -10,6 +10,8 @@ interface MouseEvent : UIEvent {
     readonly    attribute long           screenY;
     readonly    attribute long           clientX;
     readonly    attribute long           clientY;
+    readonly    attribute long           pageX;
+    readonly    attribute long           pageY;
     readonly    attribute boolean        ctrlKey;
     readonly    attribute boolean        shiftKey;
     readonly    attribute boolean        altKey;

tests/wpt/metadata/MANIFEST.json

@@ -613547,7 +613547,7 @@
    "testharness"
   ],
   "css/cssom-view/mouseEvent.html": [
-   "907a2b405e442ba09ae623327d6f7de5492d3a80",
+   "7e194b8909317806ff80e300cd480b31680a397e",
    "testharness"
   ],
   "css/cssom-view/negativeMargins.html": [

tests/wpt/metadata/css/cssom-view/idlharness.html.ini

@@ -29,12 +29,6 @@
   [Text interface: document.createTextNode("x") must inherit property "getBoxQuads(BoxQuadOptions)" with the proper type]
     expected: FAIL
 
-  [MouseEvent interface: attribute pageX]
-    expected: FAIL
-
-  [MouseEvent interface: attribute pageY]
-    expected: FAIL
-
   [HTMLImageElement interface: document.createElement("img") must inherit property "x" with the proper type]
     expected: FAIL
 
@@ -316,10 +310,3 @@
 
   [MouseEvent interface: new MouseEvent("foo") must inherit property "offsetX" with the proper type]
     expected: FAIL
-
-  [MouseEvent interface: new MouseEvent("foo") must inherit property "pageY" with the proper type]
-    expected: FAIL
-
-  [MouseEvent interface: new MouseEvent("foo") must inherit property "pageX" with the proper type]
-    expected: FAIL
-

tests/wpt/web-platform-tests/css/cssom-view/mouseEvent.html

@@ -2,6 +2,9 @@
 <meta charset=utf-8>
 <head>
 <title>CSSOM MouseEvent tests</title>
+<div style="background:lightblue; height:10000px">
+  Hello
+</div>
 <script src=/resources/testharness.js></script>
 <script src=/resources/testharnessreport.js></script>
 <script>
@@ -13,5 +16,18 @@ test(function () {
     assert_equals(mouseEvent.x, 30);
     assert_equals(mouseEvent.y, 40);
 }, 'MouseEvent\'s x and y must be equal to clientX and clientY.');
+
+test(function () {
+    var mouseEvent1 = new MouseEvent('mousedown', {clientX: 10, clientY: 20});
+    assert_equals(mouseEvent1.pageX, 10);
+    assert_equals(mouseEvent1.pageY, 20);
+    scrollBy(0, 5000);
+    assert_equals(mouseEvent1.pageX, 10);
+    assert_equals(mouseEvent1.pageY, 5020);
+
+    var mouseEvent2 = new MouseEvent('mousedown', {clientX: 10, clientY: 20});
+    assert_equals(mouseEvent2.pageX, 10);
+    assert_equals(mouseEvent2.pageY, 5020);
+}, 'MouseEvent\'s pageX and pageY attributes should be the sum of the scroll offset and clientX/clientY');
 </script>
 </head>