cefalse-on-boundaries.html (2570B)
1 <!DOCTYPE HTML> 2 <meta charset=utf-8> 3 <title>Selection of contenteditable=false at the beginning and end of contenteditable element</title> 4 <script src="/resources/testharness.js"></script> 5 <script src="/resources/testharnessreport.js"></script> 6 <div contenteditable id="host"> 7 <div contenteditable="false" id="beginning"> </div> 8 <p id="paragraph">Lorem ipsum dolor sit amet.</p> 9 <div contenteditable="false" id="end"> </div> 10 </div> 11 <script> 12 test( () => { 13 const range = document.createRange(); 14 15 range.setStartBefore( beginning ); 16 range.setEndAfter( paragraph ); 17 getSelection().removeAllRanges(); 18 getSelection().addRange( range ); 19 20 const selectedRange = getSelection().getRangeAt( 0 ); 21 22 assert_equals( selectedRange.startContainer, host ); 23 assert_equals( selectedRange.startOffset, 1 ); 24 assert_equals( selectedRange.endContainer, host ); 25 assert_equals( selectedRange.endOffset, 4 ); 26 }, 'Selection can start on cE=false element at the beginning of the cE=true element' ); 27 28 test( () => { 29 const range = document.createRange(); 30 31 range.setStartBefore( paragraph ); 32 range.setEndAfter( end ); 33 getSelection().removeAllRanges(); 34 getSelection().addRange( range ); 35 36 const selectedRange = getSelection().getRangeAt( 0 ); 37 38 assert_equals( selectedRange.startContainer, host ); 39 assert_equals( selectedRange.startOffset, 3 ); 40 assert_equals( selectedRange.endContainer, host ); 41 assert_equals( selectedRange.endOffset, 6 ); 42 }, 'Selection can end on cE=false element at the end of the cE=true element' ); 43 44 test( () => { 45 const range = document.createRange(); 46 47 range.setStartBefore( beginning ); 48 range.setEndAfter( end ); 49 getSelection().removeAllRanges(); 50 getSelection().addRange( range ); 51 52 const selectedRange = getSelection().getRangeAt( 0 ); 53 54 assert_equals( selectedRange.startContainer, host ); 55 assert_equals( selectedRange.startOffset, 1 ); 56 assert_equals( selectedRange.endContainer, host ); 57 assert_equals( selectedRange.endOffset, 6 ); 58 }, 'Selection can start and end on cE=false elements at the boundaries of cE=true element' ); 59 60 test( () => { 61 const range = document.createRange(); 62 63 range.selectNodeContents( host ); 64 65 const selectedRange = getSelection().getRangeAt( 0 ); 66 67 assert_equals( selectedRange.startContainer, host ); 68 assert_equals( selectedRange.startOffset, 1 ); 69 assert_equals( selectedRange.endContainer, host ); 70 assert_equals( selectedRange.endOffset, 6 ); 71 }, 'Range#selectNodeContents() correctly select contents of cE=true element with cE=false elements on boundaries' ); 72 </script>