jsdom: querySelectorAll doesn't support namespaced attributes

Selectors targetting namespaced attributes (for instance, [*|href]) raise a SyntaxError.

Basic info:

Node.js version: v8.7.0
jsdom version: v11.3.0

Minimal reproduction case

const { JSDOM } = require("jsdom");

const dom = new JSDOM('<!doctype html><svg xlink:href="foo"/>');

dom.window.document.querySelectorAll('[*|href]');

throws:

    SyntaxError: The string "[*|href]", is not a valid CSS selector

although the selector is valid.

How does similar code behave in browsers?

It selects the svg element. See http://jsbin.com/relisatula/edit?html,console

See also #1587 (although I think this one is slightly different, as it not only affects XML documents but also HTML documents).

About this issue

Original URL
State: closed
Created 7 years ago
Comments: 22 (9 by maintainers)

Commits related to this issue

Add test for #2028 — committed to jsdom/jsdom by domenic 5 years ago
Bump nwsapi minimum version and add namespace selector test Fixes #2028. — committed to jsdom/jsdom by domenic 5 years ago
Bump nwsapi minimum version and add namespace selector test Fixes #2028. — committed to jsdom/jsdom by domenic 5 years ago

Most upvoted comments

@domenic / @rdeltour , the new “nwsapi” has support for this, the namespace grammar is supported in the validator and parser for both attributes and tag names, I could not test the results but at least no error should be thrown. The addition was necessary to pass the complete w3c test suite.

Please see here: https://github.com/dperini/nwsapi

I have not talked/publicized much the new “nwsapi”, but it is ready, so I take the chance here …

“nwsapi” is the new Selectors Level 4 API emulation library, the continuation of my “nwmatcher” project. It targets newer browsers and headless environments, it has support for most of the new additions in the Selectors Level 4 specification, namely:

L4 web-form validation related pseudo-classes
L4 dynamic and user action pseudo-classes
namespace grammar and elements resolver
throwing real DOMException SyntaxError
native closest method on elements
:scope reference pseudo-class
:matches(s1, s2) pseudo-class
:not(s1, s2) negation pseudo-class
install/uninstall methods to replace QSA
modular design allows future L4 extension
only 24Kb minified, 8Kb minified & compressed

I am especially happy about the unbelievable speed improvements, have a peek yourself here:

http://javascript.nwbox.com/nwsapi/test/speed/

the biggest improvements in speed have been implemented on the most weak areas of “nwmatcher” and other libraries, for example on comma-separated groups, the :not() pseudo-class and on tree-structural pseudo-classes (:root, nth child-indexed and typed child-indexed).

The comparison in the above speed test is against the latest version of “nwmatcher” (1.4.3) and the native browsers QSA, there is no game in comparing with other CSS Selectors library, for most selectors “nwsapi” already outruns native QSA implementations and I can still see there is space for improvements.

It would be nice to have your feedback after running the above speed benchmark, I used Sizzle own Selectors Test Suite as a start but rewrote parts of it. I need to do more work on that.

I also included the latest w3c/web-platform-tests in the GitHub release in the test directory. Everything passes in the new and old testing I have, a few corrections and it will be ready for npm.

dperini on Oct 26, 2017

Ow wow, that’s so exciting!!! This will make people really happy, and be great for jsdom. I’ll definitely try to find some time to play around with it and give feedback.

domenic on Oct 26, 2017

@domenic, @zirro, in this case the reported issue is not due to jsdom but to nwsapi. I just pushed a commit as an attempt to fix this in my nwsapi repository. Care to try it out ?

dperini on Mar 19, 2019