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

Fixes #7170 paywall on foreignpolicy.com #7171

Closed

Conversation

HermannBjorgvin
Copy link

This removes the paywall on foreignpolicy.com

The two lines below may seem a bit redundant since this is the same element but the JavaScript on the page removes and adds this class back so this catches that, otherwise it flashes a dark modal background for a second.

foreignpolicy.com##div.tp-backdrop
foreignpolicy.com##.tp-active.tp-backdrop

URL(s) where the issue occurs

https://foreignpolicy.com/2020/03/25/blame-china-and-xi-jinping-for-coronavirus-pandemic/

Describe the issue

Modal popup with a paywall

This fixes #7170

Versions

  • Browser/version: 74.0-2
  • uBlock Origin version: 1.25.2

Settings

foreignpolicy.com##div.tp-modal
foreignpolicy.com##div.tp-backdrop
foreignpolicy.com##.tp-active.tp-backdrop
foreignpolicy.com##html>body.tp-modal-open:style(overflow: auto !important; height: auto; -webkit-overflow-scrolling: auto;)

Notes

After hitting a paywall I created the following rules to start with:

foreignpolicy.com##div.tp-modal
foreignpolicy.com##.tp-active.tp-backdrop

Then started with adding breakpoints to since I noticed it is replacing classes for the paywall to appear. the class tp-modal-open on the tag was blocking scrolling on the page so I created a filter which has more specific selector which overwrites those blocking values to auto.

tp-modal-resizing is a class that gets added to the tag but it doesn't affect the page visual so I didn't create a rule for it.

At this point the paywall was removed but there was still a quick flash of black on the page when it popped up and before it was removed after a bit of investigating and adding breakpoints to the page to catch DOM attribute modifications I noticed div.tp-backdrop.tp-active was modifying it's class attribute and removing the tp-active class, this breaks the rules I added to block the paywall. It's a simple fix, create two rules, one with and one without the tp-active class.

This removes the paywall on foreignpolicy.com

The two lines below may seem a bit redundant since this is the same element but the JavaScript on the page removes and adds this class back so this catches that, otherwise it flashes a dark modal background for a second.

foreignpolicy.com##div.tp-backdrop
foreignpolicy.com##.tp-active.tp-backdrop
@liamengland1
Copy link
Contributor

This won't be merged. #2317 (comment)

Also, a much easier solution is ||tinypass.com^$3p. 😄

@uBlock-user
Copy link
Contributor

Circumventing a paywall is considered out of scope

@HermannBjorgvin
Copy link
Author

@llacb47 thanks for the quick reply. Didn't know paywalls were out of scope.

Neat solution. This is my first filter I published so it's probably not the prettiest.

Is there any project currently focusing on paywalls?

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

Successfully merging this pull request may close these issues.

foreignpolicy.com paywall
3 participants