Problem/Motivation
I think maybe this change (https://www.drupal.org/project/flag/issues/3555233) doesn't take proper account of all the possible configurations that a Flag can have. Specifically, an AJAX error is thrown when flagging a node via 'dialog'-style flag forms.
Steps to reproduce
- Set up a basic Drupal site using `drupal/recommended-project` eg. as here https://docs.ddev.com/en/latest/users/quickstart/#drupal
- Create a new 'Content' Flag type, choosing 'Dialog' as the 'Form behavior'
- Create and publish a new Basic Page node
- View the new node
- Click the 'Flag this item' link
- Click the 'Create flagging' button in the dialog that appears
The flag state changes on the page but the dialog box doesn't close and an AJAX error is visible in the browser console:
`An error occurred during the execution of the Ajax response: Error: cannot call methods on dialog prior to initialization; attempted to call method 'close'`
Proposed resolution
I don't understand the lifecycle of the dialog component well enough to propose a proper resolution, but a quick-and-dirty patch to check for a behavior type of 'modal' as well as for an XMLHttpRequest context when deciding whether to add the `#ajax` key to the submit button render array has stopped the issue occurring for me (albeit at the expense of a page reload vs. the nicer intended AJAX behaviour).
Remaining tasks
Come up with and implement a version of the AJAX link decoration logic that works properly with all variations on the 'Form Behavior' option.
Issue fork flag-3625010
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments
Comment #2
tomdearden commentedComment #3
andres alvarez commentedComment #5
andres alvarez commentedThe AJAX submit handlers added in #3555233 always return
CloseModalDialogCommand, which targets#drupal-modal. With the "Dialog" form behavior the confirm form is opened in a randomly suffixed#drupal-dialog-*element instead, and core'sdialog.ajax.jsalways keeps an empty, uninitialized#drupal-modaldiv on the page, which is what triggers the "prior to initialization" error.Rather than dropping
#ajaxfor non-modal dialogs, non-modal flag links now pass a deterministic dialogtarget(FormEntryTypeBase::getDialogTargetId()), and the confirm/unflag forms close that dialog withCloseDialogCommand, keepingCloseModalDialogCommandfor the modal behavior. AddedtestDialogOption()toModalFormTest; it fails without the fix (dialog stays open) and passes with it, and the existing modal and confirm form tests still pass. MR !232, pipeline green.Comment #6
andres alvarez commentedComment #9
ivnish