Mirrors/uBlock
1
0
Fork 0
mirror of https://github.com/gorhill/uBlock.git synced 2024-07-01 02:02:29 +02:00
Code Issues Releases Wiki Activity

Implement uBo naming convention, Update URLs, and some grammar & sentence updates

q1800 2022-02-06 13:45:55 -06:00
parent fb955931cf
commit 7257c9b972
1 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
Procedural-cosmetic-filters.md

@ -2,15 +2,15 @@
***
The concept of procedural cosmetic filtering was introduced with uBlock Origin ("uBO") [version 1.8.0](https://github.com/gorhill/uBlock/releases/tag/1.8.0).
The concept of procedural cosmetic filtering was introduced with uBlock Origin (uBO) [version 1.8.0](https://github.com/gorhill/uBlock/releases/tag/1.8.0).
The initial implementation was revised to allow chained/recursive use of the procedural operators with version [1.11.0](https://github.com/gorhill/uBlock/releases/tag/1.11.0)+. There is no limit on the number of operators chained, or the number of recursion level, aside common sense. Though, chaining to native CSS selector after procedural one was not supported before [1.17.5rc1](https://github.com/gorhill/uBlock/commit/8a88e9d93174badd6855c0e782737158c9ccd6f8).
As a reminder, use procedural cosmetic filters only for when plain CSS selectors won't solve a case.
Only use procedural cosmetic filters when plain CSS selectors won't work.
Normal, standard cosmetic filters are _declarative_, i.e. they are used as selector in a CSS rule, and completely handled by browsers through `style` tag elements.
Standard cosmetic filters are _declarative_, i.e. when used as a selector in a CSS rule and handled by browsers through `style` tag elements.
_Procedural_ means javascript code is used to find DOM elements which must be hidden. A procedural cosmetic filter makes use of cosmetic filter _operator_, which will tell uBO how to find/filter DOM elements in order to find which DOM elements to target.
_Procedural_ means JavaScript code will find DOM elements that it must hide. A procedural cosmetic filter uses a cosmetic filter _operator_. That will tell uBO how to find/filter DOM elements to find which DOM elements to target.
#### Important:
@ -33,8 +33,8 @@ _Procedural_ means javascript code is used to find DOM elements which must be hi
- Examples:
- `mobile.twitter.com##main [role="region"] > [role="grid"] > [role="rowgroup"] [role="row"]:has(div:last-of-type span:has-text(/^Promoted by/))`
- `strikeout.me##body > div:has(img[alt="AdBlock Alert"])`
- `yandex.ru##.serp-item:has(:scope .organic > .organic__subtitle > .label_color_yellow)` - `:scope` forces `.organic` to match inside `.serp-item` ([why `:scope` is needed](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll#JavaScript), [general `:scope` doc](https://developer.mozilla.org/en-US/docs/Web/CSS/:scope))
- `strdef.world##div[style]:has(> a[href="http://www.streamdefence.com/index.php"])` - `>` forces `a` to be direct descendant of `div[style]`
- `yandex.ru##.serp-item:has(:scope .organic > .organic__subtitle > .label_color_yellow)` - `:scope` forces `.organic` to match inside `.serp-item` ([why `:scope` is needed](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelectorAll#javascript), [general `:scope` doc](https://developer.mozilla.org/en-US/docs/Web/CSS/:scope))
- `strdef.world##div[style]:has(> a[href="https://www.streamdefence.com/index.php"])` - `>` forces `a` to be direct descendant of `div[style]`
The `:has(arg)` operator is actually a planned pseudo-class in CSS4, but as of writing no browser supports it. Instead of waiting for browser vendors to provide support, uBO provides support for `:has(arg)` as a procedural operator.