eBay Sponsored links. Shadow DOM

[JSCFORCE]

Prerequisites

• [X] I verified that this is not a filter list issue. Report any issues with filter lists or broken website functionality in the uAssets issue tracker.
• [X] This is not a support issue or a question. For any support, questions or help, visit /r/uBlockOrigin.
• [X] I performed a cursory search of the issue tracker to avoid opening a duplicate issue.
• [X] The issue is not present after disabling uBO in the browser.
• [X] I checked the documentation to understand that the issue I am reporting is not normal behavior.

I tried to reproduce the issue when...

• [X] uBO is the only extension.
• [X] uBO uses default lists and settings.
• [X] using a new, unmodified browser profile.

Description

eBay uses the shadow DOM to mark certain listings as SPONSORED.

we can't remove them since we can't target the shadow DOM.

Since sites don't get much bigger than this is is time to add support for a :shadow-root(...) operator?

A specific URL where the issue occurs.

https://www.ebay.com/sch/i.html?_from=R40&_nkw=houses&_sacat=0

Steps to Reproduce

Any attempt to target or distinguish the sponsored listings from the normal ones fail.

Expected behavior

Normally removing an ad would be a snap but not when the CSS is hidden from us.

Actual behavior

Can't remove the sponsored ads with uBlock origin in its current form.

uBO version

1.44.4

Browser name and version

Vivaldi 5.4.2753.51

Operating System and version

Windows 10.0.19044.2006

[gwarser]

Can you capture DOM tree with this shadow element? I don't see them in Firefox and Chrome. Only "Sponsored" text in every list entry, but hidden in non-sponsored offers.

[mapx-]

[peace2000]

Also another major service, Facebook has started to use shadow dom: https://github.com/uBlockOrigin/uBlock-issues/discussions/2280

Text "Sponsoroitu" means "Sponsored" in English. Filters can't identify sponsored posts anymore on Facebook.

[krystian3w]

Also I don't found active shadow dom at eBay.

Strange is that page fastly dorpped use span:first-line - maybe script often change method to show text "sponsored".

[JSCFORCE]

Also I don't found active shadow dom at eBay.

Strange is that page fastly dorpped use span:first-line - maybe script often change method to show text "sponsored".

eBay is definitely still using shadow DOM.

[krystian3w]

≈30 day ago used :first-line but AdGuard and uBo still don't added this to stable and IMO ABP don't added filter to anti-cv project to these fastly rewrite page.

When they detect adding it in the "beta" they can become a page similar to "soft98.ir".

[ethan-xd]

I have a filter that blocks Facebook ads, however the attributes are removed by Facebook. Yet another example as to why we need a straight up :remove() filter. Facebook can't fuck with what's not there anymore.

[JSCFORCE]

I have a filter that blocks Facebook ads, however the attributes are removed by Facebook. Yet another example as to why we need a straight up :remove() filter. Facebook can't fuck with what's not there anymore.

:remove() is already supported.

[krystian3w]

https://github.com/gorhill/uBlock/releases/tag/1.26.0

• Add procedural cosmetic operators remove() and upward()

or this no works on shadow DOM?

---

Or we misunderstood "straight up" as "no implemented at all".

[ethan-xd]

I have a filter that blocks Facebook ads, however the attributes are removed by Facebook. Yet another example as to why we need a straight up :remove() filter. Facebook can't fuck with what's not there anymore.

:remove() is already supported.

?? What??? I looked over for documentation and couldn't find it, I could only find issues saying that it wouldn't be added. Oh well. lol

[mapx-]

https://github.com/gorhill/uBlock/wiki/Static-filter-syntax#subjectremove

[ethan-xd]

I don't get how I couldn't find this, I looked for like half an hour. Okay, thank you everyone for letting me know.

[gwarser]

For me, this span:

<span aria-hidden="true">​<wbr>Sponsored</span>

when width is set by var(...) to ~58px (as reported by getComputedStyle, it's 98% in the variable), then "Sponsored" is hidden, but when is set to ~59px, it's shown.

No shadows in Chrome or Firefox.

[krystian3w]

But :matches-css(display: inline) e.g. with has-text works?

[gwarser]

This works on Chrome and Firefox:

www.ebay.com##.clearfix.s-item__wrapper span[aria-hidden="true"]:matches-css(height: 20px):upward(.clearfix.s-item__wrapper):remove()

[JSCFORCE]

This works on Chrome and Firefox:

www.ebay.com##.clearfix.s-item__wrapper span[aria-hidden="true"]:matches-css(height: 20px):upward(.clearfix.s-item__wrapper):remove()

The following filter is a little better, removes some whitespace your filter leaves behind.

www.ebay.com##.clearfix.s-item__wrapper span[aria-hidden="true"]:matches-css(height: 20px):upward(li.s-item):remove()

but still we need a shadow root operator as soon as possible since this filter is very fragile.

I hope gorhill can get to this as soon as he has a free moment.

[JSCFORCE]

The above filter is no longer valid.

[JSCFORCE]

Any update?

[gwarser]

!#if env_firefox
www.ebay.com##li.s-item span[aria-hidden="true"]:matches-css(width: /58\.|62px/):upward(li.s-item):style(position:absolute!important;left:-7556482px!important;)
!#endif
!#if env_chromium
www.ebay.com##li.s-item span[aria-hidden="true"]:matches-css(width: /59\./):upward(li.s-item):style(position:absolute!important;left:-7556482px!important;)
!#endif

?

[krystian3w]

This is maximum of move: -7556482px?

[gwarser]

Ah, no, just random, you can try simply hiding or removing - this part was left from my other attempts.

[fyrefyre]

!#if env_firefox
www.ebay.com##li.s-item span[aria-hidden="true"]:matches-css(width: /58\.|62px/):upward(li.s-item):style(position:absolute!important;left:-7556482px!important;)
!#endif
!#if env_chromium
www.ebay.com##li.s-item span[aria-hidden="true"]:matches-css(width: /59\./):upward(li.s-item):style(position:absolute!important;left:-7556482px!important;)
!#endif

?

Chrome, it's a bit hit or miss. Occasionally it removes just Sponsored. Other times it doesn't remove any. And then other times, it removes everything like:

[JSCFORCE]

Yeah that new filter break this page with chrome. https://www.ebay.com/sch/i.html?_from=R40&_nkw=knives

Works or breaks it randomly.,..

None of these are good enough, we just don't have the proper tool to address this issue.

[krystian3w]

Maybe filter works good with GNU/Linux fonts.

[gwarser]

You can try setting font-face and fixed size for this element. Even reset some values by https://developer.mozilla.org/en-US/docs/Web/CSS/unset#see_also

---

Maybe filter works good with GNU/Linux fonts.

Does not work on second page of the results :)

[krystian3w]

Modern browsers added https://developer.mozilla.org/en-US/docs/Web/CSS/revert when unset does not exist

[JSCFORCE]

Does anyone have any update on this issue? I am absolutely sick of seeing ads on ebay. We need a proper and permanent solution to this!!!

[JSCFORCE]

I will gladly pay you 100 dollars right now for a proper solution.

Just say the word.

On Mon, Dec 5, 2022 at 1:42 PM Raymond Hill @.***> wrote:

I asked the paid employees and none of them answered back.

— Reply to this email directly, view it on GitHub https://github.com/uBlockOrigin/uBlock-issues/issues/2297#issuecomment-1338057527, or unsubscribe https://github.com/notifications/unsubscribe-auth/AWVGVCWNGLE35E6EXQJM3EDWLZARJANCNFSM6AAAAAAQXFYOII . You are receiving this because you authored the thread.Message ID: @.***>

[liamengland1]

@JSCFORCE try these

ebay.com##li.s-item:has(.s-item__detail:nth-last-of-type(1):has(>span>span>span[aria-hidden="true"]:matches-css(width:/5[89]\.[0-9]+/):matches-css(border-right-width:/0\./):not(:matches-css(width:/5[0-7]\.[0-9]+/):matches-css(border-right-width:/1\./)):has(wbr+span))):remove()
!ebay.com##li.s-item:has(.s-item__detail:nth-last-of-type(1):has(>span>span>span[aria-hidden="true"]:matches-css(width:/5[89]\.[0-9]+/):matches-css(border-right-width:/1\./):not(:matches-css(width:/5[0-7]\.[0-9]+/):matches-css(border-right-width:/0\./)):has(wbr+span))):remove()

Ebay employees are likely watching this thread though

[gorhill]

I will gladly pay you 100 dollars right now for a proper solution.

Clearly I am not doing this for money, so I suggest you fork and contract another developer.

[krystian3w]

You mean fork all uBo add-on repository to implement more stable filters to hide paid promo by cover read shadow root/dom?

This will rather cause the same problem as with Nano Adblocker ("why Perfect code don't arrive to PR").

---

Filters based on matches-css maybe possible move to quick fixes if don't down after 5 seconds after commit will be public and AI rebuild sizes or method to recover ads.

[gorhill]

Unsubscribing, mention me if you need me.

[JSCFORCE]

@gorhill

I was trying to have a conversation. I am desperate and was simply responding to your original comment in the only way I know how. i.e. literally.

[krystian3w]

Github no support direct reply to specific comment in issue - discussion does because is similar to reddit.

But notification on reddit works better than gerneric in any Github discussion.

Shadow root/dom won't escape us anyway as msn already applies it to every embedded object on the homepage #2215 https://github.com/uBlockOrigin/uBlock-issues/issues/2252 https://github.com/uBlockOrigin/uBlock-issues/issues/2346.

It is enough that the advertising code escapes the possibility of aost.

[uBlock-user]

www.ebay.com##.clearfix.s-item__wrapper span[aria-hidden="true"]:matches-css(height: 20px):upward(li.s-item):remove()

:remove() doesn't work on elements inside shadowRoot.

[mapx-]

Add a scriptlet to inject stylesheet into shadow DOM https://github.com/AdguardTeam/Scriptlets/issues/267

https://github.com/AdguardTeam/Scriptlets/blob/master/wiki/about-scriptlets.md#inject-css-in-shadow-dom

[gwarser]

:remove() doesn't work on elements inside shadowRoot.

Still no shadows on my side.

Add a scriptlet to inject stylesheet into shadow DOM

But specific filters work in uBO. ?

[uBlock-user]

Still no shadows on my side.

I was speaking about my experience with shadowRoot, not specific to ebay here.

[krystian3w]

I can hide borders on MSN.com with generic filter on opened shadow DOM/root:

##msft-article-card[class=""]

So scriptlet unlock use long CSS path or for only closed shadow DOM/root?

[pavelmalik]

Any update on this? I've been using Stylus with approach , but obviously removing the nodes from the tree would be preferable

https://github.com/abp-filters/abp-filters-anti-cv/issues/946#issuecomment-1306992495

[gwarser]

@pavelmalik

ebay.com##.s-item__detail--primary:last-child *:style(font-weight: 900 !important;color: red !important;font-size: 220px;line-height: 1.15;)
ebay.com##.s-item__detail--primary:last-child > * > *:style(bottom: 1em !important;left: 0px !important;)
ebay.com##.s-item__detail--primary:last-child > * > * > * > *::before:style(content: "████";)

Does not work.

[krystian3w]

Works under body: https://user-images.githubusercontent.com/35370833/213710303-98c84f4f-13be-407f-be52-a4e289583bb7.png

Maybe glitch in tabs.insertCSS() (scripting.insertCSS()).

[pavelmalik]

The actual one I'm using

@-moz-document url-prefix("https://www.ebay.com/") {
 .s-item__detail--primary:last-child * {

        font-weight: 900 !important;

        color: #fff0 !important;

        font-size: 220px;

        line-height: 1.1;

    }

    .s-item__detail--primary:last-child > * > * {

        bottom: 1em !important;

        left: 0px !important;

    }.s-item__detail--primary:last-child > * > * > * > *:before {

        content: "█████";

    }
}

[gwarser]

Works under body

And other entries down below? The whole page is marked red for me.

The actual one I'm using

This one looks OK

ebay.com##.s-item__detail--primary:last-child *:style(font-weight: 900 !important;color: #fff0 !important;font-size: 220px;line-height: 1.1;)
ebay.com##.s-item__detail--primary:last-child > * > *:style(bottom: 1em !important;left: 0px !important;)
ebay.com##.s-item__detail--primary:last-child > * > * > * > *::before:style(content: "█████";)

[liamengland1]

this filter also works :P

ebay.com##li.s-item:has(.s-item__detail:nth-last-of-type(1):has(>span>span>span[aria-hidden="true"]:matches-css(width:/5[89]\.[0-9]+/):matches-css(border-right-width:/0\./):not(:matches-css(width:/5[0-7]\.[0-9]+/):matches-css(border-right-width:/1\./)):has(wbr+span))):not(:has(symbol)):remove()

[JSCFORCE]

this filter also works :P

ebay.com##li.s-item:has(.s-item__detail:nth-last-of-type(1):has(>span>span>span[aria-hidden="true"]:matches-css(width:/5[89]\.[0-9]+/):matches-css(border-right-width:/0\./):not(:matches-css(width:/5[0-7]\.[0-9]+/):matches-css(border-right-width:/1\./)):has(wbr+span))):not(:has(symbol)):remove()

That filter does not work for me.

[liamengland1]

That filter does not work for me.

Sorry that it didn't work for you, it worked for me as you can see in this video. It's possible (likely?) that eBay slightly varies the DOM and CSS values so that this filter is not consistently effective.

https://user-images.githubusercontent.com/16567977/213843566-3fcab7a1-7d14-41a8-b2be-2e540bd51bd1.mp4

[krystian3w]

But we use 1 line = 1 product.

[stephenhawk8054]

I see that in the href of sponsored product, the length of the end characters after %3A are shorter than normal products.

Can anyone test

www.ebay.com##li.s-item a.s-item__link[href]:matches-attr(href="/%3A\w{12}(&.+)?$/"):upward(li.s-item)

?

If {12} doesn't work, try {11,13}

[JSCFORCE]

I see that in the href of sponsored product, the length of the end characters after %3A are shorter than normal products.

Can anyone test

www.ebay.com##li.s-item a.s-item__link[href]:matches-attr(href="/%3A[a-zA-Z0-9]{11,13}$/"):upward(li.s-item)

?

Appears to be working.

https://www.ebay.com/sch/i.html?_from=R40&_nkw=ti-84+plus+ce