From eeb55f2fe4d70e2e0ace9250dffc69672fb3d955 Mon Sep 17 00:00:00 2001
From: Andrew <andrew.telnov@gmail.com>
Date: Tue, 23 Apr 2024 10:43:22 +0300
Subject: [PATCH] =?UTF-8?q?MaxSelectedChoices=20stop=20updating=20Disabled?=
 =?UTF-8?q?=20class=20for=20selectbase=20(probl=E2=80=A6=20(#8163)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* MaxSelectedChoices stop updating Disabled class for selectbase (problem with v1.9.139) fix #8159

* Peform optimization #8159
---
 src/question_baseselect.ts        | 10 ++++++----
 src/survey-element.ts             | 11 +++++++++--
 tests/question_baseselecttests.ts | 31 ++++++++++++++++++++++++++++++-
 3 files changed, 45 insertions(+), 7 deletions(-)

diff --git a/src/question_baseselect.ts b/src/question_baseselect.ts
index fd96c4b69b..67269c87a1 100644
--- a/src/question_baseselect.ts
+++ b/src/question_baseselect.ts
@@ -1713,18 +1713,20 @@ export class QuestionSelectBase extends Question {
       .append("sv-q-col-" + this.getCurrentColCount(), !this.hasColumns && this.colCount !== 0)
       .append(this.cssClasses.itemOnError, this.hasCssError());
 
-    const isDisabled = this.isReadOnly || !item.isEnabled;
+    const readOnlyStyles = this.getIsDisableAndReadOnlyStyles(!item.isEnabled);
+    const isReadOnly = readOnlyStyles[0];
+    const isDisabled = readOnlyStyles[1];
     const isChecked = this.isItemSelected(item) ||
       (this.isOtherSelected && this.otherItem.value === item.value);
     const allowHover = !isDisabled && !isChecked && !(!!this.survey && this.survey.isDesignMode);
     const isNone = item === this.noneItem;
-    options.isDisabled = isDisabled;
+    options.isDisabled = isDisabled || isReadOnly;
     options.isChecked = isChecked;
     options.isNone = isNone;
 
     return builder
-      .append(this.cssClasses.itemDisabled, this.isDisabledStyle)
-      .append(this.cssClasses.itemReadOnly, this.isReadOnlyStyle)
+      .append(this.cssClasses.itemDisabled, isDisabled)
+      .append(this.cssClasses.itemReadOnly, isReadOnly)
       .append(this.cssClasses.itemPreview, this.isPreviewStyle)
       .append(this.cssClasses.itemChecked, isChecked)
       .append(this.cssClasses.itemHover, allowHover)
diff --git a/src/survey-element.ts b/src/survey-element.ts
index e79a5d9daa..702efb7b95 100644
--- a/src/survey-element.ts
+++ b/src/survey-element.ts
@@ -1019,10 +1019,17 @@ export class SurveyElement<E = any> extends SurveyElementCore implements ISurvey
       .append(cssClasses.titleOnError, this.containsErrors).toString();
   }
   public get isDisabledStyle(): boolean {
-    return !this.isDefaultV2Theme && (this.isReadOnlyStyle || this.isPreviewStyle);
+    return this.getIsDisableAndReadOnlyStyles(false)[1];
   }
   public get isReadOnlyStyle(): boolean {
-    return this.isReadOnly && !this.isPreviewStyle;
+    return this.getIsDisableAndReadOnlyStyles(false)[0];
+  }
+  protected getIsDisableAndReadOnlyStyles(itemReadOnly: boolean): Array<boolean> {
+    const isPreview = this.isPreviewStyle;
+    const isReadOnly = itemReadOnly || this.isReadOnly;
+    const isReadOnlyStyle = isReadOnly && !isPreview;
+    const isDisableStyle = !this.isDefaultV2Theme && (isReadOnly || isPreview);
+    return [isReadOnlyStyle, isDisableStyle];
   }
   public get isPreviewStyle(): boolean {
     return !!this.survey && this.survey.state === "preview";
diff --git a/tests/question_baseselecttests.ts b/tests/question_baseselecttests.ts
index 262125147c..41e5526c5b 100644
--- a/tests/question_baseselecttests.ts
+++ b/tests/question_baseselecttests.ts
@@ -1915,4 +1915,33 @@ QUnit.test("On value changed, comment and valueName Bug#8137", (assert) => {
   assert.equal(questionName, "q1", "question name #3");
   assert.equal(name, "val1-Comment", "name #3");
   assert.equal(value, "comment1", "value #3");
-});
\ No newline at end of file
+});
+QUnit.test("maxSelectedChoices & getItemClass, bug#8159", (assert) => {
+  var json = {
+    questions: [
+      {
+        type: "checkbox",
+        name: "q1",
+        choices: ["Item1", "Item2", "Item3"],
+        maxSelectedChoices: 2
+      },
+    ],
+  };
+  const survey = new SurveyModel(json);
+  const q1 = <QuestionSelectBase>survey.getQuestionByName("q1");
+  const disableStyle = "sv_q_disable";
+  const readOnlyStyle = "sv_q_disable";
+  q1.cssClasses.itemDisabled = disableStyle;
+  q1.cssClasses.itemReadOnly = readOnlyStyle;
+  q1.renderedValue = ["Item1", "Item3"];
+  assert.ok(q1.visibleChoices[0].enabled, "Item1 enabled #1");
+  assert.notOk(q1.visibleChoices[1].enabled, "Item2 enabled #2");
+
+  assert.notOk(q1.getItemClass(q1.visibleChoices[0]).indexOf(disableStyle) >= 0, "Item1 disabled #1");
+  assert.ok(q1.getItemClass(q1.visibleChoices[1]).indexOf(disableStyle) >= 0, "Item2 disabled #2");
+  assert.notOk(q1.getItemClass(q1.visibleChoices[2]).indexOf(disableStyle) >= 0, "Item3 disabled #3");
+
+  assert.notOk(q1.getItemClass(q1.visibleChoices[0]).indexOf(readOnlyStyle) >= 0, "Item1 read-only #1");
+  assert.ok(q1.getItemClass(q1.visibleChoices[1]).indexOf(readOnlyStyle) >= 0, "Item2 read-only #2");
+  assert.notOk(q1.getItemClass(q1.visibleChoices[2]).indexOf(readOnlyStyle) >= 0, "Item3 read-only #3");
+});