Focusing back on CKEditor inserts the token in the wrong field

There is a edge case were this issue is still occuring in an initial state, but this can be resolved when the editor:attached event lands in core, see: ✨ Trigger event when Text Editor is attached Needs work

We can then do:

$(document).on('editor:attached', function () {
  if (Drupal.CKEditor5Instances) {
    Drupal.CKEditor5Instances.forEach(function (editor) {
      editor.editing.view.document.on('change:isFocused', (event, data, isFocused) => {
        if (isFocused) {
          drupalSettings.tokenFocusedField = false;
          drupalSettings.tokenFocusedCkeditor5 = editor;
        }
      });
    })
  }
});

Work for me, but it need a bit of debug.

I have a page for a client where both simple textareas and ckeditor textareas are used for different fields in different paragraphs and if I clicked first on a simple textarea field and then on ckeditor textarea field, the focus would not work and Token Browser would not insert toke values.

If I closed the token browser window and clicked again the ckeditor textarea, then it would work, but the first time after a page load, it does not.

I switched the checks in the MR (first check for tokenFocusedCkeditor5 and then for tokenFocusedField) and now it works without a problem.

I faced this today, but in a Layout Builder block.

The thing is, when an inline block is edited on the Layout Builder page, it automatically focuses on the first field, so the instruction Click on the title field step is not even necessary, it just doesn’t work at all. 🥲

Here’s a patch version of the PR in case someone needs it.