Nested click2load frames not working

umbralOptimatum commented 10 months ago

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 YouTube, Facebook or Twitch report. These sites MUST be reported by clicking their respective links.
[X] This is not a support issue or a question. For 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

I'm trying to use these rules:

||youtube.com^$3p,frame,redirect=click2load.html
||twitch.tv^$3p,frame,redirect=click2load.html
||safe.txmblr.com^$3p,frame,redirect=click2load.html

Tumblr wraps embed iframes in a safe.txmblr.com iframe. When a page has embedded Youtube or Twitch videos, clicking the click2load for safe.txmblr.com loads a second click2load for the embedded video, but clicking it does not load the video or have any other visible effect.

A specific URL where the issue occurs.

https://thefloatingstone.tumblr.com/post/727730225735204864

Steps to Reproduce

Load the above Tumblr page with the two rules enabled.
Click the click2load embed and a second click2load embed should appear.
Click the second click2load embed and nothing visibly happens.

Expected behavior

Click2load should work even when loaded by another click2load.

Actual behavior

Original embed never loads.

uBO version

1.55.0

Browser name and version

Firefox 115.6.0esr

Operating System and version

macOS 10.14.6

garry-ut99 commented 9 months ago

On Opera there is no issue, it always works as expected : the first click2load iframe appears ==> first click ==> then second click2load iframe apepars ==> second click ==> video loads fine

On Firefox (115 ESR) the behavior is unexpected/random :

sometimes video loads after the 1st click (no need for the 2nd click then)
sometimes video works just like above on Opera (after 2 clicks)
sometimes the second click doesn't work for the 1st time, but works for the 2nd time or 3rd, 4th etc.
sometimes the second click never works, no matter how many clicks

gorhill commented 9 months ago

I spent some time yesterday investigating this.

First, it works reliably in Chromium-based browsers.

Now in Firefox I cannot explain the behavior. I added multiple console.log at key points, and I definitely do see the self.location.replace() call being made with the Youtube URL, but it has no effect -- until some time has passed. Sometimes it works immediately, often there needs to be a delay of up to 30s before it works, but it eventually always work, just with some delay. I have also seen the behavior that allowing Tumblr iframe immediately also allows the YT iframe, so it's extremely inconsistent in Firefox and so far I cannot explain it other than by Firefox doing unexpected things internally.

umbralOptimatum commented 9 months ago

Thanks for looking into this. I gave it a couple more attempts; the second frame did not load after two minutes but clicking a few extra times loaded it instantly. I've only had it load once after a delay, that's what reminded me to open this issue. Ah well, one layer of click2load is probably fine.

Out of curiosity, did either of you test it with barebones iframes in case it's a tumblr-specific issue?

gorhill commented 9 months ago

clicking a few extra times loaded it instantly

Yes, it's what I meant, if we keep clicking it works eventually, sometimes after 10x times. Something inside Firefox is preventing the navigation from taking place. I didn't try to synthesize a minimal case.

gwarser commented 9 months ago

This works fine:

http://0.0.0.0:8080/iframe-root.html

iframe-root.html

<!DOCTYPE html>
<html>
        <head> 
        </head>
        <body style="background: yellow;">
        <div><iframe src="http://0.0.0.0:8080/iframe.html" style="width: 50%; height: 600px; background: green;"></iframe>
        </body>
</html>

iframe.html

<!DOCTYPE html>
<html>
        <head> 
        </head>
        <body>
        <div><iframe src="https://example.com/" style="width: 100%; height: 300px; background: blue;"></iframe>
        </body>
</html>

||example.com^$3p,frame,redirect=click2load.html
||0.0.0.0^$frame,redirect=click2load.html

garry-ut99 commented 9 months ago

I'm not sure whether it will be any useful or not, anyway, short description: while clicking the iframe, the following things can be observed:

the browser refresh button is animating
and the iframe document DOM content is being highlighted in yellow which means it keeps being refreshed but the content of it is the same all the time (I verified it by expanding it each time it gets highlighted in yellow)

ANIMATION

uBlockOrigin / uBlock-issues