| OLD | NEW |
|---|
| 1 <html> | 1 <!doctype html> |
| 2 <head> | 2 <script src="../../resources/testharness.js"></script> |
| 3 <script src=../editing.js language="JavaScript" type="text/JavaScript"></script> | 3 <script src="../../resources/testharnessreport.js"></script> |
| 4 <script src="../assert_selection.js"></script> |
| 5 <div id="log"></div> |
| 4 <script> | 6 <script> |
| 5 function log(message) { | 7 test(() => { |
| 6 var console = document.getElementById("console"); | 8 assert_selection( |
| 7 var li = document.createElement("li"); | 9 '<div contenteditable>|0123456789</div>', |
| 8 var text = document.createTextNode(message); | 10 'createLink abc', |
| 9 li.appendChild(text); | 11 '<div contenteditable><a href="abc">^abc|</a>0123456789</div>', |
| 10 console.appendChild(li); | 12 'Anchor text is an URI'); |
| 11 } | |
| 12 | 13 |
| 13 function editingTest() { | 14 assert_selection( |
| 14 | 15 '<div contenteditable>^0123456789|</div>', |
| 15 var s = window.getSelection(); | 16 'createLink abc', |
| 16 var d; | 17 '<div contenteditable><a href="abc">^0123456789|</a></div>', |
| 17 | 18 'Fully select the line'); |
| 18 if (window.testRunner) | |
| 19 window.testRunner.dumpAsText(); | |
| 20 | |
| 21 // Fully select the line in the first div. | |
| 22 d = document.getElementById("test1"); | |
| 23 s.collapse(d, 0); | |
| 24 extendSelectionForwardByLineCommand(); | |
| 25 createLinkCommand("http://www.google.com/"); | |
| 26 | |
| 27 log(d.innerHTML); | |
| 28 | 19 |
| 29 // Partially select the line in the second div. | 20 assert_selection( |
| 30 d = document.getElementById("test2"); | 21 '<div contenteditable>012^345|6789</div>', |
| 31 s.collapse(d, 0); | 22 'createLink abc', |
| 32 moveSelectionForwardByWordCommand(); | 23 '<div contenteditable>012<a href="abc">^345|</a>6789</div>', |
| 33 extendSelectionForwardByWordCommand(); | 24 'Partially select the line'); |
| 34 createLinkCommand("http://www.google.com/"); | |
| 35 | |
| 36 log(d.innerHTML); | |
| 37 | |
| 38 // Partially select the link in the third div | |
| 39 var e = document.getElementById("starthere"); | |
| 40 s.collapse(e, 0); | |
| 41 extendSelectionForwardByLineCommand(); | |
| 42 createLinkCommand("http://www.google.com/"); | |
| 43 | 25 |
| 44 log(d.innerHTML); | 26 assert_selection( |
| 45 | 27 '<div contenteditable><a href="abc">012^345|6789</a></div>', |
| 46 // Select all the content in the fourth div | 28 'createLink xyz', |
| 47 d = document.getElementById("test4"); | 29 '<div contenteditable><a href="abc">012</a><a href="xyz">^345|</a><a hre
f="abc">6789</a></div>', |
| 48 s.collapse(d, 0); | 30 'Partially select the link'); |
| 49 selectAllCommand(); | 31 |
| 50 createLinkCommand("http://www.google.com/"); | 32 assert_selection( |
| 51 | 33 '<div contenteditable>^012<ul><li>item1</li><li>item2</li></ul>345|</div
>', |
| 52 log(d.innerHTML); | 34 'createLink abc', |
| 53 | 35 '<div contenteditable><a href="abc">^012</a><ul><li><a href="abc">item1<
/a></li><li><a href="abc">item2</a></li></ul><a href="abc">345|</a></div>', |
| 54 } | 36 'Selection whole list'); |
| 37 |
| 38 assert_selection( |
| 39 '<div contenteditable>^foo <img src="../resources/abe.png"> bar|</div>', |
| 40 'createLink abc', |
| 41 '<div contenteditable><a href="abc">^foo <img src="../resources/abe.png"
> bar|</a></div>', |
| 42 'Line contains an image'); |
| 43 |
| 44 assert_selection( |
| 45 '<div contenteditable>^012<table><tr><td>item1</td><td>item2</td></tr></
table>345|</div>', |
| 46 'createLink abc', |
| 47 '<div contenteditable><a href="abc">^012</a><table><tbody><tr><td><a hre
f="abc">item1</a></td><td><a href="abc">item2</a></td></tr></tbody></table><a hr
ef="abc">345|</a></div>', |
| 48 'Selection whole table'); |
| 49 |
| 50 }); |
| 55 </script> | 51 </script> |
| 56 </head> | |
| 57 | |
| 58 <body style="font-size: 12px;"> | |
| 59 <p>This is a test of execCommand(CreateLink, ...). It tests:</p> | |
| 60 <ol> | |
| 61 <li>Creating a link from a selection that is completely unlinked.</li> | |
| 62 <li>Creating a link from a selection that is inside an existing link.</li> | |
| 63 <li>Creating a link from a selection that is partially linked.</li> | |
| 64 <li>Creating a link from a selection that contains lists, tables, styled text, a
nd images.</li> | |
| 65 </ol> | |
| 66 <ol> | |
| 67 <li><div id="test1" contenteditable="true">This paragraph starts unlinked. The
entire paragraph should end up being a link to google.com.</div></li> | |
| 68 <li><div id="test2" contenteditable="true"><a href="http://www.apple.com/">This
paragraph starts out as a link to apple.com. The second word in the paragraph s
hould end up being a link to google.com.</a></div></li> | |
| 69 <li><div id="test3" contenteditable="true">This line starts out with <a href="ht
tp://www.apple.com"><b>a</b><span id="starthere"> link</span></a> in the middle.
The second half of this paragraph, starting after the bold 'a' should end up b
eing a link to google.com.</div></li> | |
| 70 <li><div id="test4" contenteditable="true"> | |
| 71 <p>This <i>editable region</i> contains lists, tables, styled text, and images.
The entire region should end up being a link to google.com.</p> | |
| 72 <ul> | |
| 73 <li>Item 1</li> | |
| 74 <li>Item 2</li> | |
| 75 </ul> | |
| 76 <table border=1><tr><td>1</td><td>2</td><td>3</td></tr></table> | |
| 77 <br> | |
| 78 This <b>line</b> contains <img src="../resources/abe.png"> an image. | |
| 79 </div></li> | |
| 80 </ol> | |
| 81 <p>innerHTML of editable regions after the test:</p> | |
| 82 <ol id="console"></ol> | |
| 83 <script> | |
| 84 runEditingTest(); | |
| 85 </script> | |
| 86 </body> | |
| 87 | |
| 88 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2013603004:
Introduce assert_selection() for editing tests (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master