Add onSetQuestionValue callback function into component fix #8048 (#8049

)

src/question_custom.ts

@@ -251,6 +251,7 @@ export interface ICustomQuestionTypeConfiguration {
    * @returns An error text.
    */
   getErrorText?: (question: Question) => string;
+  onSetQuestionValue?: (question: Question, newValue: any) => void;
   valueToQuestion?: (val: any) => any;
   valueFromQuestion?: (val: any) => any;
   getValue?: (val: any) => any;
@@ -302,6 +303,10 @@ export class ComponentQuestionJSON {
     if (!this.json.onUpdateQuestionCssClasses) return;
     this.json.onUpdateQuestionCssClasses(question, element, css);
   }
+  public onSetQuestionValue(question: Question, newValue: any): void {
+    if (!this.json.onSetQuestionValue) return;
+    this.json.onSetQuestionValue(question, newValue);
+  }
   public onPropertyChanged(
     question: Question,
     propertyName: string,
@@ -606,6 +611,9 @@ export abstract class QuestionCustomModelBase extends Question
   protected setQuestionValue(newValue: any, updateIsAnswered: boolean = true) {
     super.setQuestionValue(newValue, updateIsAnswered);
     this.updateElementCss();
+    if (!!this.customQuestion) {
+      this.customQuestion.onSetQuestionValue(this, newValue);
+    }
   }
   protected setNewValue(newValue: any) {
     super.setNewValue(newValue);

tests/question_customtests.ts

@@ -3108,4 +3108,33 @@ QUnit.test("Composite: validate", function (assert) {
   assert.equal(q1.errors.length, 0, "q1 errors #3");
   assert.equal(q2.errors.length, 0, "q2 errors #3");
   ComponentCollection.Instance.clear();
+});
+QUnit.test("Composite: update questions on a value change", function (assert) {
+  ComponentCollection.Instance.add({
+    name: "test",
+    elementsJSON: [
+      { type: "text", name: "q1" },
+      { type: "dropdown", name: "q2" },
+      { type: "text", name: "q3" }
+    ],
+    onSetQuestionValue: (question, newValue: any): void => {
+      if(!!newValue && !!newValue.q3) {
+        question.contentPanel.getQuestionByName("q2").choices = [newValue.q3];
+      }
+    }
+  });
+  const survey = new SurveyModel({
+    elements: [
+      { type: "test", name: "q1" },
+    ]
+  });
+  const q1 = <QuestionCompositeModel>survey.getQuestionByName("q1");
+  const internalQ2 = q1.contentPanel.getQuestionByName("q2");
+  survey.data = { q1: { q1: 1, q3: 2 } };
+  assert.equal(internalQ2.choices.length, 1, "choices.length #1");
+  assert.equal(internalQ2.choices[0].value, 2, "choices[0].value #1");
+  q1.value = { q1: 1, q3: 3 };
+  assert.equal(internalQ2.choices.length, 1, "choices.length #2");
+  assert.equal(internalQ2.choices[0].value, 3, "choices[0].value #2");
+  ComponentCollection.Instance.clear();
 });