зеркало из https://github.com/mozilla/gecko-dev.git
servo: Merge #5461 - Implement the :focus pseudo-class selector and element.focus/blur (from mbrubeck:focus); r=jdm
Fixes #5460. This supports for simple focusable elements that are their own DOM anchors, like text `input` fields. Requires servo/rust-selectors#20. r? @SimonSapin Source-Repo: https://github.com/servo/servo Source-Revision: b63fb0c0a7e9cd9208d66319c910750aaaac844c
This commit is contained in:
Родитель
27841a3e43
Коммит
590a7bc62f
|
@ -581,6 +581,14 @@ impl<'le> TElement<'le> for LayoutElement<'le> {
|
|||
}
|
||||
}
|
||||
|
||||
#[inline]
|
||||
fn get_focus_state(self) -> bool {
|
||||
unsafe {
|
||||
let node: &Node = NodeCast::from_actual(self.element);
|
||||
node.get_focus_state_for_layout()
|
||||
}
|
||||
}
|
||||
|
||||
#[inline]
|
||||
fn get_id(self) -> Option<Atom> {
|
||||
unsafe {
|
||||
|
|
|
@ -454,7 +454,20 @@ impl<'a> DocumentHelpers<'a> for JSRef<'a, Document> {
|
|||
/// transaction, or none if no elements requested it.
|
||||
fn commit_focus_transaction(self) {
|
||||
//TODO: dispatch blur, focus, focusout, and focusin events
|
||||
|
||||
if let Some(ref elem) = self.focused.get().root() {
|
||||
let node: JSRef<Node> = NodeCast::from_ref(elem.r());
|
||||
node.set_focus_state(false);
|
||||
}
|
||||
|
||||
self.focused.assign(self.possibly_focused.get());
|
||||
|
||||
if let Some(ref elem) = self.focused.get().root() {
|
||||
let node: JSRef<Node> = NodeCast::from_ref(elem.r());
|
||||
node.set_focus_state(true);
|
||||
}
|
||||
// TODO: Update the focus state for all elements in the focus chain.
|
||||
// https://html.spec.whatwg.org/multipage/interaction.html#focus-chain
|
||||
}
|
||||
|
||||
/// Handles any updates when the document's title has changed.
|
||||
|
|
|
@ -1461,6 +1461,13 @@ impl<'a> style::node::TElement<'a> for JSRef<'a, Element> {
|
|||
let node: JSRef<Node> = NodeCast::from_ref(self);
|
||||
node.get_hover_state()
|
||||
}
|
||||
fn get_focus_state(self) -> bool {
|
||||
// TODO: Also check whether the top-level browsing context has the system focus,
|
||||
// and whether this element is a browsing context container.
|
||||
// https://html.spec.whatwg.org/multipage/scripting.html#selector-focus
|
||||
let node: JSRef<Node> = NodeCast::from_ref(self);
|
||||
node.get_focus_state()
|
||||
}
|
||||
fn get_id(self) -> Option<Atom> {
|
||||
self.get_attribute(ns!(""), &atom!("id")).map(|attr| {
|
||||
let attr = attr.root();
|
||||
|
|
|
@ -10,21 +10,21 @@ use dom::bindings::codegen::Bindings::HTMLElementBinding::HTMLElementMethods;
|
|||
use dom::bindings::codegen::Bindings::HTMLInputElementBinding::HTMLInputElementMethods;
|
||||
use dom::bindings::codegen::Bindings::WindowBinding::WindowMethods;
|
||||
use dom::bindings::codegen::InheritTypes::{ElementCast, HTMLFrameSetElementDerived};
|
||||
use dom::bindings::codegen::InheritTypes::{EventTargetCast, HTMLInputElementCast};
|
||||
use dom::bindings::codegen::InheritTypes::{EventTargetCast, HTMLInputElementCast, NodeCast};
|
||||
use dom::bindings::codegen::InheritTypes::{HTMLElementDerived, HTMLBodyElementDerived};
|
||||
use dom::bindings::js::{JSRef, Temporary, MutNullableJS};
|
||||
use dom::bindings::error::ErrorResult;
|
||||
use dom::bindings::error::Error::Syntax;
|
||||
use dom::bindings::utils::Reflectable;
|
||||
use dom::cssstyledeclaration::{CSSStyleDeclaration, CSSModificationAccess};
|
||||
use dom::document::Document;
|
||||
use dom::document::{Document, DocumentHelpers};
|
||||
use dom::domstringmap::DOMStringMap;
|
||||
use dom::element::{Element, ElementTypeId, ActivationElementHelpers, AttributeHandlers};
|
||||
use dom::eventtarget::{EventTarget, EventTargetHelpers, EventTargetTypeId};
|
||||
use dom::htmlinputelement::HTMLInputElement;
|
||||
use dom::htmlmediaelement::HTMLMediaElementTypeId;
|
||||
use dom::htmltablecellelement::HTMLTableCellElementTypeId;
|
||||
use dom::node::{Node, NodeTypeId, window_from_node};
|
||||
use dom::node::{Node, NodeHelpers, NodeTypeId, document_from_node, window_from_node};
|
||||
use dom::virtualmethods::VirtualMethods;
|
||||
use dom::window::WindowHelpers;
|
||||
|
||||
|
@ -135,6 +135,32 @@ impl<'a> HTMLElementMethods for JSRef<'a, HTMLElement> {
|
|||
// https://www.w3.org/Bugs/Public/show_bug.cgi?id=27430 ?
|
||||
element.as_maybe_activatable().map(|a| a.synthetic_click_activation(false, false, false, false));
|
||||
}
|
||||
|
||||
// https://html.spec.whatwg.org/multipage/interaction.html#dom-focus
|
||||
fn Focus(self) {
|
||||
// TODO: Mark the element as locked for focus and run the focusing steps.
|
||||
// https://html.spec.whatwg.org/multipage/interaction.html#focusing-steps
|
||||
let element: JSRef<Element> = ElementCast::from_ref(self);
|
||||
let document = document_from_node(self).root();
|
||||
let document = document.r();
|
||||
document.begin_focus_transaction();
|
||||
document.request_focus(element);
|
||||
document.commit_focus_transaction();
|
||||
}
|
||||
|
||||
// https://html.spec.whatwg.org/multipage/interaction.html#dom-blur
|
||||
fn Blur(self) {
|
||||
// TODO: Run the unfocusing steps.
|
||||
let node: JSRef<Node> = NodeCast::from_ref(self);
|
||||
if !node.get_focus_state() {
|
||||
return;
|
||||
}
|
||||
// https://html.spec.whatwg.org/multipage/interaction.html#unfocusing-steps
|
||||
let document = document_from_node(self).root();
|
||||
document.r().begin_focus_transaction();
|
||||
// If `request_focus` is not called, focus will be set to None.
|
||||
document.r().commit_focus_transaction();
|
||||
}
|
||||
}
|
||||
|
||||
// https://html.spec.whatwg.org/#attr-data-*
|
||||
|
|
|
@ -152,6 +152,8 @@ bitflags! {
|
|||
#[doc = "Specifies whether or not there is an authentic click in progress on \
|
||||
this element."]
|
||||
const CLICK_IN_PROGRESS = 0x100,
|
||||
#[doc = "Specifies whether this node has the focus."]
|
||||
const IN_FOCUS_STATE = 0x200,
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -440,6 +442,9 @@ pub trait NodeHelpers<'a> {
|
|||
fn get_hover_state(self) -> bool;
|
||||
fn set_hover_state(self, state: bool);
|
||||
|
||||
fn get_focus_state(self) -> bool;
|
||||
fn set_focus_state(self, state: bool);
|
||||
|
||||
fn get_disabled_state(self) -> bool;
|
||||
fn set_disabled_state(self, state: bool);
|
||||
|
||||
|
@ -618,6 +623,14 @@ impl<'a> NodeHelpers<'a> for JSRef<'a, Node> {
|
|||
self.set_flag(IN_HOVER_STATE, state)
|
||||
}
|
||||
|
||||
fn get_focus_state(self) -> bool {
|
||||
self.get_flag(IN_FOCUS_STATE)
|
||||
}
|
||||
|
||||
fn set_focus_state(self, state: bool) {
|
||||
self.set_flag(IN_FOCUS_STATE, state)
|
||||
}
|
||||
|
||||
fn get_disabled_state(self) -> bool {
|
||||
self.get_flag(IN_DISABLED_STATE)
|
||||
}
|
||||
|
@ -1036,6 +1049,8 @@ pub trait RawLayoutNodeHelpers {
|
|||
#[allow(unsafe_code)]
|
||||
unsafe fn get_hover_state_for_layout(&self) -> bool;
|
||||
#[allow(unsafe_code)]
|
||||
unsafe fn get_focus_state_for_layout(&self) -> bool;
|
||||
#[allow(unsafe_code)]
|
||||
unsafe fn get_disabled_state_for_layout(&self) -> bool;
|
||||
#[allow(unsafe_code)]
|
||||
unsafe fn get_enabled_state_for_layout(&self) -> bool;
|
||||
|
@ -1050,6 +1065,11 @@ impl RawLayoutNodeHelpers for Node {
|
|||
}
|
||||
#[inline]
|
||||
#[allow(unsafe_code)]
|
||||
unsafe fn get_focus_state_for_layout(&self) -> bool {
|
||||
self.flags.get().contains(IN_FOCUS_STATE)
|
||||
}
|
||||
#[inline]
|
||||
#[allow(unsafe_code)]
|
||||
unsafe fn get_disabled_state_for_layout(&self) -> bool {
|
||||
self.flags.get().contains(IN_DISABLED_STATE)
|
||||
}
|
||||
|
|
|
@ -25,8 +25,8 @@ interface HTMLElement : Element {
|
|||
attribute boolean hidden;
|
||||
void click();
|
||||
// attribute long tabIndex;
|
||||
//void focus();
|
||||
//void blur();
|
||||
void focus();
|
||||
void blur();
|
||||
// attribute DOMString accessKey;
|
||||
//readonly attribute DOMString accessKeyLabel;
|
||||
// attribute boolean draggable;
|
||||
|
|
|
@ -831,7 +831,7 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "selectors"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/servo/rust-selectors#12d3ce84a12ded4cf1def63651ccab06e1cfa80e"
|
||||
source = "git+https://github.com/servo/rust-selectors#0d7d846090c21d71ebb1bc17921806933a38f52b"
|
||||
dependencies = [
|
||||
"bitflags 0.1.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"cssparser 0.2.0 (git+https://github.com/servo/rust-cssparser)",
|
||||
|
|
|
@ -104,6 +104,7 @@ dependencies = [
|
|||
"libc 0.1.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"msg 0.0.1",
|
||||
"net 0.0.1",
|
||||
"net_traits 0.0.1",
|
||||
"png 0.1.0 (git+https://github.com/servo/rust-png)",
|
||||
"profile 0.0.1",
|
||||
"script_traits 0.0.1",
|
||||
|
@ -327,7 +328,7 @@ dependencies = [
|
|||
"layers 0.1.0 (git+https://github.com/servo/rust-layers)",
|
||||
"libc 0.1.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"msg 0.0.1",
|
||||
"net 0.0.1",
|
||||
"net_traits 0.0.1",
|
||||
"plugins 0.0.1",
|
||||
"png 0.1.0 (git+https://github.com/servo/rust-png)",
|
||||
"profile 0.0.1",
|
||||
|
@ -533,7 +534,7 @@ dependencies = [
|
|||
"layout_traits 0.0.1",
|
||||
"libc 0.1.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"msg 0.0.1",
|
||||
"net 0.0.1",
|
||||
"net_traits 0.0.1",
|
||||
"plugins 0.0.1",
|
||||
"png 0.1.0 (git+https://github.com/servo/rust-png)",
|
||||
"profile 0.0.1",
|
||||
|
@ -554,7 +555,7 @@ version = "0.0.1"
|
|||
dependencies = [
|
||||
"gfx 0.0.1",
|
||||
"msg 0.0.1",
|
||||
"net 0.0.1",
|
||||
"net_traits 0.0.1",
|
||||
"profile 0.0.1",
|
||||
"script_traits 0.0.1",
|
||||
"url 0.2.23 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
@ -645,18 +646,31 @@ dependencies = [
|
|||
"flate2 0.2.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"geom 0.1.0 (git+https://github.com/servo/rust-geom)",
|
||||
"hyper 0.3.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"net_traits 0.0.1",
|
||||
"openssl 0.5.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"png 0.1.0 (git+https://github.com/servo/rust-png)",
|
||||
"profile 0.0.1",
|
||||
"regex 0.1.18 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"regex_macros 0.1.11 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"rustc-serialize 0.3.4 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"stb_image 0.1.0 (git+https://github.com/servo/rust-stb-image)",
|
||||
"time 0.1.19 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"url 0.2.23 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"util 0.0.1",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "net_traits"
|
||||
version = "0.0.1"
|
||||
dependencies = [
|
||||
"geom 0.1.0 (git+https://github.com/servo/rust-geom)",
|
||||
"hyper 0.3.0 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"png 0.1.0 (git+https://github.com/servo/rust-png)",
|
||||
"profile 0.0.1",
|
||||
"stb_image 0.1.0 (git+https://github.com/servo/rust-stb-image)",
|
||||
"url 0.2.23 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"util 0.0.1",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "openssl"
|
||||
version = "0.5.1"
|
||||
|
@ -791,7 +805,7 @@ dependencies = [
|
|||
"js 0.1.0 (git+https://github.com/servo/rust-mozjs)",
|
||||
"libc 0.1.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"msg 0.0.1",
|
||||
"net 0.0.1",
|
||||
"net_traits 0.0.1",
|
||||
"plugins 0.0.1",
|
||||
"profile 0.0.1",
|
||||
"rustc-serialize 0.3.4 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
|
@ -814,7 +828,7 @@ dependencies = [
|
|||
"geom 0.1.0 (git+https://github.com/servo/rust-geom)",
|
||||
"libc 0.1.2 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"msg 0.0.1",
|
||||
"net 0.0.1",
|
||||
"net_traits 0.0.1",
|
||||
"url 0.2.23 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"util 0.0.1",
|
||||
]
|
||||
|
@ -822,7 +836,7 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "selectors"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/servo/rust-selectors#12d3ce84a12ded4cf1def63651ccab06e1cfa80e"
|
||||
source = "git+https://github.com/servo/rust-selectors#0d7d846090c21d71ebb1bc17921806933a38f52b"
|
||||
dependencies = [
|
||||
"bitflags 0.1.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"cssparser 0.2.0 (git+https://github.com/servo/rust-cssparser)",
|
||||
|
@ -843,6 +857,7 @@ dependencies = [
|
|||
"layout 0.0.1",
|
||||
"msg 0.0.1",
|
||||
"net 0.0.1",
|
||||
"net_traits 0.0.1",
|
||||
"png 0.1.0 (git+https://github.com/servo/rust-png)",
|
||||
"profile 0.0.1",
|
||||
"script 0.0.1",
|
||||
|
|
|
@ -761,7 +761,7 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "selectors"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/servo/rust-selectors#12d3ce84a12ded4cf1def63651ccab06e1cfa80e"
|
||||
source = "git+https://github.com/servo/rust-selectors#0d7d846090c21d71ebb1bc17921806933a38f52b"
|
||||
dependencies = [
|
||||
"bitflags 0.1.1 (registry+https://github.com/rust-lang/crates.io-index)",
|
||||
"cssparser 0.2.0 (git+https://github.com/servo/rust-cssparser)",
|
||||
|
|
|
@ -10,10 +10,9 @@
|
|||
is_not(document.activeElement, null, "test_1.1, document.activeElement");
|
||||
is(document.activeElement, document.body, "test_1.2, document.activeElement");
|
||||
|
||||
//TODO: uncomment following lines when focus() method will be available
|
||||
//document.getElementById('foo').focus();
|
||||
document.getElementById('foo').focus();
|
||||
is_not(document.activeElement, null, "test_2.1, document.activeElement");
|
||||
//is(document.activeElement, document.getElementById("foo"), "test_2.2, document.activeElement");
|
||||
is(document.activeElement, document.getElementById("foo"), "test_2.2, document.activeElement");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<script src="harness.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<input id="a">
|
||||
<input id="b">
|
||||
<script>
|
||||
var a = document.getElementById("a");
|
||||
var b = document.getElementById("b");
|
||||
|
||||
is(document.activeElement, document.body);
|
||||
a.focus();
|
||||
is(document.activeElement, a);
|
||||
b.focus();
|
||||
is(document.activeElement, b);
|
||||
a.blur();
|
||||
is(document.activeElement, b);
|
||||
b.blur();
|
||||
is(document.activeElement, document.body);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
Загрузка…
Ссылка в новой задаче