What is meant by "Vulnerable with: css class selector" for JQuery?

Question

I'm mostly a beginner in cybersecurity. I came across this the other day about how JQuery 1.3.2 is vulnerable to CSS Selectors and Location Hash (source).

I understand how XSS works and I know what CSS selectors are. But I don't really understand what it meant by Vulnerable with CSS class selector. Like does it mean if whenever a site is using JQuery 1.3.2, is it possible to carry out an XSS attack on it? If so, in what ways would it be possible?

I'll be really thankful if someone can explain how exactly this works in a real-world scenario.

Arminius · Accepted Answer · 2017-11-13T03:02:45.020

In jQuery you can specify a CSS selector and HTML code with the same shorthand.

This is a selector:

$('#some-thing')

This is HTML that gets evaluated immediately:

$('<svg onload=alert(1)>')

This is a real-life code sample for parsing a selector from the location hash (the URL part after a #):

var x = $('#' + window.location.hash.substr(1));
x.addClass('highlighted').find('div').show();

It's taken from this question and a similar approach is (dangerously) recommended in this SO thread.

See the problem with it? The author's intent was to allow a user-controlled CSS selector, but if you open the affected site as https://example.com/#<svg onload=alert(1)>, you end up with this ambiguous selector:

$('#<svg onload=alert(1)>');

Older versions of jQuery run this as HTML code and thereby create an XSS flaw since the JS event handler would be executed immediately once the DOM node is created. However, newer versions decide that a string which doesn't start with an angle bracket must be parsed as a selector, thereby mitigating the flaw.

From the docs:

If a string is passed as the parameter to $(), jQuery examines the string to see if it looks like HTML (i.e., it starts with <tag ... >). If not, the string is interpreted as a selector expression, as explained above. But if the string appears to be an HTML snippet, jQuery attempts to create new DOM elements as described by the HTML.

You can read about how this behavior was changed in the discussion to bug #9521.

The page you linked just notes with what kind of selector each version is vulnerable.

I imagine a proper Content-Security-Policy would mitigate the risk even with older jQuery versions? — Niet the Dark Absol, Nov 13 '17 at 19:10
@NiettheDarkAbsol It really would not offer any protection, the script is being included inline with the page as if the page author put it there. — trognanders, Nov 14 '17 at 05:47
As a CSS developer stumbling on this question, it is absolutely fascinating. — ESR, Nov 14 '17 at 05:54
The event handler would be disabled by Content-security-policy because it’s inline script, and that is disabled by default when using CSP. — Erlend, Nov 14 '17 at 06:01
I suppose I should have explicitly said, a CSP that doesn't include `unsafe-eval`. — Niet the Dark Absol, Nov 14 '17 at 09:59

What is meant by "Vulnerable with: css class selector" for JQuery?

1 Answers1