Implement focus and blur events

components/script/dom/document.rs

@@ -38,6 +38,7 @@ use dom::domimplementation::DOMImplementation;
 use dom::element::{Element, ElementCreator};
 use dom::event::{Event, EventBubbles, EventCancelable};
 use dom::eventtarget::EventTarget;
+use dom::focusevent::FocusEvent;
 use dom::htmlanchorelement::HTMLAnchorElement;
 use dom::htmlappletelement::HTMLAppletElement;
 use dom::htmlareaelement::HTMLAreaElement;
@@ -581,17 +582,21 @@ impl Document {
     /// Reassign the focus context to the element that last requested focus during this
     /// transaction, or none if no elements requested it.
     pub fn commit_focus_transaction(&self, focus_type: FocusType) {
-        // TODO: dispatch blur, focus, focusout, and focusin events
 
         if let Some(ref elem) = self.focused.get() {
+            let node = elem.upcast::<Node>();
             elem.set_focus_state(false);
+            // FIXME: pass appropriate relatedTarget
+            self.fire_focus_event(FocusEventType::Blur, node, None);
         }
 
         self.focused.set(self.possibly_focused.get().r());
 
         if let Some(ref elem) = self.focused.get() {
             elem.set_focus_state(true);
-
+            let node = elem.upcast::<Node>();
+            // FIXME: pass appropriate relatedTarget
+            self.fire_focus_event(FocusEventType::Focus, node, None);
             // Update the focus state for all elements in the focus chain.
             // https://html.spec.whatwg.org/multipage/#focus-chain
             if focus_type == FocusType::Element {
@@ -1418,6 +1423,25 @@ impl Document {
     pub fn get_dom_complete(&self) -> u64 {
         self.dom_complete.get()
     }
+
+    // https://html.spec.whatwg.org/multipage/#fire-a-focus-event
+    fn fire_focus_event(&self, focus_event_type: FocusEventType, node: &Node, relatedTarget: Option<&EventTarget>) {
+        let (event_name, does_bubble) = match focus_event_type {
+            FocusEventType::Focus => (DOMString::from("focus"), EventBubbles::DoesNotBubble),
+            FocusEventType::Blur => (DOMString::from("blur"), EventBubbles::DoesNotBubble),
+        };
+        let event = FocusEvent::new(&self.window,
+                                    event_name,
+                                    does_bubble,
+                                    EventCancelable::NotCancelable,
+                                    Some(&self.window),
+                                    0i32,
+                                    relatedTarget);
+        let event = event.upcast::<Event>();
+        event.set_trusted(true);
+        let target = node.upcast();
+        event.fire(target);
+    }
 }
 
 #[derive(PartialEq, HeapSizeOf)]
@@ -2542,3 +2566,9 @@ pub enum FocusType {
     Element,    // The first focus message - focus the element itself
     Parent,     // Focusing a parent element (an iframe)
 }
+
+/// Focus events
+pub enum FocusEventType {
+    Focus,      // Element gained focus. Doesn't bubble.
+    Blur,       // Element lost focus. Doesn't bubble.
+}

components/script/dom/focusevent.rs

@@ -0,0 +1,84 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+use dom::bindings::codegen::Bindings::FocusEventBinding;
+use dom::bindings::codegen::Bindings::FocusEventBinding::FocusEventMethods;
+use dom::bindings::codegen::Bindings::UIEventBinding::UIEventMethods;
+use dom::bindings::error::Fallible;
+use dom::bindings::global::GlobalRef;
+use dom::bindings::inheritance::Castable;
+use dom::bindings::js::{JS, MutNullableHeap, Root, RootedReference};
+use dom::bindings::reflector::reflect_dom_object;
+use dom::event::{EventBubbles, EventCancelable};
+use dom::eventtarget::EventTarget;
+use dom::uievent::UIEvent;
+use dom::window::Window;
+use std::default::Default;
+use util::str::DOMString;
+
+#[dom_struct]
+pub struct FocusEvent {
+    uievent: UIEvent,
+    related_target: MutNullableHeap<JS<EventTarget>>,
+}
+
+impl FocusEvent {
+    fn new_inherited() -> FocusEvent {
+        FocusEvent {
+            uievent: UIEvent::new_inherited(),
+            related_target: Default::default(),
+        }
+    }
+
+    pub fn new(window: &Window,
+               type_: DOMString,
+               can_bubble: EventBubbles,
+               cancelable: EventCancelable,
+               view: Option<&Window>,
+               detail: i32,
+               related_target: Option<&EventTarget>) -> Root<FocusEvent> {
+        let event = box FocusEvent::new_inherited();
+        let ev = reflect_dom_object(event, GlobalRef::Window(window), FocusEventBinding::Wrap);
+        ev.upcast::<UIEvent>().InitUIEvent(type_,
+                                           can_bubble == EventBubbles::Bubbles,
+                                           cancelable == EventCancelable::Cancelable,
+                                           view, detail);
+        ev.related_target.set(related_target);
+        ev
+    }
+
+    pub fn Constructor(global: GlobalRef,
+                       type_: DOMString,
+                       init: &FocusEventBinding::FocusEventInit) -> Fallible<Root<FocusEvent>> {
+        let bubbles = if init.parent.parent.bubbles {
+            EventBubbles::Bubbles
+        } else {
+            EventBubbles::DoesNotBubble
+        };
+        let cancelable = if init.parent.parent.cancelable {
+            EventCancelable::Cancelable
+        } else {
+            EventCancelable::NotCancelable
+        };
+        let event = FocusEvent::new(global.as_window(), type_,
+                                    bubbles,
+                                    cancelable,
+                                    init.parent.view.r(),
+                                    init.parent.detail,
+                                    init.relatedTarget.r());
+        Ok(event)
+    }
+}
+
+impl FocusEventMethods for FocusEvent {
+    // https://w3c.github.io/uievents/#widl-FocusEvent-relatedTarget
+    fn GetRelatedTarget(&self) -> Option<Root<EventTarget>> {
+        self.related_target.get()
+    }
+
+    // https://dom.spec.whatwg.org/#dom-event-istrusted
+    fn IsTrusted(&self) -> bool {
+        self.uievent.IsTrusted()
+    }
+}

components/script/dom/mod.rs

@@ -253,6 +253,7 @@ pub mod eventtarget;
 pub mod file;
 pub mod filelist;
 pub mod filereader;
+pub mod focusevent;
 pub mod formdata;
 pub mod htmlanchorelement;
 pub mod htmlappletelement;

components/script/dom/webidls/FocusEvent.webidl

@@ -0,0 +1,14 @@
+/* -*- Mode: IDL; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// https://w3c.github.io/uievents/#interface-FocusEvent
+[Constructor(DOMString typeArg, optional FocusEventInit focusEventInitDict)]
+interface FocusEvent : UIEvent {
+  readonly attribute EventTarget?   relatedTarget;
+};
+
+dictionary FocusEventInit : UIEventInit {
+    EventTarget? relatedTarget = null;
+};

tests/wpt/metadata/DOMEvents/constructors.html.ini

@@ -1,23 +1,5 @@
 [constructors.html]
   type: testharness
-  [FocusEvent constructor (no argument)]
-    expected: FAIL
-
-  [FocusEvent constructor (undefined argument)]
-    expected: FAIL
-
-  [FocusEvent constructor (null argument)]
-    expected: FAIL
-
-  [FocusEvent constructor (empty argument)]
-    expected: FAIL
-
-  [FocusEvent constructor (argument with default values)]
-    expected: FAIL
-
-  [FocusEvent constructor (argument with non-default values)]
-    expected: FAIL
-
   [MouseEvent constructor (no argument)]
     expected: FAIL
 

tests/wpt/mozilla/meta/MANIFEST.json

@@ -5478,6 +5478,12 @@
             "url": "/_mozilla/mozilla/Event.html"
           }
         ],
+        "mozilla/FocusEvent.html": [
+          {
+            "path": "mozilla/FocusEvent.html",
+            "url": "/_mozilla/mozilla/FocusEvent.html"
+          }
+        ],
         "mozilla/MouseEvent.html": [
           {
             "path": "mozilla/MouseEvent.html",

tests/wpt/mozilla/tests/mozilla/FocusEvent.html

@@ -0,0 +1,94 @@
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+
+<div class="div">
+  <input class="input1"></input><input class="input2"></input>
+</div>
+
+<input class="input3"></input>
+
+<script>
+
+  async_test(function(t) {
+    assert_equals(String(FocusEvent).indexOf("function FocusEvent("), 0);
+
+    var ev = new FocusEvent("focus");
+
+    assert_true(ev instanceof Event, "Should be Event");
+    assert_true(ev instanceof UIEvent, "Should be UIEvent");
+    assert_true(ev instanceof FocusEvent, "Should be FocusEvent");
+
+    var div = document.querySelector(".div");
+    var input1 = document.querySelector(".input1");
+    var input2 = document.querySelector(".input2");
+    var input3 = document.querySelector(".input3");
+
+    var phases = [
+
+      {
+        element: input1,
+        expected_events: [
+          {element: input1, event_name: "focus"},
+        ]
+      },
+
+      {
+        element: input2,
+        expected_events: [
+          {element: input1, event_name: "blur"},
+          {element: input2, event_name: "focus"},
+        ]
+      },
+
+      {
+        element: input3,
+        expected_events: [
+          {element: input2, event_name: "blur"},
+          {element: input3, event_name: "focus"},
+        ]
+      },
+
+      {
+        element: document.body,
+        expected_events: [
+          {element: input3, event_name: "blur"},
+        ]
+      }
+
+    ];
+
+    var idx = 0;
+
+    var received_events = [];
+
+    function on_event(element, event_name) {
+      received_events.push({element, event_name});
+      if (received_events.length == phases[idx].expected_events.length) {
+        for (var i = 0; i < received_events.length; i++) {
+          assert_equals(received_events[i].element, phases[idx].expected_events[i].element);
+          assert_equals(received_events[i].event_name, phases[idx].expected_events[i].event_name);
+        }
+        if (++idx < phases.length) {
+          received_events = [];
+          phases[idx].element.focus();
+        } else {
+          t.done();
+        }
+      }
+    }
+
+    for (var element of [div, input1, input2, input3]) {
+      for (var event_name of ["focus", "blur"]) {
+        element.addEventListener(event_name, (function(element) {
+          return function(event) {
+            on_event(element, event.type);
+          }
+        })(element));
+      };
+    }
+
+    phases[0].element.focus();
+
+  });
+
+</script>

tests/wpt/mozilla/tests/mozilla/interfaces.html

@@ -22,6 +22,7 @@ var ecmaGlobals = [
   "EvalError",
   "Float32Array",
   "Float64Array",
+  "FocusEvent",
   "Function",
   "Infinity",
   "Int16Array",