Focus manager does not recognize contenteditable elements as focusable

[jenalam]

Summary:

If the first element in the modal is an element that has the contenteditable=true attribute (and no tabindex set), the modal will not wrap it's focus back to that element. This is a problem when using a special component like a rich text editor in the modal, that may use contenteditable (like CKEditor).

Steps to reproduce:

1. Add an element (e.g. textarea) with the contenteditable=true attribute inside the modal.
2. Add some other focusable element after the element created in step 1.
3. Use Tab key and Tab through the modal.

Expected behavior:

Once you tab to the second element and hit Tab again, the focus should wrap to the first element (that has the contenteditable=true attribute). However, instead the focus gets trapped on the second button.

Link to example of issue:

https://codesandbox.io/s/musing-shaw-cnvwy?file=/src/App.js

Additional notes: