Implement scoped selectors for querySelector(All)

RESOLVED FIXED in mozilla32

Status

()

Core
DOM
--
enhancement
RESOLVED FIXED
9 years ago
4 years ago

People

(Reporter: Giorgio, Assigned: bz)

Tracking

({dev-doc-needed})

unspecified
mozilla32
dev-doc-needed
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(1 attachment, 1 obsolete attachment)

(Reporter)

Description

9 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.2; it; rv:1.9.2b2) Gecko/20091108 Firefox/3.6b2
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.2; it; rv:1.9.2b2) Gecko/20091108 Firefox/3.6b2

hello,
i think is missing a feature in element.querySelector(All)

it's impossible (probably in js frameworks too)
to select child elements from a previous selected anonymous element

example

var lists = document.querySelector("#myid > ul");
// do some stuff here
lists[0].querySelector("> li"); // not implemented... error!

Reproducible: Always
Right; the spec requires an exception in that case for now.  There's discussion of scoped selectors going on in the working group; the use case is definitely something people are interested in addressing.
(Reporter)

Comment 2

8 years ago
hi boris... no news about my request?
thank you
So with that proposal, you'd do:

  lists[0].querySelector(":scope > li");
(Reporter)

Comment 5

8 years ago
hi Boris, thank you for your reply! it's a honor to talk to you!

why do you propose :scope?
i mean... in Element.querySelector, Element is the scope yet

list.querySelector(" > li");
list.querySelector(":hover > li");
head1.querySelector(":first-line > span");
head1.querySelector(":hover:first-line > span");
> why do you propose :scope?

I'm not.  That's just what the current Selectors API draft has, based on various threads on the www-style and webapps mailing lists.  I realize the syntax jquery uses is the one in comment 5, but that seems likel to not end up being the syntax that's used in Selectors API, for various reasons.
(Reporter)

Comment 7

8 years ago
ok... anyway, I hope you will put together good features with good APIs
new features of gecko 1.9.1+ are great and i'm "testing" it in "production applications" lol!

thank you for your time! greetings from italy

Updated

8 years ago
Status: UNCONFIRMED → NEW
Ever confirmed: true
Summary: missing child-elements feature in (Element) querySelector(All) → Implement scoped selectors for querySelector(All)

Comment 8

4 years ago
The specification for how :scope should behave has matured and stabilized some since 2010.
It has had no material changes since the 2011 draft:
http://dev.w3.org/csswg/selectors4/#the-scope-pseudo
http://www.w3.org/TR/2011/WD-selectors4-20110929/#scope-pseudo

I see that Firefox has implemented :scope but disabled it by default, requiring:
layout.css.scope-pseudo.enabled

Webkit and Blink, on the other hand, have enabled :scope for use with .querySelector(All) by default. 

Chrome does still require a developer flag to use the scoped attribute with <style> elements:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/style#Browser_compatibility

Could we, perhaps, remove the flag guard for using :scope with .querySelector(All) now?

I believe that capability is a little more stabile and less risky than scoped style rules, yet still immensely useful. It could also be argued that a flag under layout.css.* should never have been associated with the use of :scope in scripting contexts, completely removed from any layout or CSS concerns. Thanks for considering it.
Hmm.  I guess some of the wild plans people had for the behavior of this in querySelector got canceled....

I believe it would be safe to enable this.  I've sent https://groups.google.com/forum/#!topic/mozilla.dev.platform/sWAY_1GWelE
(In reply to jmjacobs from comment #8) 
> Chrome does still require a developer flag to use the scoped attribute with
> <style> elements:
> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/
> style#Browser_compatibility
See https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/R1x18ZLS5qQ
Created attachment 8425988 [details] [diff] [review]
Enable :scope support in querySelector and scoped stylesheets by default

Looks like the intent to ship got pretty positive responses
Attachment #8425988 - Flags: review?(dholbert)
Assignee: nobody → bzbarsky
Status: NEW → ASSIGNED
Note that this enables the pseudo in both querySelector and scoped stylesheets.
Whiteboard: [need review]
Keywords: dev-doc-needed
Looks like this patch drops the pref entirely (making it no longer possible to turn off this feature).  Are you sure you want to do that?

I thought the best-practice for enabling on preffable features was to tweak all.js to drop the RELEASE_BUILD conditional chunk (enabling it everywhere), and then *after* that change has happily shipped in a release build, we can remove all usages of the pref in our code.

(Up until that point, there's always a chance we might need to turn off the feature e.g. if it causes problems that we only detect on beta-channel, and it's nice to be able to do that disabling via a simple pref-tweak.)
Flags: needinfo?(bzbarsky)
I did do that more or less on purpose.  But I guess I could keep the pref and just remove the all.js ifdefs....
Flags: needinfo?(bzbarsky)
Created attachment 8426676 [details] [diff] [review]
Minimal change
Attachment #8426676 - Flags: review?(dholbert)
Attachment #8425988 - Attachment is obsolete: true
Attachment #8425988 - Flags: review?(dholbert)
Attachment #8426676 - Flags: review?(dholbert) → review+
Attachment #8426676 - Attachment description: Minimal cahnge → Minimal change
https://hg.mozilla.org/mozilla-central/rev/cc4e2f5d0a2c
Status: ASSIGNED → RESOLVED
Last Resolved: 4 years ago
Resolution: --- → FIXED
Target Milestone: --- → mozilla32
You need to log in before you can comment on or make changes to this bug.