Skip to content

Ability to remove DOM element instead of hiding?  #2252

@kasper93

Description

@kasper93
Contributor

I know that it is canonical way to hide blocked elements. But sometimes it might be useful to actually remove DOM element. At least I don't have any other idea for the following testcase.

  1. Go to http://www.wykop.pl/
  2. Switch view mode to "grid". (button on right hand side - marked with red circle on screenshot)
  3. You will see that ads are properly hidden, but this leave blank items in grid. When I manually remove hidden element, grid is properly shown - without blank spaces.

To reproduce those filters are needed.

wykop.pl##li.link:has(a[href*='wykop.pl/reklama'])
wykop.pl##li.link:has(a[href*='wykop.pl/paylink'])
wykop.pl##li.link:has(a[href*='wykop.pl/market'])
wykop.pl##li.link:has(.adsbygoogle)

Any ideas how we can work this out? I know leftovers are not that bad, but still would be nice if we could remove them :)

wykop_leftovers

Activity

kasper93

kasper93 commented on Dec 19, 2016

@kasper93
ContributorAuthor

Also quite similar issue is with ul#dyingLinksBox thing. It is a list of some links. First one sometimes is advert. But you have arrow buttons to go through the list.

The advert is hidden with the same filters I posted in first post. I can in fact show the non-ad element with wykop.pl##.dying-links.link:nth-of-type(2):style(display:list-item;!important) but their JS go through all children of ul#dyingLinksBox and set display: none; or display: list-item so if we go back to the ad we lost the arrow buttons. Best way would be to remove the element. Not sure it is something we can expect uBlock to do. I always used user.js but since uBlock is so powerful it kind of don't make sense anymore except few minor issues.

ur

EDIT:
Here is the filter which in theory should show first not hidden by uBlock element in #dyingLinksBox when all element are hidden. But it doesn't work. xpath works as expected, but uBlock doesn't inject the style. Probably because the filter is evaluated too soon? Or it just doesn't work with xpath.

wykop.pl##:xpath(//ul[@id='dyingLinksBox'][count(descendant::li[not(contains(@style,'display:none'))][not(string-length(@hidden)=0)]) = 0]/li[not(@hidden)][1]):style(display:list-item;!important)

Hrxn

Hrxn commented on Dec 20, 2016

@Hrxn

What did you mean by manually removing the hidden element? Do you use some userscript / userscript extension? Or manually from the console, etc. ?

lewisje

lewisje commented on Dec 20, 2016

@lewisje

He has explained why he won't do it already: #2211 (comment)

gorhill

gorhill commented on Dec 20, 2016

@gorhill
Owner

uBlock doesn't inject the style

Because the :style operator currently works only with plain CSS selectors, not procedural ones. uBO uses the CSS selector to create a CSS rule, which of course won't work for procedural selectors (:matches-css, :has, etc.)

kasper93

kasper93 commented on Dec 20, 2016

@kasper93
ContributorAuthor

What did you mean by manually removing the hidden element? Do you use some userscript / userscript extension? Or manually from the console, etc. ?

I think it doesn't really matter how I did that. Anyway I used to use my script for a long time. Back in the day most things was not possible to hide with adblock like addons. https://github.com/kasper93/userscripts/blob/master/UkryjWykopPoleca.user.js Recently I decided to port it to uBlock filters. And only three issues are remaining.

  1. Leftover space from hidden elements.
  2. dyingLinksBox thingy.
  3. $("body").removeClass("screening"); They have fullpage ads sometimes and ad itself is hidden with wykop.pl##a[href*="wykop.pl/tracker"] but there are some css being applied to body for example whole body width is lower.

While I agree 2 and 3 might be out of the scope for uBlock. I think 1 is something we can discuss further, what do you think?

Anyway don't consider this issue to be request for a feature, I simply want to signalize problems I encountered. Maybe we find some solutions :)

lewisje

lewisje commented on Dec 20, 2016

@lewisje

If the "leftover space" is caused from the page deliberately making some part of it less than full-width or full-height ("pulling in", as opposed to having other content "push in"), then it's outside the scope of uBlock Origin.

lewisje

lewisje commented on Jan 16, 2017

@lewisje

I already linked to the comment where @gorhill explains why he won't do it, but thanks for explaining DOM Manipulation 101 to us.

gorhill

gorhill commented on Apr 23, 2017

@gorhill
Owner

@lewisje About your comment at https://adblockplus.org/forum/viewtopic.php?f=10&t=52321:

uBlock Origin has implemented this with different syntax

uBO does override inline styles with display: none !important; by default, there is no need for users to worry about this.

For example, uBO works fine with http://raymondhill.net/ublock/adbox.html -- where one element to hide uses style="display: block !important".

chylex

chylex commented on May 1, 2017

@chylex

@gorhill You said you wanted real world cases for removing elements - if you use uBlock on a video element, it just hides it while it keeps autoplaying in the background when you reload the page. I'd appreciate a way to force these elements out of the DOM instead of blocking an element thinking it was gone, and several days later getting jumpscared by invisible videos..

gorhill

gorhill commented on May 1, 2017

@gorhill
Owner

"Real world cases" means actual URLs where I can see for myself what can be done .

chylex

chylex commented on May 1, 2017

@chylex

Here's an example rule that kept autoplaying the video trailer on the site:

! 18. 12. 2016 15:24:08 http://www.metacritic.com/game/pc/overwatch
www.metacritic.com##.video_and_autoplay
gorhill

gorhill commented on May 1, 2017

@gorhill
Owner

Blocking large media elements would work for that case. (which is even better than a cosmetic filter since the bandwidth is saved).

gorhill

gorhill commented on May 1, 2017

@gorhill
Owner

Works for me. What your threshold for the size? It's 250 KB here.

chylex

chylex commented on May 1, 2017

@chylex

50 kB, only turning it on for individual websites. Both sites still load and autoplay the videos - http://i.imgur.com/Mm0UCxw.png. Using Firefox Developer Edition 54.0a2, 64bit.

It also doesn't solve a case where you'd only want some videos to play, for example blocking twitch's mini player but not blocking the main player (you can do this in twitch settings, but just as an example).

27 remaining items

Loading
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @slackero@gorhill@kasper93@vparitskiy@chylex

        Issue actions

          Ability to remove DOM element instead of hiding? · Issue #2252 · gorhill/uBlock