Classic Editor: Current selection is not preserved when switching Visual to Text editor

[shge]

Plugin: Classic Editor

Problem

In some cases (when formatting HTML attributes is disabled), the current selection when switching Visual to Text editor is not preserved. The selected text gets unselected and the editor does not jump to the previous selection position.

This is because the regular expression is not appropriate.

Line 774 in wp-admin/editor.js
The regular expression to find the selection position is:

var startRegex = new RegExp(
  '<span[^>]*\\s*class="mce_SELRES_start"[^>]+>\\s*' + selectionID + '[^<]*<\\/span>(\\s*)'
);

This works well with:

<span class="mce_SELRES_start" style="display: inline-block; ...">

However, it does not work when "class" is the last attribute:

<span style="display: inline-block; ..." class="mce_SELRES_start">

---

Solution

Changing +(1 or more) to *(0 or more) in the regular expression makes it work.

wp-admin/editor.js

Line 775

'<span[^>]*\\s*class="mce_SELRES_start"[^>]+>\\s*' + selectionID + '[^<]*<\\/span>(\\s*)'

↓

'<span[^>]*\\s*class="mce_SELRES_start"[^>]*>\\s*' + selectionID + '[^<]*<\\/span>(\\s*)'

Line 779

'(\\s*)<span[^>]*\\s*class="mce_SELRES_end"[^>]+>\\s*' + selectionID + '[^<]*<\\/span>'

↓

'(\\s*)<span[^>]*\\s*class="mce_SELRES_end"[^>]*>\\s*' + selectionID + '[^<]*<\\/span>'

Trac ticket: https://core.trac.wordpress.org/ticket/56039

# Problem
In some cases (when formatting HTML attributes is disabled), the current selection when switching Visual to Text editor is not preserved. The selected text gets unselected and the editor does not jump to the previous selection position.
This is because the regular expression is not appropriate.

Line 774 in wp-admin/editor.js
The regular expression to find the selection position is:

var startRegex = new RegExp(
  '<span[^>]*\\s*class="mce_SELRES_start"[^>]+>\\s*' + selectionID + '[^<]*<\\/span>(\\s*)'
);

This works well with:
<span class="mce_SELRES_start" style="display: inline-block; ...">
However, it does not work when "class" is the last attribute:
<span style="display: inline-block; ..." class="mce_SELRES_start">

# Solution
Changing +(1 or more) to *(0 or more) in the regular expression makes it work.

[joyously]

Did you test this change with other <span> tags in the content? Is there any way the selection ID could be there without that class?

[shge]

Replying to joyously:

Did you test this change with other <span> tags in the content?

Yes. The editor surrounds the current selection with new <span> tags with mce_SELRES_start and mce_SELRES_end classes, so it works well with all tags including <span>.

Is there any way the selection ID could be there without that class?

No, there isn't.
Also, it should not conflict with existing classes because the selection ID is randomly generated and about 15 digits.