JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE>
<html>
<body>
<p id="description">Placing cursor at the end of first list and executing forward delete should merge the second list with the first one.</p>
<div contenteditable>
<ol><li>one</li><li>two</li><li id="li">three</li></ol>
<ol><li>four</li><li>five</li><li>six</li></ol>
</div>
<script>
/**
* There are three basic use cases of dumpAsMarkup
*
* 1. Dump the entire DOM when the page is loaded
* When this script is included but no method of Markup is called,
* it dumps the DOM of each frame loaded.
*
* 2. Dump the content of a specific element when the page is loaded
* When Markup.setNodeToDump is called with some element or the id of some element,
* it dumps the content of the specified element as supposed to the entire DOM tree.
*
* 3. Dump the content of a specific element multiple times while the page is loading
* Calling Markup.dump would dump the content of the element set by setNodeToDump or the entire DOM.
* Optionally specify the node to dump and the description for each call of dump.
*/
if (window.testRunner)
testRunner.dumpAsText();
// Namespace
// FIXME: Rename dump-as-markup.js to dump-dom.js and Markup to DOM.
var Markup = {};
// The description of what this test is testing. Gets prepended to the dumped markup.
Markup.description = function(description)
{
Markup._test_description = description;
}
// Dumps the markup for the given node (HTML element if no node is given).
// Over-writes the body's content with the markup in layout test mode. Appends
// a pre element when loaded manually, in order to aid debugging.
Markup.dump = function(opt_node, opt_description)
{
if (typeof opt_node == 'string')
opt_node = document.getElementById(opt_node);
var node = opt_node || document
var markup = "";
Markup._dumpCalls++;
if (Markup._dumpCalls > 1 || opt_description) {
if (!opt_description)
opt_description = "Dump of markup " + Markup._dumpCalls
...