-
Notifications
You must be signed in to change notification settings - Fork 1.8k
Description
Describe the bug
When switching between the editor mode (WYSIWYG β Markdown) in Toast UI Editor, the position of the text selection cannot be correctly maintained. After converting the selection position using the convertPosToMatchEditorMode() method, by changing the mode using the changeMode() method and then setting the selection using the setSelection() method, the selection position remains incorrect or is lost.
To Reproduce
Steps to reproduce the behavior:
- Open the sample file "switch-mode-preserve-selection.html"
- Select some text in the editor (in WYSIWYG or Markdown mode)
- Click the "Switch Mode and Preserve Selection" button
- Observe the position of the selected area after the mode switch
- The position of the selected area may be incorrect or completely lost
Expected behavior
When switching to the editor mode, the selection area should be able to remain correctly. After converting the selection area position using the function "convertPosToMatchEditorMode()", switch the mode by using the function "changeMode()", and then set the selection area using the function "setSelection()". The selection area should precisely be positioned at the position after the conversion.
Screenshots
If applicable, add screenshots to help explain your problem.
Desktop (please complete the following information):
- OS: Windows 11
- Browser Chrome
- Version latest version
Smartphone (please complete the following information):
- Device: [e.g. iPhone6]
- OS: [e.g. iOS8.1]
- Browser [e.g. stock browser, safari]
- Version [e.g. 22]
Additional context
- Implementation method:
- Use editor.getSelection() to obtain the selection area of the current mode
- Use editor.convertPosToMatchEditorMode(start, end, targetMode) to convert the position of the selection area
- Use editor.changeMode(targetMode) to switch the editor mode
- Use editor.setSelection(targetPosition[0], targetPosition[1]) to set the selection area
- Selection format:
- WYSIWYG mode: The selection format is [start, end], where start and end are numbers.
- Markdown mode: The selection format is [[line1, ch1], [line2, ch2]], where line and ch are numbers.
- Delay settings:
- Due to the time required for mode switching, setTimeout was used to delay the selection area setting (5000ms was used for testing)
- Even with the delay setting, the position of the selection area remained incorrect