| <!doctype HTML> |
| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| <script src="../../assert_selection.js"></script> |
| <div id="log"></div> |
| <script> |
| test(function(){ |
| assert_selection( |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">foo</div>', |
| selection => selection.collapse(selection.document.getElementById('div').firstChild, 1), |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">f|oo</div>'); |
| assert_selection( |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">f|oo</div>', |
| selection => selection.extend(selection.document.getElementById('div').firstChild, 2), |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">f^o|o</div>'); |
| assert_selection( |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">foo</div>', |
| selection => { |
| var div = selection.document.getElementById('div'); |
| selection.setBaseAndExtent(div.firstChild, 1, div.firstChild, 2); |
| }, |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">f^o|o</div>'); |
| assert_selection( |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">foo</div>', |
| selection => { |
| var range = selection.document.createRange(); |
| var div = selection.document.getElementById('div'); |
| range.setStart(div, 0); |
| range.setEnd(div, 1); |
| selection.addRange(range); |
| }, |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">^foo|</div>'); |
| assert_selection( |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">|foo</div>', |
| selection => selection.modify('move', 'forward', 'character'), |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">f|oo</div>'); |
| assert_selection( |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">f|oo</div>', |
| selection => selection.modify('move', 'backward', 'character'), |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">|foo</div>'); |
| assert_selection( |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">|foo</div>', |
| selection => selection.modify('extend', 'forward', 'character'), |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">^f|oo</div>'); |
| assert_selection( |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">foo|</div>', |
| selection => selection.modify('extend', 'backward', 'character'), |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">fo|o^</div>'); |
| }, |
| 'Selection API can edit in -webkit-user-select:all contenteditable element'); |
| |
| test(function(){ |
| assert_selection( |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">|foo</div>', |
| selection => selection.document.execCommand('insertText', false, 'bar'), |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">bar|foo</div>'); |
| }, |
| 'Execcommand inserttext in -webkit-user-select:all contenteditable element'); |
| |
| test(function(){ |
| assert_selection( |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">foo</div>', |
| selection => assert_true(selection.document.getElementById('div').isContentEditable), |
| '<div contenteditable="true" id="div" style="-webkit-user-select:all">foo</div>'); |
| }, |
| '-webkit-user-select:all contenteditable element is HTMLElement.isContentEditable == true'); |
| </script> |
