diff --git a/src/knockout/templates/comment.html b/src/knockout/templates/comment.html
index c7a5a84aa0..cafa37b6c2 100644
--- a/src/knockout/templates/comment.html
+++ b/src/knockout/templates/comment.html
@@ -1,7 +1,7 @@
 <script type="text/html" id="survey-comment">
   <!--ko if: !question.isReadOnlyRenderDiv() -->
 <textarea data-bind="attr: { id: question.commentId, maxLength: question.getOthersMaxLength(), 'aria-required': question.ariaRequired || question.a11y_input_ariaRequired, 'aria-label': question.ariaLabel || question.a11y_input_ariaLabel, placeholder: question.renderedCommentPlaceholder }, 
-        event: { input: function(s, e) { $data.question.onCommentInput(s, e); } }, 
+        event: { input: function(s, e) { $data.question.onCommentInput(e); } }, 
         value: $data.question.comment, 
         visible: $data.visible,
         disable: $data.question.isInputReadOnly,
@@ -16,7 +16,7 @@
 <script type="text/html" id="survey-other">
   <!--ko if: !question.isReadOnlyRenderDiv() -->
 <textarea data-bind="attr: { id: question.otherId, maxLength: question.getOthersMaxLength(), 'aria-required': question.ariaRequired || question.a11y_input_ariaRequired, 'aria-label': question.ariaLabel || question.a11y_input_ariaLabel, placeholder: question.otherPlaceholder }, 
-        event: { input: function(s, e) { $data.question.onOtherValueInput(s, e); } }, 
+        event: { input: function(s, e) { $data.question.onOtherValueInput(e); } }, 
         value: $data.question.otherValue, 
         visible: $data.visible,
         disable: $data.question.isInputReadOnly,
diff --git a/src/react/reactquestion_comment.tsx b/src/react/reactquestion_comment.tsx
index b493b918cd..ebd5cc7516 100644
--- a/src/react/reactquestion_comment.tsx
+++ b/src/react/reactquestion_comment.tsx
@@ -9,8 +9,8 @@ export class SurveyQuestionComment extends SurveyQuestionUncontrolledElement<Que
     super(props);
   }
   protected renderElement(): JSX.Element {
-    var onBlur: ((e: any) => void) | undefined = !this.question.isInputTextUpdate ? this.updateValueOnEvent : undefined;
-    var onInput = (event: any) => {
+    const onBlur: ((e: any) => void) | undefined = !this.question.isInputTextUpdate ? this.updateValueOnEvent : undefined;
+    const onInput = (event: any) => {
       if (this.question.isInputTextUpdate) {
         this.updateValueOnEvent(event);
       } else {
@@ -54,18 +54,33 @@ export class SurveyQuestionComment extends SurveyQuestionUncontrolledElement<Que
 }
 
 export class SurveyQuestionCommentItem extends ReactSurveyElement {
-  private getStateComment() {
-    const comment = this.getComment();
-    let stateComment: string = this.state.comment;
-    if (stateComment !== undefined && stateComment.trim() !== comment) {
-      stateComment = comment;
-    }
-    return stateComment !== undefined ? stateComment : comment || "";
-  }
+  private control: HTMLElement;
   constructor(props: any) {
     super(props);
     this.state = { comment: this.getComment() || "" };
   }
+  componentDidUpdate(prevProps: any, prevState: any): void {
+    super.componentDidUpdate(prevProps, prevState);
+    this.updateDomElement();
+  }
+  componentDidMount(): void {
+    super.componentDidMount();
+    this.updateDomElement();
+  }
+  protected updateDomElement(): void {
+    if (!!this.control) {
+      const control: any = this.control;
+      const newValue = this.getComment() || "";
+      if (!Helpers.isTwoValueEquals(newValue, control.value, false, true, false)) {
+        control.value = newValue;
+      }
+    }
+  }
+  protected setControl(element: HTMLElement | null): void {
+    if(!!element) {
+      this.control = element;
+    }
+  }
   protected canRender(): boolean {
     return !!this.props.question;
   }
@@ -88,30 +103,21 @@ export class SurveyQuestionCommentItem extends ReactSurveyElement {
     return this.props.question.renderedCommentPlaceholder;
   }
   protected renderElement(): JSX.Element {
-    let question = this.props.question;
+    const question = this.props.question;
     let className = this.props.otherCss || this.cssClasses.comment;
-    let handleOnChange = (event: any) => {
-      this.setState({ comment: event.target.value });
-      // https://github.com/surveyjs/survey-library/issues/7252
-      if (!Helpers.isTwoValueEquals(this.getComment(), event.target.value, false, true, false)) {
-        this.setComment(event.target.value);
-      }
-    };
-    let comment = this.getStateComment();
-
     if (question.isReadOnlyRenderDiv()) {
+      const comment = this.getComment() || "";
       return <div>{comment}</div>;
     }
     return (
       <textarea
         id={this.getId()}
         className={className}
-        value={comment}
+        ref={(textarea) => (this.setControl(textarea))}
         disabled={this.isDisplayMode}
         maxLength={question.getOthersMaxLength()}
         placeholder={this.getPlaceholder()}
-        onChange={handleOnChange}
-        onBlur={(e) => { this.onCommentChange(e); handleOnChange(e); }}
+        onBlur={(e) => { this.onCommentChange(e); }}
         onInput={(e) => this.onCommentInput(e)}
         aria-required={question.isRequired || question.a11y_input_ariaRequired}
         aria-label={question.ariaLabel || question.a11y_input_ariaLabel}
diff --git a/testCafe/questions/radiogroup.js b/testCafe/questions/radiogroup.js
index ee41c7fa9c..0b63b72bc9 100644
--- a/testCafe/questions/radiogroup.js
+++ b/testCafe/questions/radiogroup.js
@@ -355,4 +355,169 @@ frameworks.forEach(framework => {
     await t
       .expect(Selector(".sv-string-viewer").withText("None").count).eql(1);
   });
+  test("otherItem type in comment, textUpdateMode=onBlur", async t => {
+    const setOnValueChanged = ClientFunction(() => {
+      window["survey"].onValueChanged.add((sender, options) => {
+        if(options.name === "q2") return;
+        const val = sender.getValue("q2");
+        sender.setValue("q2", val + 1);
+      });
+    });
+    const currentJson = {
+      elements: [
+        {
+          type: "radiogroup",
+          showOtherItem: true,
+          name: "q1",
+          choices: [
+            "item1",
+            "item2",
+            "item3"
+          ]
+        },
+        { type: "text", name: "q2", defaultValue: 0, inputType: "number" }
+      ]
+    };
+    await initSurvey(framework, currentJson);
+    await setOnValueChanged();
+
+    await t.click("input[value=other]")
+      .click(Selector("textarea"))
+      .pressKey("A B C D E F tab")
+      .click("input[value=Complete]");
+
+    const surveyResult = await getSurveyResult();
+    assert.deepEqual(surveyResult, { q1: "other", "q1-Comment": "ABCDEF", q2: 2 });
+  });
+  test("otherItem type in comment, textUpdateMode=onTyping", async t => {
+    const setOnValueChanged = ClientFunction(() => {
+      window["survey"].onValueChanged.add((sender, options) => {
+        if(options.name === "q2") return;
+        const val = sender.getValue("q2");
+        sender.setValue("q2", val + 1);
+      });
+    });
+    const currentJson = {
+      textUpdateMode: "onTyping",
+      elements: [
+        {
+          type: "radiogroup",
+          showOtherItem: true,
+          name: "q1",
+          choices: [
+            "item1",
+            "item2",
+            "item3"
+          ]
+        },
+        { type: "text", name: "q2", defaultValue: 0, inputType: "number" }
+      ]
+    };
+    await initSurvey(framework, currentJson);
+    await setOnValueChanged();
+
+    await t.click("input[value=other]")
+      .click(Selector("textarea"))
+      .pressKey("A B C D E F tab")
+      .click("input[value=Complete]");
+
+    const surveyResult = await getSurveyResult();
+    assert.deepEqual(surveyResult, { q1: "other", "q1-Comment": "ABCDEF", q2: 7 });
+  });
+  test("Type in comment, textUpdateMode=onBlur", async t => {
+    const setOnValueChanged = ClientFunction(() => {
+      window["survey"].onValueChanged.add((sender, options) => {
+        if(options.name === "q2") return;
+        const val = sender.getValue("q2");
+        sender.setValue("q2", val + 1);
+      });
+    });
+    const currentJson = {
+      elements: [
+        {
+          type: "radiogroup",
+          showCommentArea: true,
+          name: "q1",
+          choices: [
+            "item1",
+            "item2",
+            "item3"
+          ]
+        },
+        { type: "text", name: "q2", defaultValue: 0, inputType: "number" }
+      ]
+    };
+    await initSurvey(framework, currentJson);
+    await setOnValueChanged();
+
+    await t.click(Selector("textarea"))
+      .pressKey("A B C D E F tab")
+      .click("input[value=Complete]");
+
+    const surveyResult = await getSurveyResult();
+    assert.deepEqual(surveyResult, { "q1-Comment": "ABCDEF", q2: 1 });
+  });
+  test("Type in comment, textUpdateMode=onTyping", async t => {
+    const setOnValueChanged = ClientFunction(() => {
+      window["survey"].onValueChanged.add((sender, options) => {
+        if(options.name === "q2") return;
+        const val = sender.getValue("q2");
+        sender.setValue("q2", val + 1);
+      });
+    });
+    const currentJson = {
+      textUpdateMode: "onTyping",
+      elements: [
+        {
+          type: "radiogroup",
+          showCommentArea: true,
+          name: "q1",
+          choices: [
+            "item1",
+            "item2",
+            "item3"
+          ]
+        },
+        { type: "text", name: "q2", defaultValue: 0, inputType: "number" }
+      ]
+    };
+    await initSurvey(framework, currentJson);
+    await setOnValueChanged();
+
+    await t.click(Selector("textarea"))
+      .pressKey("A B C D E F tab")
+      .click("input[value=Complete]");
+
+    const surveyResult = await getSurveyResult();
+    assert.deepEqual(surveyResult, { "q1-Comment": "ABCDEF", q2: 6 });
+  });
+  test("Initial value in question comment", async t => {
+    const setCommentValue = ClientFunction(() => {
+      window["survey"].setComment("q1", "ABC");
+    });
+    const currentJson = {
+      elements: [
+        {
+          type: "radiogroup",
+          showCommentArea: true,
+          name: "q1",
+          choices: [
+            "item1",
+            "item2",
+            "item3"
+          ]
+        }
+      ]
+    };
+    await initSurvey(framework, currentJson);
+    await setCommentValue();
+
+    await t.click("input[value=item2]")
+      .click(Selector("textarea"))
+      .pressKey("end D E F")
+      .click("input[value=Complete]");
+
+    const surveyResult = await getSurveyResult();
+    assert.deepEqual(surveyResult, { q1: "item2", "q1-Comment": "ABCDEF" });
+  });
 });
\ No newline at end of file