work for #8470 Comment Questions - It's impossible to override the 'a…

…llowResize' and 'autoGrow' settings when they are defined at the survey level via the survey.allowResizeComment and survey.autoGrowComment properties

src/question_comment.ts

@@ -1,5 +1,5 @@
 import { Question } from "./question";
-import { Serializer } from "./jsonobject";
+import { Serializer, property } from "./jsonobject";
 import { QuestionFactory } from "./questionfactory";
 import { LocalizableString } from "./localizablestring";
 import { QuestionTextBase } from "./question_textbase";
@@ -48,26 +48,39 @@ export class QuestionCommentModel extends QuestionTextBase {
    * @see allowResize
    */
   public get autoGrow(): boolean {
-    return this.getPropertyValue("autoGrow") || (this.survey && this.survey.autoGrowComment);
+    return this.getPropertyValue("autoGrow");
   }
   public set autoGrow(val: boolean) {
     this.setPropertyValue("autoGrow", val);
   }
+  public getAutoGrow(): boolean {
+    return this.autoGrow || (this.survey && this.survey.autoGrowComment);
+  }
   /**
-   * Specifies whether to display a resize handle for the comment area.
-   *
-   * Default value: `true` (inherited from `SurveyModel`'s [`allowResizeComment`](https://surveyjs.io/form-library/documentation/surveymodel#allowResizeComment) property)
-   * @see autoGrow
+   * Depricated, please use resize
    */
   public get allowResize(): boolean {
-    const value = this.getPropertyValue("allowResize");
-    return value === null ? (this.survey && this.survey.allowResizeComment) : value;
+    return this.getPropertyValue("allowResize");
   }
   public set allowResize(val: boolean) {
     this.setPropertyValue("allowResize", val);
   }
+  /**
+   * Specifies whether to display a resize handle for the comment area.
+   *
+   * Default value: `inherit` (inherited from `SurveyModel`'s [`allowResizeComment`](https://surveyjs.io/form-library/documentation/surveymodel#allowResizeComment) property)
+   * @see autoGrow
+   */
+  @property() resize: "both" | "none" | "inherit";
+
   public get renderedAllowResize(): boolean {
-    return this.allowResize && !this.isPreviewStyle && !this.isReadOnlyStyle;
+    let allowResize = false;
+    if (this.resize === "inherit") {
+      allowResize = (this.survey && this.survey.allowResizeComment);
+    } else {
+      allowResize = this.resize === "both";
+    }
+    return allowResize && !this.isPreviewStyle && !this.isReadOnlyStyle;
   }
   public get resizeStyle() {
     return this.renderedAllowResize ? "both" : "none";
@@ -82,7 +95,7 @@ export class QuestionCommentModel extends QuestionTextBase {
     super.afterRenderQuestionElement(el);
   }
   public updateElement(): void {
-    if (this.element && this.autoGrow) {
+    if (this.element && this.getAutoGrow()) {
       setTimeout(() => increaseHeightByContent(this.element), 1);
     }
   }
@@ -139,8 +152,9 @@ Serializer.addClass(
       default: "default",
       choices: ["default", "onBlur", "onTyping"],
     },
-    { name: "autoGrow:boolean", default: null },
-    { name: "allowResize:boolean", default: null },
+    { name: "autoGrow:boolean" },
+    { name: "allowResize:boolean", visible: false },
+    { name: "resize", default: "inherit", choices: ["both", "none", "inherit"] },
     { name: "acceptCarriageReturn:boolean", default: true, visible: false }
   ],
   function () {

tests/surveytests.ts

@@ -15024,8 +15024,10 @@ QUnit.test("onElementWrapperComponentName event", function (assert) {
 });
 QUnit.test("onElementWrapperComponentName event", function (assert) {
   const survey = new SurveyModel({
-    elements: [{ type: "text", name: "q1" }, { type: "checkbox", name: "q2", choices: [1, 2] },
-    { type: "matrixdynamic", name: "q3", rowCount: 1, columns: [{ name: "col1" }] }
+    elements: [
+      { type: "text", name: "q1" },
+      { type: "checkbox", name: "q2", choices: [1, 2] },
+      { type: "matrixdynamic", name: "q3", rowCount: 1, columns: [{ name: "col1" }] }
     ]
   });
   const q1 = survey.getQuestionByName("q1");
@@ -15480,14 +15482,14 @@ QUnit.test("survey.autoGrowComment", function (assert) {
   let comment2 = survey.getQuestionByName("comment2");
 
   assert.equal(survey.autoGrowComment, true);
-  assert.equal(comment1.autoGrow, true);
-  assert.equal(comment2.autoGrow, true);
+  assert.equal(comment1.getAutoGrow(), true);
+  assert.equal(comment2.getAutoGrow(), true);
 
   survey.autoGrowComment = false;
-  assert.equal(comment1.autoGrow, false);
-  assert.equal(comment2.autoGrow, true);
+  assert.equal(comment1.getAutoGrow(), false);
+  assert.equal(comment2.getAutoGrow(), true);
 });
-QUnit.only("survey.allowResizeComment", function (assert) {
+QUnit.test("survey.allowResizeComment", function (assert) {
   let json = {
     allowResizeComment: false,
     pages: [
@@ -15500,7 +15502,7 @@ QUnit.only("survey.allowResizeComment", function (assert) {
           {
             type: "comment",
             name: "comment2",
-            allowResize: false
+            resize: "none"
           }
         ]
       }
@@ -15527,7 +15529,7 @@ QUnit.only("survey.allowResizeComment", function (assert) {
   assert.equal(comment1Preview.renderedAllowResize, false);
 });
 
-QUnit.only("survey.allowResizeComment & survey.autoGrowComment override this properties for individual properties", function (assert) {
+QUnit.test("survey.allowResizeComment & survey.autoGrowComment override this properties for individual properties", function (assert) {
   let json = {
     allowResizeComment: false,
     autoGrowComment: false,
@@ -15538,7 +15540,7 @@ QUnit.only("survey.allowResizeComment & survey.autoGrowComment override this pro
             type: "comment",
             name: "comment1",
             autoGrow: true,
-            allowResize: true
+            resize: "both"
           },
           {
             type: "comment",
@@ -15553,16 +15555,16 @@ QUnit.only("survey.allowResizeComment & survey.autoGrowComment override this pro
   let comment2 = survey.getQuestionByName("comment2") as QuestionCommentModel;
 
   assert.equal(comment1.renderedAllowResize, true, "comment1 survey.allowResizeComment = false");
-  assert.equal(comment1.autoGrow, true, "comment1 survey.autoGrowComment = false");
+  assert.equal(comment1.getAutoGrow(), true, "comment1 survey.autoGrowComment = false");
   assert.equal(comment2.renderedAllowResize, false, "comment2 survey.allowResizeComment = false");
-  assert.equal(comment2.autoGrow, false, "comment2 survey.autoGrowComment = false");
+  assert.equal(comment2.getAutoGrow(), false, "comment2 survey.autoGrowComment = false");
 
   survey.allowResizeComment = true;
   survey.autoGrowComment = true;
   assert.equal(comment1.renderedAllowResize, true, "comment1 survey.allowResizeComment = true");
-  assert.equal(comment1.autoGrow, true, "comment1 survey.autoGrowComment = true");
+  assert.equal(comment1.getAutoGrow(), true, "comment1 survey.autoGrowComment = true");
   assert.equal(comment2.renderedAllowResize, true, "comment2 survey.allowResizeComment = true");
-  assert.equal(comment2.autoGrow, true, "comment2 survey.autoGrowComment = true");
+  assert.equal(comment2.getAutoGrow(), true, "comment2 survey.autoGrowComment = true");
 });
 
 QUnit.test("utils.increaseHeightByContent", assert => {