fix(select): Update markup in tests and README

BREAKING CHANGE: empty space around `mdc-list-item__text` spans removed in select markup PiperOrigin-RevId: 312306749
material-components · May 19, 2020 · e3eacef · e3eacef
1 parent 2e60575
commit e3eacef
Show file tree

Hide file tree

Showing 2 changed files with 182 additions and 70 deletions.
diff --git a/packages/mdc-select/README.md b/packages/mdc-select/README.md
@@ -78,19 +78,13 @@ The select requires that you set the `width` of the `mdc-select` element. This i
     <ul class="mdc-list">
       <li class="mdc-list-item mdc-list-item--selected" data-value="" aria-selected="true"></li>
       <li class="mdc-list-item" data-value="grains">
-        <span class="mdc-list-item__text">
-          Bread, Cereal, Rice, and Pasta
-        </span>
+        <span class="mdc-list-item__text">Bread, Cereal, Rice, and Pasta</span>
       </li>
       <li class="mdc-list-item" data-value="vegetables">
-        <span class="mdc-list-item__text">
-          Vegetables
-        </span>
+        <span class="mdc-list-item__text">Vegetables</span>
       </li>
       <li class="mdc-list-item" data-value="fruit">
-        <span class="mdc-list-item__text">
-          Fruit
-        </span>
+        <span class="mdc-list-item__text">Fruit</span>
       </li>
     </ul>
   </div>
@@ -171,19 +165,13 @@ The following is an example of the select component with all of the necessary ar
     <ul class="mdc-list">
       <li class="mdc-list-item mdc-list-item--selected" aria-selected="true" data-value="" role="option"></li>
       <li class="mdc-list-item" data-value="grains" role="option">
-        <span class="mdc-list-item__text">
-          Bread, Cereal, Rice, and Pasta
-        </span>
+        <span class="mdc-list-item__text">Bread, Cereal, Rice, and Pasta</span>
       </li>
       <li class="mdc-list-item mdc-list-item--disabled" data-value="vegetables" aria-disabled="true" role="option">
-        <span class="mdc-list-item__text">
-          Vegetables
-        </span>
+        <span class="mdc-list-item__text">Vegetables</span>
       </li>
       <li class="mdc-list-item" data-value="fruit" role="option">
-        <span class="mdc-list-item__text">
-          Fruit
-        </span>
+        <span class="mdc-list-item__text">Fruit</span>
       </li>
     </ul>
   </div>
@@ -280,19 +268,13 @@ to set the selected item. The select also needs the text from the selected eleme
     <ul class="mdc-list">
       <li class="mdc-list-item" data-value=""></li>
       <li class="mdc-list-item" data-value="grains">
-        <span class="mdc-list-item__text">
-          Bread, Cereal, Rice, and Pasta
-        </span>
+        <span class="mdc-list-item__text">Bread, Cereal, Rice, and Pasta</span>
       </li>
       <li class="mdc-list-item mdc-list-item--selected" data-value="vegetables" aria-selected="true">
-        <span class="mdc-list-item__text">
-          Vegetables
-        </span>
+        <span class="mdc-list-item__text">Vegetables</span>
       </li>
       <li class="mdc-list-item" data-value="fruit">
-        <span class="mdc-list-item__text">
-          Fruit
-        </span>
+        <span class="mdc-list-item__text">Fruit</span>
       </li>
     </ul>
   </div>
@@ -407,19 +389,13 @@ programmatically select a disabled list item.
     <ul class="mdc-list">
       <li class="mdc-list-item" data-value=""></li>
       <li class="mdc-list-item" data-value="grains">
-        <span class="mdc-list-item__text">
-          Bread, Cereal, Rice, and Pasta
-        </span>
+        <span class="mdc-list-item__text">Bread, Cereal, Rice, and Pasta</span>
       </li>
       <li class="mdc-list-item mdc-list-item--selected mdc-list-item--disabled" data-value="vegetables">
-        <span class="mdc-list-item__text">
-          Vegetables
-        </span>
+        <span class="mdc-list-item__text">Vegetables</span>
       </li>
       <li class="mdc-list-item" data-value="fruit">
-        <span class="mdc-list-item__text">
-          Fruit
-        </span>
+        <span class="mdc-list-item__text">Fruit</span>
       </li>
     </ul>
   </div>
@@ -476,19 +452,13 @@ structure.
     <ul class="mdc-list">
       <li class="mdc-list-item mdc-list-item--selected" data-value="" aria-selected="true"></li>
       <li class="mdc-list-item" data-value="grains">
-        <span class="mdc-list-item__text">
-          Bread, Cereal, Rice, and Pasta
-        </span>
+        <span class="mdc-list-item__text">Bread, Cereal, Rice, and Pasta</span>
       </li>
       <li class="mdc-list-item" data-value="vegetables">
-        <span class="mdc-list-item__text">
-          Vegetables
-        </span>
+        <span class="mdc-list-item__text">Vegetables</span>
       </li>
       <li class="mdc-list-item" data-value="fruit">
-        <span class="mdc-list-item__text">
-          Fruit
-        </span>
+        <span class="mdc-list-item__text">Fruit</span>
       </li>
     </ul>
   </div>