Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New way to find sponsored element #132

Open
arye321 opened this issue Sep 22, 2022 · 2 comments
Open

New way to find sponsored element #132

arye321 opened this issue Sep 22, 2022 · 2 comments
Labels

Comments

@arye321
Copy link

arye321 commented Sep 22, 2022

Hi, I wanted to make a pull request but the code is too complicated for me
so I'll suggest code improvement for finding sponsored elemnts

run this in facebook webpage console:

document.querySelectorAll("use").forEach(element=>{
  const link = element.getAttribute("xlink:href").substring(1)
  if (document.querySelector(`text[id=${link}]`).innerHTML === "Sponsored"){
      element.closest('div[role]').style.borderStyle = 'solid'
      element.closest('div[role]').style.borderColor = 'red'
  }
})

this will mark all current ads in english interface .

the new Sponsor label is inside an SVG with a <use> element, inside the use element theres a shadow root (closed) element.

image

you cant extract that so you have to follow the xlink:href of the use, which is always a #gid(number) , this leads to a <text> element

image

the innerHTML of the text element is the text inside the original element. if the innerHTML is 'Sponsored' you mark it.

hope it helps

@arye321 arye321 added the bug label Sep 22, 2022
@Sledmine
Copy link

This was not working for me, as it selects the entire div for where all the other posts live as well, I edited your selector to get the parent div the Sponsor post, it got dirty but it does the job, probably someone else can simplify it and integrate it with the extension:

document.querySelectorAll("use").forEach(element=>{
  const link = element.getAttribute("xlink:href").substring(1)
  if (document.querySelector(`text[id=${link}]`).innerHTML === "Sponsored"){
      element.closest('div > div:not([class]) > div[class] > div:not([class]) > div[class]').style.borderStyle = 'solid'
      element.closest('div > div:not([class]) > div[class] > div:not([class]) > div[class]').style.borderColor = 'red'
  }
})

It manages to highlight just the Sponsored post (remember editing name of the text element depending on your language).
image

@arye321
Copy link
Author

arye321 commented Oct 15, 2022

This was not working for me, as it selects the entire div for where all the other posts live as well, I edited your selector to get the parent div the Sponsor post, it got dirty but it does the job, probably someone else can simplify it and integrate it with the extension:

Right, they changed it a couple of days later, you can see my new method here:

https://github.com/arye321/fbab/blob/master/main.js

    useElements[len].closest(`div[class=""]`).hidden = true

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants