chromium/src/third_party/blink/web_tests/editing/selection/modify_move/css-pseudo-element.html - manifest_repos/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>
 const kQuoteStyle = `
 <style>
  .quote::before { content: "\""; }
  .quote::after { content: "\""; }
 </style>
 `;

 selection_test(
     [
       kQuoteStyle,
       '<div contenteditable>before |<span class="quote">content</span> after</div>'
     ],
     selection => selection.modify('move', 'right', 'character'),
     [
       kQuoteStyle,
       '<div contenteditable>before <span class="quote">c|ontent</span> after</div>'
     ],
     'ltr enter quote at front');

 selection_test(
     [
       kQuoteStyle,
       '<div contenteditable>before <span class="quote">c|ontent</span> after</div>'
     ],
     selection => selection.modify('move', 'left', 'character'),
     [
       kQuoteStyle,
       '<div contenteditable>before |<span class="quote">content</span> after</div>'
     ],
     'ltr exit quote at front');

 selection_test(
     [
       kQuoteStyle,
       '<div contenteditable>before <span class="quote">content|</span> after</div>'
     ],
     selection => selection.modify('move', 'right', 'character'),
     [
       kQuoteStyle,
       '<div contenteditable>before <span class="quote">content</span> |after</div>'
     ],
     'ltr exit quote at back');

 selection_test(
     [
       kQuoteStyle,
       '<div contenteditable>before <span class="quote">content</span> |after</div>'
     ],
     selection => selection.modify('move', 'left', 'character'),
     [
       kQuoteStyle,
       '<div contenteditable>before <span class="quote">content|</span> after</div>'
     ],
     'ltr enter quote at back');

 selection_test(
     [
       kQuoteStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 |<span class="quote">\u05D3\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
     ],
     selection => selection.modify('move', 'left', 'character'),
     [
       kQuoteStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3|\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
     ],
     'rtl enter quote at front');

 selection_test(
     [
       kQuoteStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3|\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
     ],
     selection => selection.modify('move', 'right', 'character'),
     [
       kQuoteStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 |<span class="quote">\u05D3\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
     ],
     'rtl exit quote at front');

 selection_test(
     [
       kQuoteStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3\u05D4\u05D5|</span> \u05D6\u05D7\u05D8</div>'
     ],
     selection => selection.modify('move', 'left', 'character'),
     [
       kQuoteStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3\u05D4\u05D5</span> |\u05D6\u05D7\u05D8</div>'
     ],
     'rtl exit quote at back');

 selection_test(
     [
       kQuoteStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3\u05D4\u05D5</span> |\u05D6\u05D7\u05D8</div>'
     ],
     selection => selection.modify('move', 'right', 'character'),
     [
       kQuoteStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3\u05D4\u05D5|</span> \u05D6\u05D7\u05D8</div>'
     ],
     'rtl enter quote at back');

 const kBidiStyle = `
 <style>
   .bidi::before { content: "aפb"; }
   .bidi::after { content: "aפb"; }
 </style>
 `;

 selection_test(
     [
       kBidiStyle,
       '<div contenteditable>before |<span class="bidi">content</span> after</div>'
     ],
     selection => selection.modify('move', 'right', 'character'),
     [
       kBidiStyle,
       '<div contenteditable>before <span class="bidi">c|ontent</span> after</div>'
     ],
     'ltr enter bidi at front');

 selection_test(
     [
       kBidiStyle,
       '<div contenteditable>before <span class="bidi">c|ontent</span> after</div>'
     ],
     selection => selection.modify('move', 'left', 'character'),
     [
       kBidiStyle,
       '<div contenteditable>before |<span class="bidi">content</span> after</div>'
     ],
     'ltr exit bidi at front');

 selection_test(
     [
       kBidiStyle,
       '<div contenteditable>before <span class="bidi">content|</span> after</div>'
     ],
     selection => selection.modify('move', 'right', 'character'),
     [
       kBidiStyle,
       '<div contenteditable>before <span class="bidi">content</span> |after</div>'
     ],
     'ltr exit bidi at back');

 selection_test(
     [
       kBidiStyle,
       '<div contenteditable>before <span class="bidi">content</span> |after</div>'
     ],
     selection => selection.modify('move', 'left', 'character'),
     [
       kBidiStyle,
       '<div contenteditable>before <span class="bidi">content|</span> after</div>'
     ],
     'ltr enter bidi at back');

 selection_test(
     [
       kBidiStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 |<span class="bidi">\u05D3\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
     ],
     selection => selection.modify('move', 'left', 'character'),
     [
       kBidiStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3|\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
     ],
     'rtl enter bidi at front');

 selection_test(
     [
       kBidiStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3|\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
     ],
     selection => selection.modify('move', 'right', 'character'),
     [
       kBidiStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 |<span class="bidi">\u05D3\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
     ],
     'rtl exit bidi at front');

 selection_test(
     [
       kBidiStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3\u05D4\u05D5|</span> \u05D6\u05D7\u05D8</div>'
     ],
     selection => selection.modify('move', 'left', 'character'),
     [
       kBidiStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3\u05D4\u05D5</span> |\u05D6\u05D7\u05D8</div>'
     ],
     'rtl exit bidi at back');

 selection_test(
     [
       kBidiStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3\u05D4\u05D5</span> |\u05D6\u05D7\u05D8</div>'
     ],
     selection => selection.modify('move', 'right', 'character'),
     [
       kBidiStyle,
       '<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3\u05D4\u05D5|</span> \u05D6\u05D7\u05D8</div>'
     ],
     'rtl enter bidi at back');
 </script>
	<!DOCTYPE html>
	<script src="../../../resources/testharness.js"></script>
	<script src="../../../resources/testharnessreport.js"></script>
	<script src="../../assert_selection.js"></script>
	<script>
	const kQuoteStyle = `
	<style>
	.quote::before { content: "\""; }
	.quote::after { content: "\""; }
	</style>
	`;

	selection_test(
	[
	kQuoteStyle,
	'<div contenteditable>before \|<span class="quote">content</span> after</div>'
	],
	selection => selection.modify('move', 'right', 'character'),
	[
	kQuoteStyle,
	'<div contenteditable>before <span class="quote">c\|ontent</span> after</div>'
	],
	'ltr enter quote at front');

	selection_test(
	[
	kQuoteStyle,
	'<div contenteditable>before <span class="quote">c\|ontent</span> after</div>'
	],
	selection => selection.modify('move', 'left', 'character'),
	[
	kQuoteStyle,
	'<div contenteditable>before \|<span class="quote">content</span> after</div>'
	],
	'ltr exit quote at front');

	selection_test(
	[
	kQuoteStyle,
	'<div contenteditable>before <span class="quote">content\|</span> after</div>'
	],
	selection => selection.modify('move', 'right', 'character'),
	[
	kQuoteStyle,
	'<div contenteditable>before <span class="quote">content</span> \|after</div>'
	],
	'ltr exit quote at back');

	selection_test(
	[
	kQuoteStyle,
	'<div contenteditable>before <span class="quote">content</span> \|after</div>'
	],
	selection => selection.modify('move', 'left', 'character'),
	[
	kQuoteStyle,
	'<div contenteditable>before <span class="quote">content\|</span> after</div>'
	],
	'ltr enter quote at back');

	selection_test(
	[
	kQuoteStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 \|<span class="quote">\u05D3\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
	],
	selection => selection.modify('move', 'left', 'character'),
	[
	kQuoteStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3\|\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
	],
	'rtl enter quote at front');

	selection_test(
	[
	kQuoteStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3\|\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
	],
	selection => selection.modify('move', 'right', 'character'),
	[
	kQuoteStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 \|<span class="quote">\u05D3\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
	],
	'rtl exit quote at front');

	selection_test(
	[
	kQuoteStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3\u05D4\u05D5\|</span> \u05D6\u05D7\u05D8</div>'
	],
	selection => selection.modify('move', 'left', 'character'),
	[
	kQuoteStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3\u05D4\u05D5</span> \|\u05D6\u05D7\u05D8</div>'
	],
	'rtl exit quote at back');

	selection_test(
	[
	kQuoteStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3\u05D4\u05D5</span> \|\u05D6\u05D7\u05D8</div>'
	],
	selection => selection.modify('move', 'right', 'character'),
	[
	kQuoteStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="quote">\u05D3\u05D4\u05D5\|</span> \u05D6\u05D7\u05D8</div>'
	],
	'rtl enter quote at back');

	const kBidiStyle = `
	<style>
	.bidi::before { content: "aפb"; }
	.bidi::after { content: "aפb"; }
	</style>
	`;

	selection_test(
	[
	kBidiStyle,
	'<div contenteditable>before \|<span class="bidi">content</span> after</div>'
	],
	selection => selection.modify('move', 'right', 'character'),
	[
	kBidiStyle,
	'<div contenteditable>before <span class="bidi">c\|ontent</span> after</div>'
	],
	'ltr enter bidi at front');

	selection_test(
	[
	kBidiStyle,
	'<div contenteditable>before <span class="bidi">c\|ontent</span> after</div>'
	],
	selection => selection.modify('move', 'left', 'character'),
	[
	kBidiStyle,
	'<div contenteditable>before \|<span class="bidi">content</span> after</div>'
	],
	'ltr exit bidi at front');

	selection_test(
	[
	kBidiStyle,
	'<div contenteditable>before <span class="bidi">content\|</span> after</div>'
	],
	selection => selection.modify('move', 'right', 'character'),
	[
	kBidiStyle,
	'<div contenteditable>before <span class="bidi">content</span> \|after</div>'
	],
	'ltr exit bidi at back');

	selection_test(
	[
	kBidiStyle,
	'<div contenteditable>before <span class="bidi">content</span> \|after</div>'
	],
	selection => selection.modify('move', 'left', 'character'),
	[
	kBidiStyle,
	'<div contenteditable>before <span class="bidi">content\|</span> after</div>'
	],
	'ltr enter bidi at back');

	selection_test(
	[
	kBidiStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 \|<span class="bidi">\u05D3\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
	],
	selection => selection.modify('move', 'left', 'character'),
	[
	kBidiStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3\|\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
	],
	'rtl enter bidi at front');

	selection_test(
	[
	kBidiStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3\|\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
	],
	selection => selection.modify('move', 'right', 'character'),
	[
	kBidiStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 \|<span class="bidi">\u05D3\u05D4\u05D5</span> \u05D6\u05D7\u05D8</div>'
	],
	'rtl exit bidi at front');

	selection_test(
	[
	kBidiStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3\u05D4\u05D5\|</span> \u05D6\u05D7\u05D8</div>'
	],
	selection => selection.modify('move', 'left', 'character'),
	[
	kBidiStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3\u05D4\u05D5</span> \|\u05D6\u05D7\u05D8</div>'
	],
	'rtl exit bidi at back');

	selection_test(
	[
	kBidiStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3\u05D4\u05D5</span> \|\u05D6\u05D7\u05D8</div>'
	],
	selection => selection.modify('move', 'right', 'character'),
	[
	kBidiStyle,
	'<div contenteditable dir="rtl">\u05D0\u05D1\u05D2 <span class="bidi">\u05D3\u05D4\u05D5\|</span> \u05D6\u05D7\u05D8</div>'
	],
	'rtl enter bidi at back');
	</script>