A11Y: focus not set to modal

Widgets
1

We create an activity, which shows a customized view.
<ModalNotification
title={activityData?.title ?? “”}
variant=“info”
footer={

Ok

}
closeOnEsc={true}
onClose={handleCloseButtonClick}
>
{displayData.map((el) => (

{el.value}


))}

This view is rendered having created a portal, that has two StyledModalOverlayWrapper childs, and therefore the TAB is not working correctly.

Is there a fix for this?

2

Hi @jan-strong-spruce,
Could you please give more details about your case?
We attempted to reproduce the issue — for example, by opening a Modal Notification through a Modal Overlay, which resulted in two StyledModalOverlayWrapper elements being rendered within the portal. However, keyboard navigation using the Tab key still functioned correctly, so we were unable to reproduce the problem:

3

Hi @quynh-cold-token ,

we solved the Problem, and I will want to answer here, just in case, someone else faces the same problem.

In the appliction model we set a view for a new activity to be shown as modal. The view itself was rendered using a ModalNotification widget. This resultet in a react-Portal that was rendered in an other react-Portal, and that confused the focus handling.