[cssom] Correct serialization of an+b selectors

According to https://drafts.csswg.org/css-syntax/#serializing-anb, if a
is 1 or -1 the number should be omitted. We did not follow this, causing
us to fail parts of external/wpt/css/cssom/selectorSerialize.html.
Change our behavior to match the spec and the test.

Bug: 818475
Change-Id: Ie0f44e2a3fb51069aad492096138020b67359982
Reviewed-on: https://chromium-review.googlesource.com/948066Reviewed-by: Rune Lillesveen <futhark@chromium.org>
Commit-Queue: Chris Nardi <cnardi@chromium.org>
Cr-Commit-Position: refs/heads/master@{#540827}

third_party/WebKit/LayoutTests/css3/parsing-css3-nthchild-expected.txt

@@ -2,18 +2,18 @@ SUCCESS
 
 Rules from the stylesheet:
 
-#a:nth-child(1n-1) { color: green; }
-#b:nth-child(1n-10) { color: green; }
-#g:nth-child(-1n-1) { color: green; }
-#h:nth-child(-1n-10) { color: green; }
-#n:nth-child(-1n-1) { color: green; }
-#o:nth-child(-1n+13) { color: green; }
+#a:nth-child(n-1) { color: green; }
+#b:nth-child(n-10) { color: green; }
+#g:nth-child(-n-1) { color: green; }
+#h:nth-child(-n-10) { color: green; }
+#n:nth-child(-n-1) { color: green; }
+#o:nth-child(-n+13) { color: green; }
 Expected result:
 
-#a:nth-child(1n-1) { color: green; }
-#b:nth-child(1n-10) { color: green; }
-#g:nth-child(-1n-1) { color: green; }
-#h:nth-child(-1n-10) { color: green; }
-#n:nth-child(-1n-1) { color: green; }
-#o:nth-child(-1n+13) { color: green; }
+#a:nth-child(n-1) { color: green; }
+#b:nth-child(n-10) { color: green; }
+#g:nth-child(-n-1) { color: green; }
+#h:nth-child(-n-10) { color: green; }
+#n:nth-child(-n-1) { color: green; }
+#o:nth-child(-n+13) { color: green; }
 

third_party/WebKit/LayoutTests/css3/parsing-css3-nthchild.html

@@ -52,11 +52,11 @@ function runTest()
 
 <p>Expected result:</p>
 
-<pre id="expected">#a:nth-child(1n-1) { color: green; }
-#b:nth-child(1n-10) { color: green; }
-#g:nth-child(-1n-1) { color: green; }
-#h:nth-child(-1n-10) { color: green; }
-#n:nth-child(-1n-1) { color: green; }
-#o:nth-child(-1n+13) { color: green; }
+<pre id="expected">#a:nth-child(n-1) { color: green; }
+#b:nth-child(n-10) { color: green; }
+#g:nth-child(-n-1) { color: green; }
+#h:nth-child(-n-10) { color: green; }
+#n:nth-child(-n-1) { color: green; }
+#o:nth-child(-n+13) { color: green; }
 </pre>
 </body>

third_party/WebKit/LayoutTests/external/wpt/css/cssom/selectorSerialize-expected.txt

-This is a testharness.js-based test.
-FAIL :nth-child serialization produces canonical form assert_equals: expected ":nth-child(n)" but got ":nth-child(1n)"
-PASS single universal selector shows '*' when serialized.
-PASS single type (simple) selector in the sequence of simple selectors that is not a universal selector
-PASS single class (simple) selector in the sequence of simple selectors that is not a universal selector
-PASS single id (simple) selector in the sequence of simple selectors that is not a universal selector
-PASS single pseudo (simple) selector which does not accept arguments in the sequence of simple selectors that is not a universal selector
-PASS single pseudo (simple) selector "lang" which accepts arguments in the sequence of simple selectors that is not a universal selector
-FAIL single pseudo (simple) selector "nth-child" which accepts arguments in the sequence of simple selectors that is not a universal selector assert_equals: expected ":nth-child(n+5)" but got ":nth-child(1n+5)"
-FAIL single pseudo (simple) selector "nth-last-child" which accepts arguments in the sequence of simple selectors that is not a universal selector assert_equals: expected ":nth-last-child(n+5)" but got ":nth-last-child(1n+5)"
-FAIL single pseudo (simple) selector "nth-of-child" which accepts arguments in the sequence of simple selectors that is not a universal selector assert_equals: expected ":nth-of-type(n+5)" but got ":nth-of-type(1n+5)"
-FAIL single pseudo (simple) selector ":nth-last-of-type" which accepts arguments in the sequence of simple selectors that is not a universal selector assert_equals: expected ":nth-last-of-type(n+5)" but got ":nth-last-of-type(1n+5)"
-PASS single pseudo (simple) selector ":not" which accepts arguments in the sequence of simple selectors that is not a universal selector
-Harness: the test ran to completion.
-

third_party/WebKit/LayoutTests/fast/css/parsing-css-nth-child-expected.txt

@@ -4,36 +4,36 @@ SUCCESS
 
 Rules from the stylesheet:
 
-#a:nth-child(1n) { color: green; }
-#b:nth-child(1n) { color: green; }
-#c:nth-child(1n) { color: green; }
-#d:nth-child(-1n) { color: green; }
-#e:nth-child(-1n) { color: green; }
-#f:nth-child(1n) { color: green; }
-#g:nth-child(1n) { color: green; }
-#h:nth-child(1n) { color: green; }
-#i:nth-child(-1n) { color: green; }
-#j:nth-child(-1n) { color: green; }
-#l:nth-child(-1n-123) { color: green; }
-#m:nth-child(1n-123) { color: green; }
+#a:nth-child(n) { color: green; }
+#b:nth-child(n) { color: green; }
+#c:nth-child(n) { color: green; }
+#d:nth-child(-n) { color: green; }
+#e:nth-child(-n) { color: green; }
+#f:nth-child(n) { color: green; }
+#g:nth-child(n) { color: green; }
+#h:nth-child(n) { color: green; }
+#i:nth-child(-n) { color: green; }
+#j:nth-child(-n) { color: green; }
+#l:nth-child(-n-123) { color: green; }
+#m:nth-child(n-123) { color: green; }
 #o:nth-child(23n+123) { color: green; }
-#t:nth-child(1n+3) { color: green; }
-#u:nth-child(1n+7) { color: green; }
+#t:nth-child(n+3) { color: green; }
+#u:nth-child(n+7) { color: green; }
 Expected result:
 
-#a:nth-child(1n) { color: green; }
-#b:nth-child(1n) { color: green; }
-#c:nth-child(1n) { color: green; }
-#d:nth-child(-1n) { color: green; }
-#e:nth-child(-1n) { color: green; }
-#f:nth-child(1n) { color: green; }
-#g:nth-child(1n) { color: green; }
-#h:nth-child(1n) { color: green; }
-#i:nth-child(-1n) { color: green; }
-#j:nth-child(-1n) { color: green; }
-#l:nth-child(-1n-123) { color: green; }
-#m:nth-child(1n-123) { color: green; }
+#a:nth-child(n) { color: green; }
+#b:nth-child(n) { color: green; }
+#c:nth-child(n) { color: green; }
+#d:nth-child(-n) { color: green; }
+#e:nth-child(-n) { color: green; }
+#f:nth-child(n) { color: green; }
+#g:nth-child(n) { color: green; }
+#h:nth-child(n) { color: green; }
+#i:nth-child(-n) { color: green; }
+#j:nth-child(-n) { color: green; }
+#l:nth-child(-n-123) { color: green; }
+#m:nth-child(n-123) { color: green; }
 #o:nth-child(23n+123) { color: green; }
-#t:nth-child(1n+3) { color: green; }
-#u:nth-child(1n+7) { color: green; }
+#t:nth-child(n+3) { color: green; }
+#u:nth-child(n+7) { color: green; }
 

third_party/WebKit/LayoutTests/fast/css/parsing-css-nth-child.html

@@ -71,21 +71,21 @@ function runTest()
 
 <p>Expected result:</p>
 
-<pre id="expected">#a:nth-child(1n) { color: green; }
-#b:nth-child(1n) { color: green; }
-#c:nth-child(1n) { color: green; }
-#d:nth-child(-1n) { color: green; }
-#e:nth-child(-1n) { color: green; }
-#f:nth-child(1n) { color: green; }
-#g:nth-child(1n) { color: green; }
-#h:nth-child(1n) { color: green; }
-#i:nth-child(-1n) { color: green; }
-#j:nth-child(-1n) { color: green; }
-#l:nth-child(-1n-123) { color: green; }
-#m:nth-child(1n-123) { color: green; }
+<pre id="expected">#a:nth-child(n) { color: green; }
+#b:nth-child(n) { color: green; }
+#c:nth-child(n) { color: green; }
+#d:nth-child(-n) { color: green; }
+#e:nth-child(-n) { color: green; }
+#f:nth-child(n) { color: green; }
+#g:nth-child(n) { color: green; }
+#h:nth-child(n) { color: green; }
+#i:nth-child(-n) { color: green; }
+#j:nth-child(-n) { color: green; }
+#l:nth-child(-n-123) { color: green; }
+#m:nth-child(n-123) { color: green; }
 #o:nth-child(23n+123) { color: green; }
-#t:nth-child(1n+3) { color: green; }
-#u:nth-child(1n+7) { color: green; }
+#t:nth-child(n+3) { color: green; }
+#u:nth-child(n+7) { color: green; }
 </pre>
 
 <script>

third_party/WebKit/LayoutTests/fast/dom/css-selectorText-expected.txt

@@ -34,22 +34,22 @@ div span#foo.test div:hover#bar a
 :nth-child(2n)
 :nth-child(2n)
 :nth-child(2n+1)
-:nth-child(-1n+6)
+:nth-child(-n+6)
 :nth-last-child(2n+1)
 :nth-last-child(2n)
 :nth-last-child(2n)
 :nth-last-child(2n+1)
-:nth-last-child(-1n+6)
+:nth-last-child(-n+6)
 :nth-of-type(2n+1)
 :nth-of-type(2n)
 :nth-of-type(2n)
 :nth-of-type(2n+1)
-:nth-of-type(-1n+6)
+:nth-of-type(-n+6)
 :nth-last-of-type(2n+1)
 :nth-last-of-type(2n)
 :nth-last-of-type(2n)
 :nth-last-of-type(2n+1)
-:nth-last-of-type(-1n+6)
+:nth-last-of-type(-n+6)
 :first-child
 :last-child
 :first-of-type

third_party/WebKit/Source/core/css/CSSSelector.cpp

@@ -716,19 +716,24 @@ const CSSSelector* CSSSelector::SerializeCompound(
         case kPseudoNthLastOfType: {
           builder.Append('(');
 
-          // http://dev.w3.org/csswg/css-syntax/#serializing-anb
+          // https://drafts.csswg.org/css-syntax/#serializing-anb
           int a = simple_selector->data_.rare_data_->NthAValue();
           int b = simple_selector->data_.rare_data_->NthBValue();
-          if (a == 0 && b == 0)
-            builder.Append('0');
-          else if (a == 0)
+          if (a == 0) {
             builder.Append(String::Number(b));
-          else if (b == 0)
-            builder.Append(String::Format("%dn", a));
-          else if (b < 0)
-            builder.Append(String::Format("%dn%d", a, b));
+          } else {
+            if (a == 1)
+              builder.Append('n');
+            else if (a == -1)
+              builder.Append("-n");
             else
-            builder.Append(String::Format("%dn+%d", a, b));
+              builder.Append(String::Format("%dn", a));
+
+            if (b < 0)
+              builder.Append(String::Number(b));
+            else if (b > 0)
+              builder.Append(String::Format("+%d", b));
+          }
 
           builder.Append(')');
           break;