Apply 'appearance: auto' for elements of which appearance value is

'menulist' and 'listbox'

Also, this CL replaces the remaining '-webkit-appearance' usages with
'appearance'.

The new behavior matches to Firefox.

Bug: 965432
Change-Id: Ic091a0825beb437d634bdfe4959b9e364666cf92
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2634882
Auto-Submit: Kent Tamura <tkent@chromium.org>
Commit-Queue: Kent Tamura <tkent@chromium.org>
Commit-Queue: Yoshifumi Inoue <yosin@chromium.org>
Reviewed-by: Yoshifumi Inoue <yosin@chromium.org>
Cr-Commit-Position: refs/heads/master@{#845520}

third_party/blink/renderer/core/html/resources/android.css

@@ -56,7 +56,7 @@ input[type="month" i],
 input[type="time" i],
 input[type="week" i] {
     align-items: center;
-    -webkit-appearance: menulist; /* AutoAppearanceFor() should match to this. */
+    appearance: auto;
     background-color: ButtonFace;
     border: 1px solid #a9a9a9;
     display: -webkit-inline-flex;

third_party/blink/renderer/core/html/resources/html.css

@@ -583,7 +583,7 @@ input[type="password" i]::-internal-input-suggested {
 }
 
 input[type="hidden" i], input[type="image" i], input[type="file" i] {
-    -webkit-appearance: initial; /* AutoAppearanceFor() should match to this. */
+    appearance: none;
     padding: initial;
     background-color: initial;
     border: initial;
@@ -608,7 +608,7 @@ input[type="image" i] {
 input:-internal-autofill-previewed,
 textarea:-internal-autofill-previewed,
 select:-internal-autofill-previewed {
-  -webkit-appearance:menulist-button;
+  appearance: menulist-button;
   background-color: #E8F0FE !important;
   background-image:none !important;
   color: -internal-light-dark(black, white) !important;
@@ -617,7 +617,7 @@ select:-internal-autofill-previewed {
 input:-internal-autofill-selected,
 textarea:-internal-autofill-selected,
 select:-internal-autofill-selected {
-  -webkit-appearance:menulist-button;
+  appearance: menulist-button;
   background-color: #E8F0FE !important;
   background-image:none !important;
   color: -internal-light-dark(black, white) !important;
@@ -659,7 +659,7 @@ input[type="button" i], input[type="submit" i], input[type="reset" i], input[typ
 }
 
 input[type="range" i] {
-    appearance: auto; /* AutoAppearanceFor() should match to this. */
+    appearance: auto;
     padding: initial;
     border: initial;
     margin: 2px;
@@ -781,7 +781,7 @@ input[type="color" i]::-webkit-color-swatch {
 }
 
 input[type="color" i][list] {
-    -webkit-appearance: menulist; /* AutoAppearanceFor() should match to this. */
+    appearance: auto;
     width: 88px;
     height: 23px
 }
@@ -838,7 +838,7 @@ input[readonly]::-webkit-calendar-picker-indicator {
 }
 
 select {
-    -webkit-appearance: menulist; /* AutoAppearanceFor() should match to this. */
+    appearance: auto;
     box-sizing: border-box;
     align-items: center;
     border: 1px solid;
@@ -854,7 +854,7 @@ select:not(:-internal-list-box) {
 }
 
 select:-internal-list-box {
-    -webkit-appearance: listbox; /* AutoAppearanceFor() should match to this. */
+    appearance: auto;
     align-items: flex-start;
     border: 1px inset gray;
     border-radius: initial;

third_party/blink/web_tests/external/wpt/html/rendering/widgets/appearance/default-styles-expected.txt

-This is a testharness.js-based test.
-PASS <input>
-PASS <input type="text">
-PASS <input type="TEXT">
-PASS <input type="search">
-PASS <input type="tel">
-PASS <input type="url">
-PASS <input type="email">
-PASS <input type="password">
-PASS <input type="date">
-PASS <input type="month">
-PASS <input type="week">
-PASS <input type="time">
-PASS <input type="datetime-local">
-PASS <input type="number">
-PASS <input type="range">
-PASS <input type="color">
-PASS <input type="checkbox">
-PASS <input type="radio">
-PASS <input type="submit">
-PASS <input type="reset">
-PASS <input type="button">
-PASS <input type="unknowntype">
-FAIL <select> assert_equals: -webkit-appearance expected "auto" but got "menulist"
-FAIL <select multiple=""> assert_equals: -webkit-appearance expected "auto" but got "listbox"
-FAIL <select size="2"> assert_equals: -webkit-appearance expected "auto" but got "listbox"
-PASS <button>
-PASS <textarea>
-PASS <meter>
-PASS <progress>
-PASS <input type="hidden">
-PASS <input type="HIDDEN">
-PASS <input type="file">
-PASS <input type="image">
-PASS <div>
-PASS <details>
-PASS <summary>
-PASS <video>
-PASS <video controls="">
-PASS <menuitem>
-PASS <marquee>
-PASS <keygen>
-PASS <input> (namespace: null)
-PASS <input> (namespace: http://www.w3.org/2000/svg)
-PASS The html element
-PASS The body element
-Harness: the test ran to completion.
-