Any way to prevent iFrames from autofocusing?

I have an app where a tabbed container houses an iFrame below other components and hence below the fold.

Everything works as expected, except that when a row in a table that sets the URL is visited, the browser auto-focuses the page onto the iFrame.

This also happens when the container tab is first visited: as the table is populated via query, the first row gets selected as a result, and the iFrame is spun up.

This is disruptive, as while it's nice to have the iFrame begin loading as a result of table-row selection, the most important information is at the top of the page, which the user is being forcibly scrolled away from.

I've looked through the component documentation as well as the iFrame's settings, and nothing seems to indicate control over this focusing.

I'm using macOS Chrome Version 106.0.5249.61 (Official Build) (arm64)

I'm assuming a workaround is just to have a button that unveils the iframe upon clicking, and whose state is reset after each query/URL load, but I'd like to avoid that extra barrier if possible.

Hey @dguzzo

So far when I try setting the URL on an iframe using either a "Control component" event handler or by passing a dynamic value to the iframe's URL field it seems to not autofocus. Could you share a bit more about your setup so that I can try to reproduce the behavior from that information? For instance, how exactly are you setting the URL on your iframe, and does your table have any other event handlers attached to it?

It's often helpful if we can get an export of your app or take a peek into your org as well to see if we notice anything unexpected! :slightly_smiling_face:

Sorry for the long delay here, @Kabirdas. I've managed to isolate it to a test app, however the bad news is that the page in question is our web-app and would require an authenticated sign-in to reproduce on your end. But I'll attach it all the same:

test iframe focus.json (11.4 KB)


(Forgive the minuscule gif; the next size up is just over the 4MB limit here.)

It seems there's something about the page in particular that is pulling focus. It's not every view of the app, just some. Seems to be ones displaying a Mapbox component, but I tried other, completely different sites using Mapbox without the same focusing effect. So I dunno.

Regardless, I wouldn't have expected the embedded page to be able to affect its container view in this manner.

I think I'm just going to remove the iFrame from our Retool app because it's not that important for our use-case anyway.