diff --git a/src/webcomponents/commons/modal/modal-utils.js b/src/webcomponents/commons/modal/modal-utils.js
index f04778773f..84cb9a6793 100644
--- a/src/webcomponents/commons/modal/modal-utils.js
+++ b/src/webcomponents/commons/modal/modal-utils.js
@@ -28,10 +28,9 @@ export default class ModalUtils {
         const modalDraggable = config.display?.modalDraggable || false;
         const modalCyDataName = config.display?.modalCyDataName || "";
 
-        // CAUTION: DO NOT COMMIT THIS CHANGE: REMOVAL OF tabindex="-1"
         return html `
             <div class="modal fade" id="${id}" data-draggable="${modalDraggable}"
-                role="dialog"
+                tabindex="-1" role="dialog"
                 aria-labelledby="DataModalLabel" aria-hidden="true" data-cy="${modalCyDataName}">
                 <div class="modal-dialog" style="width: ${modalWidth}">
                     <div class="modal-content">