Last Updated: 16 Jan 2024 11:46 by ADMIN
Release 2024 Q1
Created on: 08 Mar 2018 11:09
Category: Editor
Type: Bug Report
Shift+Left modifies text selection inconsistently in RadEditor
1.       Visit the RadEditor demo at (I used Google Chrome.)

2.       In the HTML view, replace the entire demo text with

This <strong>strange</strong> thing

3.       In the Design view, place the cursor at the very end of the line, and press Shift+Left repeatedly.

a.       At first it will highlight the final letter correctly.

b.      Then it will UNHIGHLIGHT the final letter!

c.       Then it will begin highlight more letters again starting from the letter BEFORE the final letter.

d.      Then, after highlighting the ā€œeā€ in strange, it will being UNHIGHLIGHTING starting from the righthand side of the selection!

e.      Then it will highlight left as far as the ā€œsā€.

f.        Then it will start UNHIGHLIGHTING from the right again!

g.       Then highlighting the space to the left

h.      Then UNHIGHLIGHTING the space to the left!

i.         Then highlighting to the left as far as the beginning of the line

j.        Then UNHIGHLIGHTING from the right side of the selection!

Pressing Shift+Left and Shift+Right should always modify only one end of the selection, and the other end should always remain where the selection was started. This is how Windows Notepad and virtually all other applications behave.
Posted on: 08 Jan 2024 15:24

You can use the following code to fix the problem - please let us know if you experience any side effects.

            var $T = Telerik.Web.UI;
            var $E = $T.Editor;
            var utils = $T.Editor.Utils;
            var $ = $telerik.$;

            $E.InlineCommandWithValue.prototype.getValue = function (wnd, range) {

                if (!range || !this.settings.enableToolStateValue) { return; }

                var cssName = this.settings.cssName,
                    node = range.startContainer,
                    offset = range.startOffset,

                if (offset == 0 && utils.isEditorContentArea(node)
                    && utils.isTextNode(node.firstChild) && utils.isTextNodeEmpty(node.firstChild)) {
                    var firstTextRange = this.get_editor().domRangeToFirstText();

                    node = firstTextRange.startContainer;
                    offset = firstTextRange.startOffset;

                if (utils.isTextNode(node)) {
                    node = node.parentNode;
                } else if ((childNodes = node.childNodes) && childNodes[offset] && !utils.isTextNode(childNodes[offset])) {
                    node = childNodes[offset];

                return $telerik.getComputedStyle(node, cssName)
                    || $telerik.getComputedStyle(node, this.getAltCssName(cssName));

            $E.InlineCommand.prototype.getStateByRange = function (range, editor) {
                if (!range || range.commonAncestorContainer.nodeType == 9) { return $E.CommandStates.Off; }

                var start = range.startContainer;

                if (!utils.isTextNode(start) && start.childNodes[range.startOffset]) { start = start.childNodes[range.startOffset]; }

                if (!utils.isTextNode(start) && utils.canHaveChildren(start)) {
                    start = this.getFirstTextNodeOrSame(start);

                if (utils.isTextNode(start) && utils.isTextNodeEmpty(start) && !start.previousSibling
                    && editor && start.parentNode === editor.get_contentArea()) {
                    start = this.getNextTextNode(start);

                start = this.findFormattedAncestor(start);

                return start && this.isSameFormatNode(start) ? $E.CommandStates.On : $E.CommandStates.Off;

            $E.RangeIterator.prototype._buildSubTraverser = function (currentNode) {
                var duplicate = this.range;


                if (utils.isAncestorOrSelf(currentNode, this.range.startContainer)) { duplicate.setStart(this.range.startContainer, this.range.startOffset); }// duplicate.snapToRange($E.DomRange.START_TO_START, this.range);

                if (utils.isAncestorOrSelf(currentNode, this.range.endContainer)) { duplicate.setEnd(this.range.endContainer, this.range.endOffset); }// duplicate.snapToRange($E.DomRange.END_TO_END, this.range);

                return new $E.RangeIterator(duplicate, $.extend({}, this.options));

        <telerik:RadEditor runat="server" _ToolsFile="Default-ToolsFile.xml">
            <Content>This <span style="font-size: 22px; font-family: Georgia;"><strong>strange</strong> </span>t</Content>
                <telerik:EditorModule Enabled="false" />

Posted on: 21 Jun 2022 22:39
Thank you for reporting this problem!

Until the issue gets fixed, you can use the temporary solution below:

                var $T = Telerik.Web.UI;
                var $Editor = $T.Editor;

                $Editor.DefaultToolAdapter.prototype._registerEditorHandlers = function () {
                    var editor = this.get_editor();
            <telerik:RadEditor ID="Radeditor1" runat="server">
                <Content>some very long long long long long sentence</Content>