Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
Problem/Motivation
After editing an image with the entity browser and clicking save or closing the modal, the form submit button gets focused and the page scrolls to the bottom. This happens only while editing, not while adding new entities.
Comment | File | Size | Author |
---|---|---|---|
#8 | 3053181-edit-save-button-focus-8-interdiff.txt | 444 bytes | sasanikolic |
#8 | 3053181-edit-save-button-focus-8.patch | 386 bytes | sasanikolic |
#7 | 3053181-edit-save-button-focus-6.patch | 407 bytes | sasanikolic |
Comments
Comment #2
oknate+1 on this! I was noticing this this morning. This would be great to fix. I suspect it has something to do with the ajax update of the underlying element. It loses the focus because the element it was focused on was removed.
Comment #3
sasanikolic CreditAttribution: sasanikolic commentedI also believe that for accessibility reasons, we should return the focus to the element that was focused before the entity browser modal was opened:
- Before opening the modal, save a reference to document.activeElement. After closing the modal, focus the reference to the previous activeElement.
Comment #4
sasanikolic CreditAttribution: sasanikolic commentedI did some debugging here, but could not find a triggering element in the event object of the dialogopen/beforecreate functions.
I also tried to have a click event listener on edit/change buttons, but that also didn't work as expected. Any idea where to write a fix for that @oknate?
Comment #5
sasanikolic CreditAttribution: sasanikolic commentedEDIT: sorry for the doublepost.
Comment #6
sasanikolic CreditAttribution: sasanikolic commentedComment #7
sasanikolic CreditAttribution: sasanikolic commentedThis is a patch with a workaround, that disables the focus on the "Save" button. With that at least the page doesn't jump after saving.
Tried adding the test, but unfortunately it seems that there's no way to check for focused elements in a js test?
Got this error:
Comment #8
sasanikolic CreditAttribution: sasanikolic commentedWrong line. Fixed it here.
Also, created a core issue for d.o. and added a patch there.
Comment #9
sasanikolic CreditAttribution: sasanikolic commentedComment #10
RenrhafThanks sasanikolic for the patch. We noticed this issue in our project, then applied this patch and noted that the focus was no more set to the bottom of the form which is great for us ! Setting this to RTBC.
Comment #13
oknateCommitted, thanks!
🎉