third_party/blink/web_tests/editing/selection/modify_move/move_into_inline_block_nested.html - chromium/src - Git at Google

 <!DOCTYPE html>
 <script src="../../../resources/testharness.js"></script>
 <script src="../../../resources/testharnessreport.js"></script>
 <script src="../../assert_selection.js"></script>
 <script>
 selection_test(
   [
     '<div contenteditable>foo|',
     '<span style="display:inline-block">',
     '<div>bar</div><div>baz</div>',
     '</span>qux</div>'
   ].join(''),
   selection => selection.modify('move', 'right', 'character'),
   [
     '<div contenteditable>foo',
     '<span style="display:inline-block">',
     '<div>|bar</div><div>baz</div>',
     '</span>qux</div>'
   ].join(''),
   'Move right into inline block with child blocks');

 selection_test(
   [
     '<div contenteditable>foo',
     '<span style="display:inline-block">',
     '<div>bar</div><div>baz</div>',
     '</span>|qux</div>'
   ].join(''),
   selection => selection.modify('move', 'left', 'character'),
   [
     '<div contenteditable>foo',
     '<span style="display:inline-block">',
     '<div>bar</div><div>baz|</div>',
     '</span>qux</div>'
   ].join(''),
   'Move left into inline block with child blocks');

 selection_test(
   [
     '<div contenteditable>foo|',
     '<table style="display:inline"><tbody>',
     '<tr><td>bar</td></tr><tr><td>baz</td></tr>',
     '</tbody></table>qux</div>'
   ].join(''),
   selection => selection.modify('move', 'right', 'character'),
   [
     '<div contenteditable>foo',
     '<table style="display:inline"><tbody>',
     '<tr><td>|bar</td></tr><tr><td>baz</td></tr>',
     '</tbody></table>qux</div>'
   ].join(''),
   'Move right into inline table');

 selection_test(
   [
     '<div contenteditable>foo',
     '<table style="display:inline"><tbody>',
     '<tr><td>bar</td></tr><tr><td>baz</td></tr>',
     '</tbody></table>|qux</div>'
   ].join(''),
   selection => selection.modify('move', 'left', 'character'),
   [
     '<div contenteditable>foo',
     '<table style="display:inline"><tbody>',
     '<tr><td>bar</td></tr><tr><td>baz|</td></tr>',
     '</tbody></table>qux</div>'
   ].join(''),
   'Move left into inline table');

 selection_test(
   [
     '<div contenteditable>foo|',
     '<div style="display:inline-flex">',
     '<div>bar</div><div>baz</div>',
     '</div>qux</div>'
   ].join(''),
   selection => selection.modify('move', 'right', 'character'),
   [
     '<div contenteditable>foo',
     '<div style="display:inline-flex">',
     '<div>|bar</div><div>baz</div>',
     '</div>qux</div>'
   ].join(''),
   'Move right into inline flex');

 selection_test(
   [
     '<div contenteditable>foo',
     '<div style="display:inline-flex">',
     '<div>bar</div><div>baz</div>',
     '</div>|qux</div>'
   ].join(''),
   selection => selection.modify('move', 'left', 'character'),
   [
     '<div contenteditable>foo',
     '<div style="display:inline-flex">',
     '<div>bar</div><div>baz|</div>',
     '</div>qux</div>'
   ].join(''),
   'Move left into inline flex');
 </script>
	<!DOCTYPE html>
	<script src="../../../resources/testharness.js"></script>
	<script src="../../../resources/testharnessreport.js"></script>
	<script src="../../assert_selection.js"></script>
	<script>
	selection_test(
	[
	'<div contenteditable>foo\|',
	'<span style="display:inline-block">',
	'<div>bar</div><div>baz</div>',
	'</span>qux</div>'
	].join(''),
	selection => selection.modify('move', 'right', 'character'),
	[
	'<div contenteditable>foo',
	'<span style="display:inline-block">',
	'<div>\|bar</div><div>baz</div>',
	'</span>qux</div>'
	].join(''),
	'Move right into inline block with child blocks');

	selection_test(
	[
	'<div contenteditable>foo',
	'<span style="display:inline-block">',
	'<div>bar</div><div>baz</div>',
	'</span>\|qux</div>'
	].join(''),
	selection => selection.modify('move', 'left', 'character'),
	[
	'<div contenteditable>foo',
	'<span style="display:inline-block">',
	'<div>bar</div><div>baz\|</div>',
	'</span>qux</div>'
	].join(''),
	'Move left into inline block with child blocks');

	selection_test(
	[
	'<div contenteditable>foo\|',
	'<table style="display:inline"><tbody>',
	'<tr><td>bar</td></tr><tr><td>baz</td></tr>',
	'</tbody></table>qux</div>'
	].join(''),
	selection => selection.modify('move', 'right', 'character'),
	[
	'<div contenteditable>foo',
	'<table style="display:inline"><tbody>',
	'<tr><td>\|bar</td></tr><tr><td>baz</td></tr>',
	'</tbody></table>qux</div>'
	].join(''),
	'Move right into inline table');

	selection_test(
	[
	'<div contenteditable>foo',
	'<table style="display:inline"><tbody>',
	'<tr><td>bar</td></tr><tr><td>baz</td></tr>',
	'</tbody></table>\|qux</div>'
	].join(''),
	selection => selection.modify('move', 'left', 'character'),
	[
	'<div contenteditable>foo',
	'<table style="display:inline"><tbody>',
	'<tr><td>bar</td></tr><tr><td>baz\|</td></tr>',
	'</tbody></table>qux</div>'
	].join(''),
	'Move left into inline table');

	selection_test(
	[
	'<div contenteditable>foo\|',
	'<div style="display:inline-flex">',
	'<div>bar</div><div>baz</div>',
	'</div>qux</div>'
	].join(''),
	selection => selection.modify('move', 'right', 'character'),
	[
	'<div contenteditable>foo',
	'<div style="display:inline-flex">',
	'<div>\|bar</div><div>baz</div>',
	'</div>qux</div>'
	].join(''),
	'Move right into inline flex');

	selection_test(
	[
	'<div contenteditable>foo',
	'<div style="display:inline-flex">',
	'<div>bar</div><div>baz</div>',
	'</div>\|qux</div>'
	].join(''),
	selection => selection.modify('move', 'left', 'character'),
	[
	'<div contenteditable>foo',
	'<div style="display:inline-flex">',
	'<div>bar</div><div>baz\|</div>',
	'</div>qux</div>'
	].join(''),
	'Move left into inline flex');
	</script>