Opened on 09/30/2015 at 11:35:13 AM

Closed on 06/19/2017 at 01:42:56 PM

#3143 closed change (fixed)

Add polyfill for `:has()` CSS4 pseudo-selector to element hiding filters

Reported by: greiner Assignee: hfiguiere
Priority: P2 Milestone:
Module: Core Keywords:
Cc: mapx, Lain_13, sebastian, fhd, mario, kzar, rach, arthur, sergz, oleksandr Blocked By: #4394, #4726, #4796, #4962, #5287
Blocking: #2360, #5094, #5249, #5313 Platform: Unknown / Cross platform
Ready: yes Confidential: no
Tester: Unknown Verified working: no
Review URL(s):

Description (last modified by trev)


(taken from original description in #2360 about hiding elements by selecting their child elements)

Currently, there's no way to hide an element on a page dependent on its children. This proposed solution is based on existing CSS functionality, so it will be possible to bind an observer to the document to check for new parent nodes and bind another observer object to them to check for changes within only these particular nodes in case specific child node will be added. Over time it will be possible to completely disable such functionality due to native support for CSS4 selectors in newer browser versions.

It may be possible to look at the jQuery code for this functionality since they supported :has() pseudo-selector in their selectors long before it was even added into the CSS4 drafts.

Generally, this proposal has similar issues as CSS property filters such as requiring to hide elements manually and to observe the page for changes at runtime.

:has() and CSS property filters have to work in conjunction, therefore they need to be stored in the same filter class (see #4394). In addition, we will probably have to change the way CSS property filters work: Currently we eventually generate standard CSS rules for them, which are then being applied by the browser. For :has(), we have to apply the rules manually.

What to change

  • A new special pseudo-classe :-abp-has(...) should be added. Here, the parameter is a selector - this pseudo-class should only match elements where the inner selector produces any hits.
  • It should be possible to nest pseudo-classes, in particular :-abp-has(:-abp-properties(...)) has to be supported.
  • ElemHideEmulation class should get a new removeElements callback, to be called for any elements selected by filters with :-abp-has() pseudo-class. Filters only using :-abp-properties() should use addSelectors callback as before.

Optional changes

  • Allow :-abp-has() pseudo-classes to be nested.
  • Observe DOM changes to apply filters to dynamically added/modified elements


Attachments (0)

Change History (41)

comment:1 Changed on 09/30/2015 at 11:35:59 AM by greiner

  • Type changed from defect to change

comment:2 Changed on 09/30/2015 at 11:49:28 AM by greiner

  • Blocking 2360 added

comment:3 Changed on 09/30/2015 at 12:04:05 PM by mapx

  • Cc mapx Lain_13 added

comment:4 Changed on 06/17/2016 at 03:38:06 PM by fhd

  • Owner set to fhd

I'll have a go at this one.

comment:5 Changed on 06/17/2016 at 03:46:00 PM by fhd

  • Priority changed from Unknown to P2

comment:6 follow-up: Changed on 07/18/2016 at 11:05:41 AM by Lain_13

I think it's worth mentioning that :has() selector must work in combination with -abp-properties. So, filter like[-abp-properties="background: yellow"]) must hide all elements of class "block" with anything with word "yellow" in a "background" property inside of them.

Last edited on 07/18/2016 at 11:06:04 AM by Lain_13

comment:7 Changed on 08/17/2016 at 11:42:02 AM by kzar

  • Cc sebastian fhd added
  • Owner changed from fhd to kzar

comment:8 Changed on 08/17/2016 at 12:02:41 PM by kzar

  • Description modified (diff)

comment:9 Changed on 08/18/2016 at 11:43:44 AM by mapx

"waiting for #2388 to be closed probably makes the most sense to get the necessary architecture in place first"

#2388 ==> still opened #2398 ==> still opened #2402 (unit tests)

(fhd comment: Given how CSS property filters support has already landed in Firefox - how about closing this one (and #2388) and removing #2402 as a dependency? )

comment:10 Changed on 08/18/2016 at 11:46:11 AM by kzar

  • Blocked By 2388 removed

Yea I think you're right, I don't think this is blocked by #2388 any more. I'll remove that as blocking now.

comment:11 in reply to: ↑ 6 Changed on 08/18/2016 at 11:56:42 AM by mapx

Replying to Lain_13:

I think it's worth mentioning that :has() selector must work in combination with -abp-properties. So, filter like[-abp-properties="background: yellow"]) must hide all elements of class "block" with anything with word "yellow" in a "background" property inside of them.

it's exactly the last trick FB used to defeat the various userscripts (using css ::after)

comment:12 Changed on 08/22/2016 at 02:58:53 PM by kzar

  • Cc mario added

comment:13 Changed on 08/31/2016 at 01:59:42 PM by kzar

  • Cc kzar added
  • Owner kzar deleted

(I have had nearly no chance to look at this so far and am on vacation next week. Will reassign myself again when I have time if no one else has picked it up.)

comment:14 Changed on 09/02/2016 at 08:40:57 PM by ethaniel

Can't wait for this ticket to be resolved. Yandex is using every possibility to evade the block. Still seeing ads.

comment:15 Changed on 09/06/2016 at 06:57:46 AM by fhd

  • Owner set to fhd

With Dave gone for a while, I'll pick this up again, this time for real :)

I guess I still won't find enough time to finish it, but there's some ground work to be done I can get out of the way at the least, I'll create a blocking issue for that soon.

comment:16 Changed on 09/06/2016 at 09:03:28 AM by fhd

  • Blocked By 4394 added

comment:17 Changed on 09/06/2016 at 09:15:03 AM by fhd

  • Description modified (diff)

I've created #4394 for the ground work I was talking about. I'll take care of that first.

I realised that in order for :has() and CSS property filters to work in conjunction (which I also see as a must), we'll have to change the way CSS property filters are being applied somewhat fundamentally. I've updated the description a bit to reflect that.

comment:18 Changed on 09/13/2016 at 02:20:13 PM by rach

  • Cc rach added

comment:19 Changed on 11/22/2016 at 11:07:32 AM by fhd

  • Blocked By 4658 added

comment:20 Changed on 11/22/2016 at 02:35:45 PM by fhd

  • Blocked By 4658 removed

comment:21 Changed on 11/28/2016 at 02:51:47 PM by arthur

  • Cc arthur added

comment:22 Changed on 12/11/2016 at 11:41:40 AM by fhd

  • Blocked By 4726 added

comment:23 Changed on 03/07/2017 at 06:20:22 PM by hfiguiere

  • Blocked By 4962 added

comment:24 Changed on 03/15/2017 at 03:14:21 AM by hfiguiere

  • Review URL(s) modified (diff)

comment:25 Changed on 03/16/2017 at 02:33:35 PM by fhd

  • Owner changed from fhd to hfiguiere

comment:26 Changed on 03/24/2017 at 11:39:59 AM by sergz

  • Cc sergz added

comment:27 Changed on 03/28/2017 at 08:55:43 PM by hfiguiere

  • Status changed from new to reviewing

comment:28 Changed on 04/03/2017 at 02:13:58 PM by hfiguiere

  • Blocking 5094 added

comment:29 Changed on 04/13/2017 at 01:33:53 PM by oleksandr

  • Cc oleksandr added

comment:30 Changed on 04/26/2017 at 09:55:40 AM by trev

  • Blocked By 4796 added

comment:31 Changed on 05/16/2017 at 01:28:58 PM by hfiguiere

  • Blocking 5249 added

comment:32 Changed on 05/31/2017 at 03:49:36 PM by trev

  • Description modified (diff)
  • Ready set

comment:33 Changed on 06/01/2017 at 10:55:22 AM by trev

  • Blocked By 5287 added

comment:34 Changed on 06/01/2017 at 11:05:10 AM by trev

  • Description modified (diff)

I updated the description, the syntax modification is now #5287.

comment:35 Changed on 06/01/2017 at 11:15:06 AM by Lain_13

After recent changes in the description I'd like to clarify one thing:
Will ABP support :has() as originally were requested or only :-abp-has()? uBO already supports :has() and it would be nice to have compatibility between ABP and uBO from the get-go.

comment:36 Changed on 06/01/2017 at 11:59:45 AM by hfiguiere

Right now it is settled on :-abp-has() and the new filter syntax specified in #5287. :has() is not be supported.

comment:37 Changed on 06/13/2017 at 02:16:08 PM by hfiguiere

  • Blocking 5313 added

comment:38 Changed on 06/14/2017 at 01:12:55 AM by abpbot

A commit referencing this issue has landed:
Issue 3143 - Filter elements with :-abp-has()

comment:39 Changed on 06/14/2017 at 01:17:26 AM by hfiguiere

  • Review URL(s) modified (diff)

comment:40 Changed on 06/19/2017 at 01:42:14 PM by abpbot

A commit referencing this issue has landed:
Issue 3143 - Remove internal tests

comment:41 Changed on 06/19/2017 at 01:42:56 PM by hfiguiere

  • Resolution set to fixed
  • Status changed from reviewing to closed

Add Comment

Modify Ticket

Change Properties
as closed .
The resolution will be deleted. Next status will be 'reopened'.
to The owner will be changed from hfiguiere.
Note: See TracTickets for help on using tickets.