resolve #3676 Survey Creator in Read Only mode - Conditional rules ar…

…e still editable via the Logic tab

packages/survey-creator-core/src/components/tabs/logic-ui.ts

@@ -60,7 +60,6 @@ export class SurveyLogicUI extends SurveyLogic {
       this.expressionEditorCanShowBuilder = !!this.editableItem;
     });
     this.itemsSurvey.onGetMatrixRowActions.add((sender, options) => {
-      if (this.readOnly) return;
       updateMatrixLogicExpandAction(options.question, options.actions, options.row);
       updateMatrixLogicRemoveAction(options.question, options.actions, options.row);
     });
@@ -116,6 +115,9 @@ export class SurveyLogicUI extends SurveyLogic {
   protected onReadOnlyChanged(): void {
     if (!this.itemsSurvey) return;
     this.itemsSurvey.mode = this.readOnly ? "display" : "edit";
+    Object.keys(this.itemUIHash || {}).forEach(id => {
+      this.updateEditModeLogicItem(this.itemUIHash[id]);
+    });
   }
   public get expressionEditor(): ConditionEditor {
     return this.expressionEditorValue;
@@ -129,11 +131,18 @@ export class SurveyLogicUI extends SurveyLogic {
   public getLogicItemEditor(item: SurveyLogicItem): LogicItemEditor {
     return this.getLogicItemUI(item).itemEditor;
   }
+  private updateEditModeLogicItem(item: ILogicItemUI) {
+    if (!item) return;
+
+    item.expressionEditor.editSurvey.mode = this.readOnly ? "display" : "edit";
+    item.itemEditor.editSurvey.mode = this.readOnly ? "display" : "edit";
+  }
   private getLogicItemUI(item: SurveyLogicItem): ILogicItemUI {
     let res: ILogicItemUI = this.itemUIHash[item.id];
     if (!res) {
       const context = <Question>item.getContext();
       res = { expressionEditor: this.createExpressionPropertyEditor(), itemEditor: new LogicItemEditor(item, this.options) };
+      this.updateEditModeLogicItem(res);
       res.expressionEditor.context = context;
       res.itemEditor.context = context;
       res.expressionEditor.text = item.expression;
@@ -191,7 +200,7 @@ export class SurveyLogicUI extends SurveyLogic {
   }
   protected hasErrorInUI(): boolean {
     const creator = (<any>this.survey).creator;
-    if(this.expressionEditor.hasErrorInUI()) {
+    if (this.expressionEditor.hasErrorInUI()) {
       this.errorText = this.expressionEditor.errorText;
       return true;
     }
@@ -298,7 +307,7 @@ export class SurveyLogicUI extends SurveyLogic {
   }
   private getLogicItemDisplayText(item: SurveyLogicItem): string {
     const text = item.getDisplayText();
-    if(!this.options) return text;
+    if (!this.options) return text;
     return this.options.onLogicGetTitleCallback(item.expression, item.expressionText, text, item);
   }
   private updateItemsSurveyData() {

packages/survey-creator-core/tests/tabs/logic.tests.ts

@@ -2782,4 +2782,47 @@ test("LogicPlugin: Prevent users from leaving the Logic tab when a Logic Rule wa
   logic.saveEditableItem();
   creator.makeNewViewActive("test");
   expect(creator.activeTab).toBe("test");
+});
+test("Creator is readonly", () => {
+  const creator = new CreatorTester({ showTitlesInExpressions: true });
+  creator.JSON = {
+    elements: [
+      { type: "text", name: "q1", title: "Question 1" },
+      { type: "text", name: "q2", visibleIf: "{q1}=1" },
+      { type: "text", name: "q3", visibleIf: "{q1}=1" },
+      { type: "text", name: "q4", visibleIf: "{q1}=2" },
+      { type: "text", name: "q5" }
+    ]
+  };
+  creator.readOnly = true;
+  const logicUI = new SurveyLogicUI(creator.survey, creator);
+
+  logicUI.editItem(logicUI.items[0]);
+  const logicUIHash = logicUI["itemUIHash"];
+  expect(Object.keys(logicUIHash)).toHaveLength(1);
+  let rule1 = logicUIHash[logicUI.items[0].id];
+  expect(rule1.expressionEditor.editSurvey.mode).toBe("display");
+  expect(rule1.itemEditor.editSurvey.mode).toBe("display");
+
+  logicUI.editItem(logicUI.items[1]);
+  expect(Object.keys(logicUIHash)).toHaveLength(2);
+  let rule2 = logicUIHash[logicUI.items[1].id];
+  expect(rule1.expressionEditor.editSurvey.mode).toBe("display");
+  expect(rule1.itemEditor.editSurvey.mode).toBe("display");
+  expect(rule2.expressionEditor.editSurvey.mode).toBe("display");
+  expect(rule2.itemEditor.editSurvey.mode).toBe("display");
+
+  logicUI.readOnly = false;
+  expect(Object.keys(logicUIHash)).toHaveLength(2);
+  expect(rule1.expressionEditor.editSurvey.mode).toBe("edit");
+  expect(rule1.itemEditor.editSurvey.mode).toBe("edit");
+  expect(rule2.expressionEditor.editSurvey.mode).toBe("edit");
+  expect(rule2.itemEditor.editSurvey.mode).toBe("edit");
+
+  logicUI.readOnly = true;
+  expect(Object.keys(logicUIHash)).toHaveLength(2);
+  expect(rule1.expressionEditor.editSurvey.mode).toBe("display");
+  expect(rule1.itemEditor.editSurvey.mode).toBe("display");
+  expect(rule2.expressionEditor.editSurvey.mode).toBe("display");
+  expect(rule2.itemEditor.editSurvey.mode).toBe("display");
 });