Accessibility: Managing Focus

I was wondering if there is a way to manage focus when uploadcare react widget loads and unloads. Currently, the focus is trapped behind the modal and a user has to tab through that content before accessing the image upload modal. It would be ideal if the focus was automatically set to the close button and if there was a way to set focus on something (via id) upon closing the modal as well.

Hi Heather, I’m Alex, a frontend engineer at Uploadcare.

Our widget should set focus on the close button automatically - this is expected behaviour. But for some reason it’s broken in your case. That may be caused by third-party scripts for example.

I prepared a simple demo on the codesandbox: 0169y15zrl - CodeSandbox
Here is the screencast of how it should work: https://www.useloom.com/share/a564b3cc9015489bab30694f70f1c78b
Does it work the same way on your end?
Also could you share a page where this problem appears so that I can inspect it?

Anyway you can manage focus using css classes, for the close button it would be

const $closeBtn = document.querySelector('.uploadcare--dialog .uploadcare--dialog__close')
$closeBtn.focus()