I have:
<iframe name="form-response" id="form-response" class="hidden" src="" width="0" height="0" tabindex="-1"></iframe>
<form accept-charset="UTF-8" class="form" target="form-response" method="post" action="https://......">
The page is part of a single page app, so it is constructed. After much experimentation, I discovered that putting the form on the page after the page has drawn causes the targeting to fail, and the form submission response opens in a new tab rather than being directed into the iframe. This is true in Chrome and Safari, but not in Firefox.
Is there some point at which the browser examines its page and decides what targets are on-page vs what should go to a new tab? Is there some way to tell it to look again?
More details:
I'm working in an esoteric JS framework. The page loads, fetches some data, then updates with the fetched data (at which point the form is created and inserted, along with its iframe target element). I stripped the form content down to the bare minimum (a submit button), but the opening-in-new-tab persisted. Having nothing requiring data, I had the form create immediately on loading, and found the problem went away. I tried wrapping the form-creation in a setTimeout
, and the problem returned, even with a time of zero.
It's possible that the framework is doing something to cause the problem, but I don't know what it could be. It is not changing the DOM around or in the form. That is exactly the same in the working and non-working instances.