riad-azz / facebook-sponsor-blocker

Firefox extensions for Facebook to block sponsored and suggested from your feed.
https://addons.mozilla.org/en-US/firefox/addon/fb-sponsor-blocker/
MIT License
9 stars 0 forks source link

Does not work in touch.facebook.com #3

Open dhananjaipai opened 1 year ago

dhananjaipai commented 1 year ago

Describe the bug I use Firefox Beta for android with custom add-ons enabled and was hoping to use Facebook through the browser ad free since the mobile app is unusable these days. I am able to install the extension but it does not seem to work on the domain.

To Reproduce Steps to reproduce the behavior:

  1. Go to touch.facebook.com
  2. Scroll down through newsfeed
  3. See sponsored posts

Expected behavior Sponsored posts are hidden

Screenshots -will edit and add if needed.

Desktop (please complete the following information):

Smartphone (please complete the following information):

Additional context Add any other context about the problem here.

riad-azz commented 1 year ago

Hello dhananjaipai,

Thank you for reaching out! I've looked into the matter, and found the fix is adding the domain touch.facebook.com regex into the isMainFeedLocation() function in the scripts/content.js file. I'm busy with work atm but I will add this for the next update soon.

Thank you for bringing this to our attention! I appreciate the feedback.

Best regards,

dhananjaipai commented 1 year ago

Hi riad-azz,

Really appreciate the quick response! Thank you for your time in maintaining this add-on

But it seems the fix might be a bit more complicated, since the posts Selector seems to be different for that domain. Current value for www.facebook.com is postsSelector = "div > div > div.x1yztbdb.x1n2onr6.xh8yej3.x1ja2u2z";

I just did a quick scan and many of the tamper monkey/grease monkey scripts also seem to fail when running touch.facebook.com in an emulated tab in the browser because of this dom selector difference

I did not dig much deep, but atleast the m.facebook and touch.facebook domains seemed to have a similar dom structure for the divs. I can help test things out if needed, but I assume you will have to update the selector variables based on the domain name as well.

Best regards,

riad-azz commented 1 year ago

I understand, so it essentially has a different structure for mobile devices, which isn't surprising given the need for responsiveness. The add-on was primarily designed for the desktop version, but I guess it's about time to add mobile support as well.

I genuinely appreciate the feedback. However, I'm currently dealing with a heavy workload, so it may take me a bit of time to follow up on this but I will get to it as soon as I can.

Have a great day!

dhananjaipai commented 1 year ago

Sure. there is nothing urgent or pressing about the issue. thanks again for looking into it and extending the support!

Just to give a couple more updates (for others who may be also facing the same issue) You can use ublock origin add-on in Firefox and it blocks all sponsored posts in m.facebook.com (but not in touch.facebook.com)

There is also a custom filter you can add to block suggested for you posts. Refer ublock docs to see how to use this. m.facebook.com##[data-mcomponent="MScreen"]>div[class="m"]>div:has-text(Suggested for you)

The problem however is that the DOM jumps randomly and the infinite scroll glitches with a large empty space at the bottom since the page height is now way smaller after hiding all the sponsored and suggested posts (and layout glitches even with only hiding sponsored posts)

Not sure what the best workaround would be here since "hiding" the div causes layout issues. Perhaps a flag to keep the div in the DOM but overwrite/blackout the content would be useful since this will retain the page height and remove these skips during scroll and layout errors (which I am assuming is when the rules are revaluated and the DOM content changes randomly due to potential viewport/scroll based content rendering optimizations in the mobile sites by Facebook)