LayoutTests/ChangeLog

2011-04-11  Alice Boxhall  <aboxhall@chromium.org>

        Reviewed by NOBODY (OOPS!).

        Text selection changes unexpectedly when dragging out of the <input>

        https://bugs.webkit.org/show_bug.cgi?id=55552

        Tests that dragging outside of a contenteditable, input or textarea selects to the end of the

        element, rather than jumping back to the beginning.

        * editing/selection/resources/select-out-of-floated-editable.js: Added.

        (log):

        (else.window.onmouseup):

        (getSelectionStart):

        (getSelectionEnd):

        (checkSelection):

        * editing/selection/select-out-of-editable-expected.txt: Added.

        * editing/selection/select-out-of-editable.html: Added.

        * editing/selection/select-out-of-floated-contenteditable-expected.txt: Added.

        * editing/selection/select-out-of-floated-contenteditable.html: Added.

        * editing/selection/select-out-of-floated-input-expected.txt: Added.

        * editing/selection/select-out-of-floated-input.html: Added.

        * editing/selection/select-out-of-floated-textarea-expected.txt: Added.

        * editing/selection/select-out-of-floated-textarea.html: Added.

2011-04-12  Csaba Osztrogonác  <ossy@webkit.org>

        [Qt] http/tests/misc/favicon-loads-with-icon-loading-override.html fails

LayoutTests/editing/selection/resources/select-out-of-floated-editable.js

function log(msg) {

    document.getElementById('console').appendChild(document.createTextNode(msg + '\n'));

}

if (window.layoutTestController && window.eventSender) {

    layoutTestController.dumpAsText();

    var x = floatedEditable.offsetLeft + (floatedEditable.offsetWidth / 2);

    var y = floatedEditable.offsetTop + (floatedEditable.offsetHeight / 2);

    eventSender.mouseMoveTo(x, y);

    eventSender.mouseDown();

    x = floatedEditable.offsetLeft + floatedEditable.offsetWidth + 5;

    eventSender.mouseMoveTo(x, y);

    eventSender.leapForward(100);

    eventSender.mouseUp();

    checkSelection();

} else {

    window.onmouseup = function() {

        window.setTimeout(function() {

            log('Input selection start: ' + getSelectionStart(floatedEditable) + ', end: ' +

                getSelectionEnd(floatedEditable));

            checkSelection();

        }, 0);  // Without a timeout the selection is inaccurately printed

    }

}

function getSelectionStart(element) {

    return element.isContentEditable ? window.getSelection().baseOffset : element.selectionStart;

}

function getSelectionEnd(element) {

    return element.isContentEditable ? window.getSelection().extentOffset : element.selectionEnd;

}

function checkSelection() {

    var inputText = floatedEditable.isContentEditable ? floatedEditable.textContent : floatedEditable.value;

    var inputTextLength = inputText.length;

    var selectionStart = getSelectionStart(floatedEditable);

    var selectionEnd = getSelectionEnd(floatedEditable);

    var selectionStartsFromMiddle = selectionStart > 0 && selectionStart < inputTextLength;

    var selectionGoesToEnd = selectionEnd == inputTextLength;

    if (selectionStartsFromMiddle && selectionGoesToEnd)

        result.innerHTML = '<span style="padding: 5px; background-color: green">SUCCESS</span>';

    else

        result.innerHTML = '<span style="padding: 5px; background-color: red">FAIL</span>';

}

LayoutTests/editing/selection/select-out-of-editable-expected.txt

hello world

Dragging to the left: PASS

Dragging to the left: PASS

This test requires eventSender since the bug does not reproduce reliably when tested manually.

LayoutTests/editing/selection/select-out-of-editable.html

<!DOCTYPE html> 

<html> 

<body> 

<p id="description">This test ensures that when editable text is selected by a drag that ends outside of the editable region, selection is extended to the either end of the text. See the <a href="https://bugs.webkit.org/show_bug.cgi?id=52986">bug 52986</a> for more details.</p> 

<div id="test" contenteditable style="width: 200px; margin: 20px; border: solid 1px; font-size: x-large;">hello world</div> 

<script> 

function selectTextByDrag(div, endX, endY) {

    window.getSelection().removeAllRanges();

    eventSender.mouseMoveTo(div.offsetLeft + (div.offsetWidth / 2) , div.offsetTop + (div.offsetHeight / 2));

    eventSender.mouseDown();

    eventSender.leapForward(200);

    // Without this, drag doesn't start selection.

    eventSender.mouseMoveTo(div.offsetLeft + (div.offsetWidth / 3) , div.offsetTop + (div.offsetHeight / 3));

    eventSender.mouseDown();

    eventSender.leapForward(200);

    eventSender.mouseMoveTo(endX, endY);

    eventSender.mouseUp();

}

var log = '';

function assertEqual(actual, expected) {

    if (actual == expected)

        log += 'PASS';

    else

        log += 'FAIL - expected ' + expected + ' but got ' + actual;

    log += '\n';

}

if (!window.layoutTestController || !window.eventSender)

    document.writeln("This test requires eventSender since the bug does not reproduce reliably when tested manually.");

else {

    layoutTestController.dumpAsText();

    var description = document.getElementById('description');

    description.style.display = 'none';

    var div = document.getElementById('test');

    log += 'Dragging to the left: ';

    selectTextByDrag(div, div.offsetLeft - 10, div.offsetTop - 10);

    assertEqual(window.getSelection().getRangeAt(0).startOffset, 0);

    log += 'Dragging to the left: ';

    selectTextByDrag(div, div.offsetLeft + 300, div.offsetTop + 100);

    assertEqual(window.getSelection().getRangeAt(0).endOffset, div.innerText.length);

    // Having the log in DOM will interfere with the test so append it at last.

    var console = document.createElement('pre');

    document.body.appendChild(console);

    console.innerHTML = log;

}

</script> 

</body> 

</html>

LayoutTests/editing/selection/select-out-of-floated-contenteditable-expected.txt

Some text before the floats. Drag from the middle. Some floated text in a div. Some text after the floats.

To test manually, drag from the middle of the editable div to the right, into the non-floated text. The selection should go to the end of the input element and not jump to the beginning.

SUCCESS

LayoutTests/editing/selection/select-out-of-floated-contenteditable.html

<!DOCTYPE html>

Some text before the floats.

<div contenteditable=true id="floatedEditable" style="float: left;">

  Drag from the middle.

</div>

<div style="width: 100%; float: left;">

  Some floated text in a div.

</div>

Some text after the floats.

<p style="padding-top: 1em;">

To test manually, drag from the middle of the editable div to the

right, into the non-floated text. The selection should go to the end

of the input element and not jump to the beginning.

</p>

<p id="result"></p>

<pre id="console"></pre>

<script src="resources/select-out-of-floated-editable.js"></script>

LayoutTests/editing/selection/select-out-of-floated-input-expected.txt

Some text before the floats. Some floated text in a div. Some text after the floats.

To test manually, drag from the middle of the input element to the right, into the non-floated text. The selection should go to the end of the input element and not jump to the beginning.

SUCCESS

LayoutTests/editing/selection/select-out-of-floated-input.html

<!DOCTYPE html>

Some text before the floats.

<div style="float: left;">

  <input type="text" id="floatedEditable" value="Drag from the middle.">

</div>

<div style="width: 100%; float: left;">

  Some floated text in a div.

</div>

Some text after the floats.

<p style="padding-top: 1em;">

To test manually, drag from the middle of the input element to the

right, into the non-floated text. The selection should go to the end

of the input element and not jump to the beginning.

</p>

<p id="result"></p>

<pre id="console"></pre>

<script src="resources/select-out-of-floated-editable.js"></script>

LayoutTests/editing/selection/select-out-of-floated-textarea-expected.txt

Some text before the floats. Some floated text in a div. Some text after the floats.

To test manually, drag from the middle of the textarea to the right, into the non-floated text. The selection should go to the end of the input element and not jump to the beginning.

SUCCESS

LayoutTests/editing/selection/select-out-of-floated-textarea.html

<!DOCTYPE html>

Some text before the floats.

<div style="float: left;">

  <textarea rows="1" id="floatedEditable">Drag from the middle.</textarea>

</div>

<div style="width: 100%; float: left;">

  Some floated text in a div.

</div>

Some text after the floats.

<p style="padding-top: 1em;">

To test manually, drag from the middle of the textarea to the

right, into the non-floated text. The selection should go to the end

of the input element and not jump to the beginning.

</p>

<p id="result"></p>

<pre id="console"></pre>

<script src="resources/select-out-of-floated-editable.js"></script>

Source/WebCore/ChangeLog

2011-04-11  Alice Boxhall  <aboxhall@chromium.org>

        Reviewed by NOBODY (OOPS!).

        Text selection changes unexpectedly when dragging out of the <input>

        https://bugs.webkit.org/show_bug.cgi?id=55552

        Tests: editing/selection/select-out-of-editable.html

               editing/selection/select-out-of-floated-contenteditable.html

               editing/selection/select-out-of-floated-input.html

               editing/selection/select-out-of-floated-textarea.html

        * page/EventHandler.cpp:

        (WebCore::targetPositionForSelectionEndpoint): When dragging from an editable element, check that

        the endpoint is not outside the element. If it is, translate the point into a local point within

        the editable element.

        (WebCore::EventHandler::updateSelectionForMouseDrag): Call targetPositionForSelectionEndpoint() to

        calculate the selection endpoint.

2011-04-12  Adrienne Walker  <enne@google.com>

        Reviewed by James Robinson.

Source/WebCore/page/EventHandler.cpp

@@void EventHandler::updateSelectionForMouseDrag()

    updateSelectionForMouseDrag(result);

}

static VisiblePosition selectionExtentRespectingEditingBoundary(const VisibleSelection& selection, const IntPoint& localPoint, Node* targetNode)

{

    Element* editableElement = selection.rootEditableElement();

    IntPoint selectionEndPoint = localPoint;

    Node* selectionEndNode = targetNode;

    if (editableElement && !editableElement->contains(targetNode)) {

        selectionEndNode = editableElement;

        FloatPoint absolutePoint = targetNode->renderer()->localToAbsolute(FloatPoint(selectionEndPoint));

        selectionEndPoint = roundedIntPoint(selectionEndNode->renderer()->absoluteToLocal(absolutePoint));

    }

    return selectionEndNode->renderer()->positionForPoint(selectionEndPoint);

}

void EventHandler::updateSelectionForMouseDrag(const HitTestResult& hitTestResult)

{

    if (!m_mouseDownMayStartSelect)

@@void EventHandler::updateSelectionForMouseDrag(const HitTestResult& hitTestResul

    if (!targetRenderer)

        return;

641 VisiblePosition targetPosition = targetRenderer->positionForPoint(hitTestResult.localPoint());

657 VisibleSelection newSelection = m_frame->selection()->selection();

658 VisiblePosition targetPosition = selectionExtentRespectingEditingBoundary(newSelection, hitTestResult.localPoint(), target);

    // Don't modify the selection if we're not on a node.

    if (targetPosition.isNull())

        return;

    // Restart the selection if this is the first mouse move. This work is usually

    // done in handleMousePressEvent, but not if the mouse press was on an existing selection.

    VisibleSelection newSelection = m_frame->selection()->selection();

#if ENABLE(SVG)

    // Special case to limit selection to the containing block for SVG text.

    // FIXME: Isn't there a better non-SVG-specific way to do this?