skip-over-contenteditable.html | Explore in Territory

<!DOCTYPE HTML>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../assert_selection.js"></script>
<script>
// Ensure that extending a selection skips past a contentEditable.
const isMac = navigator.platform.indexOf('Mac') === 0;

// Extend before contenteditable
selection_test(
  [
    '<p>^Before the contenteditable|</p>',
    '<div contenteditable></div>',
    '<p>After the contenteditable</p>',
  ],
  selection => selection.modify('extend', 'forward', 'character'),
  [
    '<p>^Before the contenteditable</p>',
    '<div contenteditable></div>',
    '<p>|After the contenteditable</p>',
  ],
  'Extend by character before editable');

selection_test(
  [
    '<p>^Before the contenteditable|</p>',
    '<div contenteditable></div>',
    '<p>After the contenteditable</p>',
  ],
  selection => selection.modify('extend', 'forward', 'word'),
  [
    '<p>^Before the contenteditable</p>',
    '<div contenteditable></div>',
    isMac
      ? '<p>|After the contenteditable</p>'
      : '<p>|After the contenteditable</p>',
  ],
  'Extend by word before editable');

selection_test(
  [
    '<p>^Before the contenteditable|</p>',
    '<div contenteditable></div>',
    '<p>After the contenteditable</p>',
  ],
  selection => selection.modify('extend', 'forward', 'line'),
  [
    '<p>^Before the contenteditable</p>',
    '<div contenteditable></div>',
    '<p>After the contenteditable|</p>',
  ],
  'Extend by line before editable');

// Extend after contenteditable
selection_test(
  [
    '<p>Before the contenteditable</p>',
    '<div contenteditable></div>',
    '<p>|After the contenteditable^</p>',
  ],
  selection => selection.modify('extend', 'backward', 'character'),
  [
    '<p>Before the contenteditable|</p>',
    '<div contenteditable></div>',
    '<p>After the contenteditable^</p>',
  ],
  'Extend by character after editable');

selection_test(
  [
    '<p>Before the contenteditable</p>',
    '<div contenteditable></div>',
    '<p>|After the contenteditable^</p>',
  ],
  selection => selection.modify('extend', 'backward', 'word'),
  [
    '<p>Before the contenteditable|</p>',
    '<div contenteditable></div>',
    '<p>After the contenteditable^</p>',
  ],
  'Extend by word after editable');

selection_test(
  [
    '<p>Before the contenteditable</p>',
    '<div contenteditable></div>',
    '<p>|After the contenteditable^</p>',
  ],
  selection => selection.modify('extend', 'backward', 'line'),
  [
    '<p>|Before the contenteditable</p>',
    '<div contenteditable></div>',
    '<p>After the contenteditable^</p>',
  ],
  'Extend by line after editable');
</script>
chromium/third_party/blink/web_tests/editing/selection/skip-over-contenteditable.html
