Improve outdent of indented list
authorAryeh Gregor <AryehGregor+gitcommit@gmail.com>
Mon, 16 May 2011 15:14:01 -0600
changeset 130 a7f63ad59c30
parent 129 c1cfeffea597
child 131 59bfd08fbd1b
Improve outdent of indented list

Previously we would outdent the list, now we outdent the non-list part
of the indentation. This changes from matching WebKit to matching
Trident/Gecko, and it makes more sense.
autoimplementation.html
editcommands.html
implementation.js
source.html
--- a/autoimplementation.html	Mon May 16 15:11:38 2011 -0600
+++ b/autoimplementation.html	Mon May 16 15:14:01 2011 -0600
@@ -979,6 +979,10 @@
 		'<ol><li>foo</li><ol id=abc><li>[bar<li>baz]</ol><li>quz</ol>',
 		'<ol><li>foo</li><ol style=color:red><li>[bar<li>baz]</ol><li>quz</ol>',
 		'<ol><li>foo</li><ol style=text-indent:1em><li>[bar<li>baz]</ol><li>quz</ol>',
+
+		// List inside indentation element
+		'<blockquote><ol><li>[foo]</ol></blockquote><p>extra',
+		'<blockquote>foo<ol><li>[bar]</ol>baz</blockquote><p>extra',
 	],
 	removeformat: [
 		'foo[]bar',
--- a/editcommands.html	Mon May 16 15:11:38 2011 -0600
+++ b/editcommands.html	Mon May 16 15:14:01 2011 -0600
@@ -3072,42 +3072,6 @@
 <ol>
   <li>If <var title="">node</var> is not <a href=#editable>editable</a>, abort these steps.
 
-  <li>If <var title="">node</var> is an <code class=external data-anolis-spec=html title="the ol element"><a href=http://www.whatwg.org/html/#the-ol-element>ol</a></code> or <code class=external data-anolis-spec=html title="the ul element"><a href=http://www.whatwg.org/html/#the-ul-element>ul</a></code>:
-
-  <div class=XXX>
-  <p>We don't handle a case like
-
-  </p><xmp><ol><ol style="color: red"><li>foo<li>bar</ol><li>baz</ol></xmp>
-
-  <p>If the inner <code class=external data-anolis-spec=html title="the ol element"><a href=http://www.whatwg.org/html/#the-ol-element>ol</a></code> is selected to be outdented, "foo" and "bar" will stop
-  being red.  It seems nontrivial to handle this case in general, since we
-  can't group <code class=external data-anolis-spec=html title="the li element"><a href=http://www.whatwg.org/html/#the-li-element>li</a></code>s.  If the list we're outdenting is a child of a non-list,
-  then we can just change it to a div.
-  </div>
-  <!--
-  Chrome 12 dev seems to special-case style attributes by converting them to
-  the corresponding inline markup elements (at least in easy cases like color).
-  For other attributes and non-WebKit browsers (IE9/FF4/O11.10), it looks like
-  all the attributes are just removed.  Maybe we should try to copy WebKit
-  here.
-  -->
-
-  <ol>
-    <li>Unset the <code class=external data-anolis-spec=html title=attr-ol-reversed><a href=http://www.whatwg.org/html/#attr-ol-reversed>reversed</a></code>, <code class=external data-anolis-spec=html title=attr-ol-start><a href=http://www.whatwg.org/html/#attr-ol-start>start</a></code>, and <code class=external data-anolis-spec=html title=attr-ol-type><a href=http://www.whatwg.org/html/#attr-ol-type>type</a></code> attributes of <var title="">node</var>, if any are
-    set.
-
-    <li>Let <var title="">children</var> be the <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a> of <var title="">node</var>.
-
-    <li>If <var title="">node</var> has attributes, and its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> or not an <code class=external data-anolis-spec=html title="the ol element"><a href=http://www.whatwg.org/html/#the-ol-element>ol</a></code>
-    or <code class=external data-anolis-spec=html title="the ul element"><a href=http://www.whatwg.org/html/#the-ul-element>ul</a></code>, <a href=#set-the-tag-name>set the tag name</a> of <var title="">node</var> to "div".
-
-    <li>Otherwise remove <var title="">node</var>, <a href=#preserving-its-descendants>preserving its descendants</a>.
-
-    <li><a href=#fix-orphaned-list-items>Fix orphaned list items</a> in <var title="">children</var>.
-
-    <li>Abort these steps.
-  </ol>
-
   <!-- The easy case is when the whole element is indented.  In this case we
   remove the whole thing indiscriminately.  In the case of blockquotes
   created by IE, this might change the direction of some children, but then
@@ -3194,6 +3158,47 @@
   </ol>
 
   <li>If <var title="">current ancestor</var> is not an <a href=#editable>editable</a>
+  <a href=#potential-indentation-element>potential indentation element</a>, and <var title="">node</var> is an <code class=external data-anolis-spec=html title="the ol element"><a href=http://www.whatwg.org/html/#the-ol-element>ol</a></code>
+  or <code class=external data-anolis-spec=html title="the ul element"><a href=http://www.whatwg.org/html/#the-ul-element>ul</a></code>:
+  <!-- This matches IE9 and Firefox 4.0.  When asked to outdent a list wrapped
+  in an indentation element, Chrome 12 dev removes the list instead of the
+  indentation element.  Opera 11.10 seems to remove both. -->
+
+  <div class=XXX>
+  <p>We don't handle a case like
+
+  </p><xmp><ol><ol style="color: red"><li>foo<li>bar</ol><li>baz</ol></xmp>
+
+  <p>If the inner <code class=external data-anolis-spec=html title="the ol element"><a href=http://www.whatwg.org/html/#the-ol-element>ol</a></code> is selected to be outdented, "foo" and "bar" will stop
+  being red.  It seems nontrivial to handle this case in general, since we
+  can't group <code class=external data-anolis-spec=html title="the li element"><a href=http://www.whatwg.org/html/#the-li-element>li</a></code>s.  If the list we're outdenting is a child of a non-list,
+  then we can just change it to a div.
+  </div>
+  <!--
+  Chrome 12 dev seems to special-case style attributes by converting them to
+  the corresponding inline markup elements (at least in easy cases like color).
+  For other attributes and non-WebKit browsers (IE9/FF4/O11.10), it looks like
+  all the attributes are just removed.  Maybe we should try to copy WebKit
+  here.
+  -->
+
+  <ol>
+    <li>Unset the <code class=external data-anolis-spec=html title=attr-ol-reversed><a href=http://www.whatwg.org/html/#attr-ol-reversed>reversed</a></code>, <code class=external data-anolis-spec=html title=attr-ol-start><a href=http://www.whatwg.org/html/#attr-ol-start>start</a></code>, and <code class=external data-anolis-spec=html title=attr-ol-type><a href=http://www.whatwg.org/html/#attr-ol-type>type</a></code> attributes of <var title="">node</var>, if any are
+    set.
+
+    <li>Let <var title="">children</var> be the <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a> of <var title="">node</var>.
+
+    <li>If <var title="">node</var> has attributes, and its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> or not an <code class=external data-anolis-spec=html title="the ol element"><a href=http://www.whatwg.org/html/#the-ol-element>ol</a></code>
+    or <code class=external data-anolis-spec=html title="the ul element"><a href=http://www.whatwg.org/html/#the-ul-element>ul</a></code>, <a href=#set-the-tag-name>set the tag name</a> of <var title="">node</var> to "div".
+
+    <li>Otherwise remove <var title="">node</var>, <a href=#preserving-its-descendants>preserving its descendants</a>.
+
+    <li><a href=#fix-orphaned-list-items>Fix orphaned list items</a> in <var title="">children</var>.
+
+    <li>Abort these steps.
+  </ol>
+
+  <li>If <var title="">current ancestor</var> is not an <a href=#editable>editable</a>
   <a href=#potential-indentation-element>potential indentation element</a>, abort these steps.
 
   <!-- At this point, we have an ancestor to split up. -->
--- a/implementation.js	Mon May 16 15:11:38 2011 -0600
+++ b/implementation.js	Mon May 16 15:14:01 2011 -0600
@@ -3246,37 +3246,6 @@
 		return;
 	}
 
-	// "If node is an ol or ul:"
-	if (isHtmlElement(node, "OL")
-	|| isHtmlElement(node, "UL")) {
-		// "Unset the reversed, start, and type attributes of node, if any are
-		// set."
-		node.removeAttribute("reversed");
-		node.removeAttribute("start");
-		node.removeAttribute("type");
-
-		// "Let children be the children of node."
-		var children = [].slice.call(node.childNodes);
-
-		// "If node has attributes, and its parent or not an ol or ul, set the
-		// tag name of node to "div"."
-		if (node.attributes.length
-		&& !isHtmlElement(node.parentNode, "OL")
-		&& !isHtmlElement(node.parentNode, "UL")) {
-			setTagName(node, "div");
-
-		// "Otherwise remove node, preserving its descendants."
-		} else {
-			removePreservingDescendants(node);
-		}
-
-		// "Fix orphaned list items in children."
-		fixOrphanedListItems(children);
-
-		// "Abort these steps."
-		return;
-	}
-
 	// "If node is an indentation element, remove node, preserving its
 	// descendants.  Then abort these steps."
 	if (isIndentationElement(node)) {
@@ -3342,6 +3311,40 @@
 	}
 
 	// "If current ancestor is not an editable potential indentation element,
+	// and node is an ol or ul:"
+	if ((!isEditable(currentAncestor)
+	|| !isPotentialIndentationElement(currentAncestor))
+	&& (isHtmlElement(node, "OL")
+	|| isHtmlElement(node, "UL"))) {
+		// "Unset the reversed, start, and type attributes of node, if any are
+		// set."
+		node.removeAttribute("reversed");
+		node.removeAttribute("start");
+		node.removeAttribute("type");
+
+		// "Let children be the children of node."
+		var children = [].slice.call(node.childNodes);
+
+		// "If node has attributes, and its parent or not an ol or ul, set the
+		// tag name of node to "div"."
+		if (node.attributes.length
+		&& !isHtmlElement(node.parentNode, "OL")
+		&& !isHtmlElement(node.parentNode, "UL")) {
+			setTagName(node, "div");
+
+		// "Otherwise remove node, preserving its descendants."
+		} else {
+			removePreservingDescendants(node);
+		}
+
+		// "Fix orphaned list items in children."
+		fixOrphanedListItems(children);
+
+		// "Abort these steps."
+		return;
+	}
+
+	// "If current ancestor is not an editable potential indentation element,
 	// abort these steps."
 	if (!isEditable(currentAncestor)
 	|| !isPotentialIndentationElement(currentAncestor)) {
--- a/source.html	Mon May 16 15:11:38 2011 -0600
+++ b/source.html	Mon May 16 15:14:01 2011 -0600
@@ -3120,45 +3120,6 @@
 <ol>
   <li>If <var>node</var> is not <span>editable</span>, abort these steps.
 
-  <li>If <var>node</var> is an [[ol]] or [[ul]]:
-
-  <div class=XXX>
-  <p>We don't handle a case like
-
-  <xmp><ol><ol style="color: red"><li>foo<li>bar</ol><li>baz</ol></xmp>
-
-  <p>If the inner [[ol]] is selected to be outdented, "foo" and "bar" will stop
-  being red.  It seems nontrivial to handle this case in general, since we
-  can't group [[li]]s.  If the list we're outdenting is a child of a non-list,
-  then we can just change it to a div.
-  </div>
-  <!--
-  Chrome 12 dev seems to special-case style attributes by converting them to
-  the corresponding inline markup elements (at least in easy cases like color).
-  For other attributes and non-WebKit browsers (IE9/FF4/O11.10), it looks like
-  all the attributes are just removed.  Maybe we should try to copy WebKit
-  here.
-  -->
-
-  <ol>
-    <li>Unset the <code data-anolis-spec=html
-    title=attr-ol-reversed>reversed</code>, <code data-anolis-spec=html
-    title=attr-ol-start>start</code>, and <code data-anolis-spec=html
-    title=attr-ol-type>type</code> attributes of <var>node</var>, if any are
-    set.
-
-    <li>Let <var>children</var> be the [[children]] of <var>node</var>.
-
-    <li>If <var>node</var> has attributes, and its [[parent]] or not an [[ol]]
-    or [[ul]], <span>set the tag name</span> of <var>node</var> to "div".
-
-    <li>Otherwise remove <var>node</var>, <span>preserving its descendants</span>.
-
-    <li><span>Fix orphaned list items</span> in <var>children</var>.
-
-    <li>Abort these steps.
-  </ol>
-
   <!-- The easy case is when the whole element is indented.  In this case we
   remove the whole thing indiscriminately.  In the case of blockquotes
   created by IE, this might change the direction of some children, but then
@@ -3245,6 +3206,50 @@
   </ol>
 
   <li>If <var>current ancestor</var> is not an <span>editable</span>
+  <span>potential indentation element</span>, and <var>node</var> is an [[ol]]
+  or [[ul]]:
+  <!-- This matches IE9 and Firefox 4.0.  When asked to outdent a list wrapped
+  in an indentation element, Chrome 12 dev removes the list instead of the
+  indentation element.  Opera 11.10 seems to remove both. -->
+
+  <div class=XXX>
+  <p>We don't handle a case like
+
+  <xmp><ol><ol style="color: red"><li>foo<li>bar</ol><li>baz</ol></xmp>
+
+  <p>If the inner [[ol]] is selected to be outdented, "foo" and "bar" will stop
+  being red.  It seems nontrivial to handle this case in general, since we
+  can't group [[li]]s.  If the list we're outdenting is a child of a non-list,
+  then we can just change it to a div.
+  </div>
+  <!--
+  Chrome 12 dev seems to special-case style attributes by converting them to
+  the corresponding inline markup elements (at least in easy cases like color).
+  For other attributes and non-WebKit browsers (IE9/FF4/O11.10), it looks like
+  all the attributes are just removed.  Maybe we should try to copy WebKit
+  here.
+  -->
+
+  <ol>
+    <li>Unset the <code data-anolis-spec=html
+    title=attr-ol-reversed>reversed</code>, <code data-anolis-spec=html
+    title=attr-ol-start>start</code>, and <code data-anolis-spec=html
+    title=attr-ol-type>type</code> attributes of <var>node</var>, if any are
+    set.
+
+    <li>Let <var>children</var> be the [[children]] of <var>node</var>.
+
+    <li>If <var>node</var> has attributes, and its [[parent]] or not an [[ol]]
+    or [[ul]], <span>set the tag name</span> of <var>node</var> to "div".
+
+    <li>Otherwise remove <var>node</var>, <span>preserving its descendants</span>.
+
+    <li><span>Fix orphaned list items</span> in <var>children</var>.
+
+    <li>Abort these steps.
+  </ol>
+
+  <li>If <var>current ancestor</var> is not an <span>editable</span>
   <span>potential indentation element</span>, abort these steps.
 
   <!-- At this point, we have an ancestor to split up. -->