Add :matches-css-* pseudo-class support #7
Comments
ameshkov
changed the title
|
@gorhill one more thing, we could simplify it a bit more if we restrict it to matching only one property. Here is what I am talking about. Instead of allowing complex property filters in one pseudo class: It seems reasonable to restrict each pseudo class to a single property filter. In this case we can anyway use a composite selector: |
Would this also apply to Had to think about it a bit, and I would be fine with one style property per I worried about having to call Incidentally, the two |
For all three. In fact I haven't yet faced a situation where matching two or more properties is required. |
Perfect. So all set in stone re. By the way, an advantage of |
Yep, thank you!
Yeah, that's how it is described, no trailing I've tried to use ABNF for the syntax specification. However, I am not sure if I've done properly and according to that rfc:) |
1. Added two tests that demonstrate why we need to implement the reverse search properly 2. Test 6.4 demonstrates why we'd better patch Sizzle to do it instead of the current approach 3. Added SIZZLE_PATCH #7 that demonstrates how the reverse search can be added to Sizzle
…aster * commit '5d9e1469f7abf74e2d1346061f5fa7c6149feb32': Fix for jshint
Description
This pseudo-class allows us to select an element by its style.
Syntax
Backward-compatible syntax:
Properties
property-nameName of the CSS property you want to check.
patternSimple regexp-like pattern which uses exactly the same rules as in Basic url-matching filters. We could use this implementation.
Examples
Select
divwith abackground-image.HTML code:
Selector:
Select
divwith::beforepseudo-element with the specified text.HTML code:
Selector:
Why do we need it
I have faced a couple of websites using a very complicated layout to circumvent ad blocking. Even
:has()and:contains()are not enough to block ads there.The latest example is
mail.yandex.ru. Ad layout is completely similar to the valid elements aside of the Ad label which is added with a::beforepseudo-element.Screenshot of the page layout:
With this new pseudo-class ad element can be selected with a filter like this:
Q: Why additional pseudo-classes for matching before and after
A: We could use something like this instead:
:before:matches-css(). However,:beforeis not a valid selector, you cannot select any element using it.Q: Why pattern-matching?
A1: Nothing prevents them from using a random string for an ad label, I hope pattern-matching is versatile enough.
A2: I suppose that using this approach we could also cover existing
abp-propertiesrules. Here is a list (mostly from EasyList Germany):The text was updated successfully, but these errors were encountered: