<!DOCTYPE html>

<html>
<body>
<script src="../../fast/dom/resources/event-sender-util.js"></script>
<script src="../../resources/js-test.js"></script>

<p>On the second time selecting &lt;span&gt;, it should not become non-contenteditable.
If it becomes non-contenteditable, the selection from &lt;span&gt; to &lt;table&gt;
will break editing boundaries and contain "a".
This test checks the &lt;span&gt; does not changed to non-contenteditable element.</p>

<div id="host" contenteditable></div>
<pre id="console"></pre>

<script>
var shadowRoot = host.createShadowRoot();
shadowRoot.innerHTML = '<table border="1">' +
    '<tr><td id="dst">aaaaa</td><td id="another">aaaaa</td></tr>' +
    '<tr><td>aaaaa</td><td>aaaaa</td></tr>' +
    '</table><span id="src" contenteditable>bbbbb</span>';

var src = shadowRoot.getElementById('src');
var dst = shadowRoot.getElementById('dst');
var another = shadowRoot.getElementById('another');

// 1. Select from src to dst.
mouseMoveToElem(src);
eventSender.mouseDown();
mouseMoveToElem(dst);
eventSender.mouseUp();

// 2. Click some element.
mouseMoveToElem(another);
eventSender.mouseDown();
eventSender.mouseUp();

// 3. Select from src to dst again.
mouseMoveToElem(src);
eventSender.mouseDown();
mouseMoveToElem(dst);
eventSender.mouseUp();

function contains(str, key) {
    return str.indexOf(key) >= 0;
}

var selectedString = shadowRoot.getSelection().toString();
shouldBeFalse('contains(selectedString, "a")');

var successfullyParsed = true;
</script>
</body>
</html>