Tabindex is not applying in DOM at all

I am trying to apply focus to a modal when it is active by setting tabindex="" in the code but unfortunately browsers (checked in Chrome and FF) doesn't show the attribute.

To solve this, I tried giving tabindex to a blank div tag but it didn't work there either.

This is the code in my editor.

<div className="modalBox" id="returnBookModalPanel" tabindex="0" role="dialog" aria-modal="true">
<div tabindex="0"></div>

---

Code rendered by browsers

<div class="modalBox" id="returnBookModalPanel" role="dialog" aria-modal="true">
<div></div>

I am following the accessibility standard too https://www.w3.org/TR/wai-aria-practices/#dialog_roles_states_props