Pretty cool, but yeah, you have to be careful of CSS injection (as mentioned by the author). There isn't too much harm that can be done if the user is typing this in himself or herself, but if the search query is pulled from the URL there might be some security implications.
For example, enter this into the search field:
"]), body, a:not([data-index="
This will hide the entire page. The last "a:not" selector is really inconsequential-- I just had to close the opening parenthesis and this just happens to work.
I'm curious if this is truly a 'security' concern, or more like a hackability issue. Though I could enter that string into the page myself, I can't actually start running scripts on the page or anything, can I?
Really, this doesn't seem any more 'dangerous' than opening the web-inspector and changing the CSS to hide.
Do you agree?
(It may sound like I'm trying to be an ass, but I am actually curious).
You can also clickjack, i.e. make a button that does something important invisible and stretch it across the entire page. Next time the user clicks, they'll inadvertently be clicking the button.
Edit: I did some research and testing and it looks like XBL and element behaviors are no longer possible in Firefox and IE 10, thankfully:
If you can get a user to click a link which exposes CSS injection, it can be a security issue.
For instance, you could change the text of links and buttons, and otherwise trick the user into doing something that s/he wouldn't otherwise.
My initial reaction is that you would need an additional moving part to turn this into a vulnerability. Say you had the ability to permalink to a filtered view -- the querystring param could carry an XSS payload... breaking out of the CSS context early, or maybe (and this is off-the-cuff speculation) staying in the CSS context but adding a rule which refers to an attacker-controlled file.
For example, enter this into the search field:
This will hide the entire page. The last "a:not" selector is really inconsequential-- I just had to close the opening parenthesis and this just happens to work.