turbolinks-form icon indicating copy to clipboard operation
turbolinks-form copied to clipboard

Autofocus is not respected after replacing the DOM

Open lcmen opened this issue 3 years ago • 0 comments

Hi! Thank you for this library, it's really helpful for working with remote forms. I've noticed that once content gets replaced, elements with autofocus="true" attribute are not being focused. I've looked at Turbolinks code and I see they have some special code for handling it but not sure if it can be triggered via events.

For the time being, I've overridden handleResponse method from TurbolinksForm to focus the element:

const turbolinksFormHandleResponse = TurbolinksForm.handleResponse;

TurbolinksForm.handleResponse = function(xhr, renderingError) {
  turbolinksFormHandleResponse.call(this, xhr, renderingError);
  const el = Turbolinks.controller.view.getSnapshot().findFirstAutofocusableElement()
  el && el.focus();
}

lcmen avatar Mar 31 '21 08:03 lcmen