radix-modal.js monkey patches CTools to use the Bootstrap modal, which also cause the CTools accessibility changes from #2280853: Keyboard trap when using ctools modal to no longer work.

You can see this by opening the "Add content" dialog in the IPE: you'll see that the close button is briefly focused (which is correct) and the focus is moved to the first category button (which is incorrect).

Essentially, CTools is looking for a specific class on a specific element to determine if the CTools model is being loaded for the first time (which means we should focus on the close button) or if the modal is already open and it's content is being replaced (which means we should focus on the first focusable child).

But CTools isn't finding the class, because (a) the markup for the modal has changed AND (b) the replacement code for Drupal.CTools.Modal.show() isn't adding the class in the first place. This is complicated by the fact that both CTools and Bootstrap use the class "modal-content" but for slightly different things.

CommentFileSizeAuthor
#2 radix-ctools-a11y-2549037-2.patch643 bytesdsnopek
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

dsnopek created an issue. See original summary.

dsnopek’s picture

Status: Active » Needs review
FileSize
643 bytes

Heh, it was so complicated figuring out what was happening here, but the fix actually turns out to be quite simple. It wasn't necessary to resolve the conflict with .model-content or anything. :-)

Patch is attached!

shadcn’s picture

Status: Needs review » Reviewed & tested by the community

Thanks.

  • arshadcn committed 64b6ad5 on 7.x-3.x authored by dsnopek
    Issue #2549037 by dsnopek: radix-modal.js breaks CTools accessibility...
shadcn’s picture

Status: Reviewed & tested by the community » Fixed

Fixed. Thanks.

dsnopek’s picture

Thanks, Arshad! :-)

(BTW, I was going to get the client who discovered the problem to test before merging, but I'll do the reverse: comment here and update if they find any problems. Next time I'll say something in my comment - you're just so fast! ;-))

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.