From ae4c84fb63877cc3169f77aca809dfa68a8086d6 Mon Sep 17 00:00:00 2001
From: OlgaLarina <olga.larina.developer@gmail.com>
Date: Tue, 29 Aug 2023 17:28:39 +0300
Subject: [PATCH] =?UTF-8?q?resolve=20#6754=20Dropdown=20with=20Lazy=20Load?=
 =?UTF-8?q?ing=20-=20The=20search=20query=20with=20the=20=C3=AA=20symbol?=
 =?UTF-8?q?=20doesn't=20produce=20any=20results=20when=20the=20the=20choic?=
 =?UTF-8?q?esLazyLoadEnabled=20option=20is=20set=20from=20code=20(#6814)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: OlgaLarina <olga.larina.dev@gmail.com>
---
 src/dropdownListModel.ts       |  3 +++
 src/list.ts                    |  3 +++
 tests/questionDropdownTests.ts | 41 ++++++++++++++++++++++++++++++++++
 3 files changed, 47 insertions(+)

diff --git a/src/dropdownListModel.ts b/src/dropdownListModel.ts
index fb26e39ed3..11ad29827c 100644
--- a/src/dropdownListModel.ts
+++ b/src/dropdownListModel.ts
@@ -373,6 +373,9 @@ export class DropdownListModel extends Base {
     if (options.name == "value") {
       this.showInputFieldComponent = this.question.showInputFieldComponent;
     }
+    if(options.name == "choicesLazyLoadEnabled" && options.newValue) {
+      this.listModel.setOnFilterStringChangedCallback(this.listModelFilterStringChanged);
+    }
   }
   protected focusItemOnClickAndPopup() {
     if (this._popupModel.isVisible && this.question.value)
diff --git a/src/list.ts b/src/list.ts
index 6bce812202..17cc64a74e 100644
--- a/src/list.ts
+++ b/src/list.ts
@@ -110,6 +110,9 @@ export class ListModel<T extends BaseAction = Action> extends ActionContainer<T>
     this.selectedItem = selectedItem;
   }
 
+  public setOnFilterStringChangedCallback(callback: (text: string) => void) {
+    this.onFilterStringChangedCallback = callback;
+  }
   public setItems(items: Array<IAction>, sortByVisibleIndex = true): void {
     super.setItems(items, sortByVisibleIndex);
     if(this.elementId) {
diff --git a/tests/questionDropdownTests.ts b/tests/questionDropdownTests.ts
index 969d590ee7..2e733f2ec8 100644
--- a/tests/questionDropdownTests.ts
+++ b/tests/questionDropdownTests.ts
@@ -1655,4 +1655,45 @@ QUnit.test("isReady flag + onGetChoiceDisplayValue + choicesRestfull", assert =>
   assert.ok(question["waitingAcyncOperations"]);
   assert.notOk(question["waitingChoicesByURL"]);
   assert.ok(question["waitingGetChoiceDisplayValueResponse"]);
+});
+
+QUnit.test("lazy loading: change choicesLazyLoadEnabled on runtime", assert => {
+  const json = {
+    questions: [{
+      "type": "dropdown",
+      "name": "q1",
+    }]
+  };
+  const survey = new SurveyModel(json);
+  survey.onChoicesLazyLoad.add((_, opt) => {
+    const total = 55;
+    const result: Array<any> = [];
+    for (let index = 0; index < total; index++) {
+      result.push({ value: "item" + index, text: "item" + index });
+    }
+    if(opt.filter === "des") {
+      opt.setItems(result.slice(10, 15), total);
+    } else {
+      opt.setItems(result.slice(0, 15), total);
+    }
+  });
+
+  const question = <QuestionDropdownModel>survey.getAllQuestions()[0];
+  assert.equal(question.choicesLazyLoadEnabled, false);
+  assert.equal(question.choices.length, 0);
+
+  question.choicesLazyLoadEnabled = true;
+  assert.equal(question.choicesLazyLoadEnabled, true);
+  assert.equal(question.choices.length, 0);
+  assert.equal(question.dropdownListModel["listModel"].visibleItems.length, 0, "#1");
+
+  question.dropdownListModel.popupModel.isVisible = true;
+  assert.equal(question.choices.length, 15);
+  assert.equal(question.dropdownListModel["listModel"].visibleItems.length, 16, "#2");
+  assert.equal(question.dropdownListModel["listModel"].visibleItems[15].id, "loadingIndicator");
+
+  question.dropdownListModel.filterString = "des";
+  assert.equal(question.choices.length, 5);
+  assert.equal(question.dropdownListModel["listModel"].visibleItems.length, 6, "#3");
+  assert.equal(question.dropdownListModel["listModel"].visibleItems[5].id, "loadingIndicator");
 });
\ No newline at end of file