From 5e784fbb636ad515a200a02b1deb977bf8636272 Mon Sep 17 00:00:00 2001
From: Josh Johnson <josh@joshuajohnson.co.uk>
Date: Wed, 17 Oct 2018 22:36:37 +0100
Subject: [PATCH] Add search tests + refactor tests

---
 test/select-multiple.html | 43 ++++++++++++++++++++++++++++-----------
 test/select-one.html      | 27 +++++++++++++++++++++++-
 test/text.html            | 17 +++++++++++++++-
 3 files changed, 73 insertions(+), 14 deletions(-)

diff --git a/test/select-multiple.html b/test/select-multiple.html
index e7fe3c1c..2fbc2800 100644
--- a/test/select-multiple.html
+++ b/test/select-multiple.html
@@ -31,8 +31,17 @@
         <h2>Select multiple inputs</h2>
         <div data-test-hook="basic">
           <label for="choices-basic">Basic</label>
-          <select class="form-control" name="choices-basic" id="choices-basic" placeholder="This is a placeholder"
-            multiple>
+          <select class="form-control" name="choices-basic" id="choices-basic" placeholder="This is a placeholder" multiple>
+            <option value="Dropdown item 1">Dropdown item 1</option>
+            <option value="Dropdown item 2">Dropdown item 2</option>
+            <option value="Find me">Dropdown item 3</option>
+            <option value="Dropdown item 4">Dropdown item 4</option>
+          </select>
+        </div>
+
+        <div data-test-hook="remove-button">
+          <label for="choices-remove-button">Remove button</label>
+          <select class="form-control" name="choices-remove-button" id="choices-remove-button" placeholder="This is a placeholder" multiple>
             <option value="Dropdown item 1">Dropdown item 1</option>
             <option value="Dropdown item 2">Dropdown item 2</option>
             <option value="Dropdown item 3">Dropdown item 3</option>
@@ -42,8 +51,7 @@
 
         <div data-test-hook="disabled-choice">
           <label for="choices-disabled-choice">Disabled choice</label>
-          <select class="form-control" name="choices-disabled-choice" id="choices-disabled-choice" placeholder="This is a placeholder"
-            multiple>
+          <select class="form-control" name="choices-disabled-choice" id="choices-disabled-choice" placeholder="This is a placeholder" multiple>
             <option value="Dropdown item 1">Dropdown item 1</option>
             <option value="Dropdown item 2">Dropdown item 2</option>
             <option value="Dropdown item 3">Dropdown item 3</option>
@@ -53,8 +61,7 @@
 
         <div data-test-hook="selection-limit">
           <label for="choices-selection-limit">Input limit</label>
-          <select class="form-control" name="choices-selection-limit" id="choices-selection-limit" placeholder="This is a placeholder"
-            multiple>
+          <select class="form-control" name="choices-selection-limit" id="choices-selection-limit" placeholder="This is a placeholder" multiple>
             <option value="Dropdown item 1">Dropdown item 1</option>
             <option value="Dropdown item 2">Dropdown item 2</option>
             <option value="Dropdown item 3">Dropdown item 3</option>
@@ -66,8 +73,16 @@
 
         <div data-test-hook="prepend-append">
           <label for="choices-prepend-append">Prepend/append</label>
-          <select class="form-control" name="choices-prepend-append" id="choices-prepend-append" placeholder="This is a placeholder"
-            multiple>
+          <select class="form-control" name="choices-prepend-append" id="choices-prepend-append" placeholder="This is a placeholder" multiple>
+            <option value="Dropdown item 1">Dropdown item 1</option>
+            <option value="Dropdown item 2">Dropdown item 2</option>
+            <option value="Dropdown item 3">Dropdown item 3</option>
+          </select>
+        </div>
+
+        <div data-test-hook="render-choice-limit">
+          <label for="choices-render-choice-limit">Render choice limit</label>
+          <select class="form-control" name="choices-render-choice-limit" id="choices-render-choice-limit" placeholder="This is a placeholder" multiple>
             <option value="Dropdown item 1">Dropdown item 1</option>
             <option value="Dropdown item 2">Dropdown item 2</option>
             <option value="Dropdown item 3">Dropdown item 3</option>
@@ -77,13 +92,13 @@
     </div>
     <script>
       document.addEventListener('DOMContentLoaded', function() {
-        new Choices('#choices-basic', {
+        new Choices('#choices-basic');
+
+        new Choices('#choices-remove-button', {
           removeItemButton: true,
         });
 
-        new Choices('#choices-disabled-choice', {
-          removeItemButton: true,
-        });
+        new Choices('#choices-disabled-choice');
 
         new Choices('#choices-selection-limit', {
           maxItemCount: 5,
@@ -93,6 +108,10 @@
           prependValue: 'before-',
           appendValue: '-after',
         });
+
+        new Choices('#choices-render-choice-limit', {
+          renderChoiceLimit: 1
+        });
       });
     </script>
   </body>
diff --git a/test/select-one.html b/test/select-one.html
index 8bd1ecd9..7822af0c 100644
--- a/test/select-one.html
+++ b/test/select-one.html
@@ -32,6 +32,16 @@
         <div data-test-hook="basic">
           <label for="choices-basic">Basic</label>
           <select class="form-control" name="choices-basic" id="choices-basic" placeholder="This is a placeholder">
+            <option value="Dropdown item 1">Dropdown item 1</option>
+            <option value="Dropdown item 2">Dropdown item 2</option>
+            <option value="Find me">Dropdown item 3</option>
+            <option value="Dropdown item 4">Dropdown item 4</option>
+          </select>
+        </div>
+
+        <div data-test-hook="remove-button">
+          <label for="choices-remove-button">Remove button</label>
+          <select class="form-control" name="choices-remove-button" id="choices-remove-button" placeholder="This is a placeholder">
             <option value="Dropdown item 1">Dropdown item 1</option>
             <option value="Dropdown item 2">Dropdown item 2</option>
             <option value="Dropdown item 3">Dropdown item 3</option>
@@ -57,11 +67,22 @@
             <option value="Dropdown item 3">Dropdown item 3</option>
           </select>
         </div>
+
+        <div data-test-hook="render-choice-limit">
+          <label for="choices-render-choice-limit">Render choice limit</label>
+          <select class="form-control" name="choices-render-choice-limit" id="choices-render-choice-limit" placeholder="This is a placeholder">
+            <option value="Dropdown item 1">Dropdown item 1</option>
+            <option value="Dropdown item 2">Dropdown item 2</option>
+            <option value="Dropdown item 3">Dropdown item 3</option>
+          </select>
+        </div>
       </div>
     </div>
     <script>
       document.addEventListener('DOMContentLoaded', function() {
-        new Choices('#choices-basic', {
+        new Choices('#choices-basic');
+
+        new Choices('#choices-remove-button', {
           removeItemButton: true,
         });
 
@@ -73,6 +94,10 @@
           prependValue: 'before-',
           appendValue: '-after',
         });
+
+        new Choices('#choices-render-choice-limit', {
+          renderChoiceLimit: 1
+        });
       });
     </script>
   </body>
diff --git a/test/text.html b/test/text.html
index 1ab696b7..38567e18 100644
--- a/test/text.html
+++ b/test/text.html
@@ -34,6 +34,16 @@
           <input class="form-control" id="choices-basic" type="text" placeholder="Enter something">
         </div>
 
+        <div data-test-hook="edit-items">
+          <label for="choices-edit-items">Edit items</label>
+          <input class="form-control" id="choices-edit-items" type="text" placeholder="Enter something">
+        </div>
+
+        <div data-test-hook="remove-button">
+          <label for="choices-remove-button">Remove button</label>
+          <input class="form-control" id="choices-remove-button" type="text" placeholder="Enter something">
+        </div>
+
         <div data-test-hook="unique-values">
           <label for="choices-unique-values">Unique values</label>
           <input class="form-control" id="choices-unique-values" type="text" placeholder="This is a placeholder">
@@ -67,8 +77,13 @@
     </div>
     <script>
       document.addEventListener('DOMContentLoaded', function() {
-        new Choices('#choices-basic', {
+        new Choices('#choices-basic');
+
+        new Choices('#choices-edit-items', {
           editItems: true,
+        });
+
+        new Choices('#choices-remove-button', {
           removeItemButton: true,
         });