Merge pull request #1241 from Choices-js/fix-notices

Fix Notice for max item limit is removed permanently if you keep typing
Choices-js · Dec 21, 2024 · 2972987 · 2972987
2 parents 1876714 + 6c38e39
commit 2972987
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 0 deletions.
diff --git a/public/test/select-multiple/index.html b/public/test/select-multiple/index.html
@@ -91,6 +91,20 @@ <h2>Select multiple inputs</h2>
           </script>
         </div>
 
+        <div data-test-hook="single-item">
+          <label for="choices-basic">Single-item</label>
+          <select class="form-control" name="choices-single-item" id="choices-single-item">
+            <option value="Choice 1">Choice 1</option>
+          </select>
+          <script>
+            document.addEventListener('DOMContentLoaded', function() {
+              new Choices('#choices-single-item', {
+                allowHTML: true,
+              });
+            });
+          </script>
+        </div>
+
         <div data-test-hook="render-selected-choices">
           <label for="choices-remove-button">Render selected choices</label>
           <select

diff --git a/public/test/select-one/index.html b/public/test/select-one/index.html
@@ -86,6 +86,20 @@ <h2>Select one inputs</h2>
           </script>
         </div>
 
+        <div data-test-hook="single-item">
+          <label for="choices-basic">Single-item</label>
+          <select class="form-control" name="choices-single-item" id="choices-single-item">
+            <option value="Choice 1">Choice 1</option>
+          </select>
+          <script>
+            document.addEventListener('DOMContentLoaded', function() {
+              new Choices('#choices-single-item', {
+                allowHTML: true,
+              });
+            });
+          </script>
+        </div>
+
         <div data-test-hook="remove-button">
           <label for="choices-remove-button">Remove button</label>
           <select

diff --git a/src/scripts/choices.ts b/src/scripts/choices.ts
@@ -865,6 +865,7 @@ class Choices {
     }
     this.itemList.element.replaceChildren('');
     this.choiceList.element.replaceChildren('');
+    this._clearNotice();
     this._store.reset();
     this._lastAddedChoiceId = 0;
     this._lastAddedGroupId = 0;
@@ -1389,6 +1390,7 @@ class Choices {
 
     if (!config.singleModeForMultiSelect && maxItemCount > 0 && maxItemCount <= this._store.items.length) {
       this.choiceList.element.replaceChildren('');
+      this._notice = undefined;
       this._displayNotice(
         typeof maxItemText === 'function' ? maxItemText(maxItemCount) : maxItemText,
         NoticeTypes.addChoice,

diff --git a/test-e2e/tests/text.spec.ts b/test-e2e/tests/text.spec.ts
@@ -189,6 +189,10 @@ describe(`Choices - text element`, () => {
 
         expect(await suite.items.count()).toEqual(inputLimit);
         await suite.expectVisibleNoticeHtml(`Only ${inputLimit} values can be added`);
+
+        await suite.typeText(textInput);
+        expect(await suite.items.count()).toEqual(inputLimit);
+        await suite.expectVisibleNoticeHtml(`Only ${inputLimit} values can be added`);
       });
     });