Work for surveyjs/survey-creator#3390: additional fixies for f tests …

…in creator
surveyjs · Sep 26, 2022 · 464615a · 464615a
1 parent 2659f84
commit 464615a
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 10 deletions.
diff --git a/packages/survey-angular-ui/src/element.component.html b/packages/survey-angular-ui/src/element.component.html
@@ -1,5 +1,5 @@
 <ng-template #template>
-    <div [class]="model.cssClasses.questionWrapper" [style]="model.rootStyle">
+    <div [class]="model.cssClasses.questionWrapper" [style]="model.rootStyle" (focusin)="model.focusIn()">
         <ng-template [component]="{ name: componentName, data: componentData }"></ng-template>
     </div>
 </ng-template>
diff --git a/packages/survey-angular-ui/src/page.component.ts b/packages/survey-angular-ui/src/page.component.ts
@@ -6,16 +6,16 @@ import { BaseAngular } from "./base-angular";
   templateUrl: "./page.component.html",
   styleUrls: ["./page.component.scss"]
 })
-export class PageComponent extends BaseAngular<PageModel> implements AfterViewInit, OnChanges {
+export class PageComponent extends BaseAngular<PageModel> {
   @Input() model!: PageModel;
   @Input() survey?: SurveyModel;
   @ViewChild("pageContainer", { static: false, read: ElementRef }) pageContainerRef!: ElementRef<HTMLDivElement>;
   protected getModel(): PageModel {
     return this.model;
   }
-  ngOnChanges(changes: SimpleChanges): void {
-    if(changes["model"].previousValue !== undefined) {
-      this.model.survey.afterRenderPage(this.pageContainerRef?.nativeElement);
+  protected override onModelChanged(): void {
+    if(!!this.pageContainerRef && this.pageContainerRef.nativeElement) {
+      this.model.survey.afterRenderPage(this.pageContainerRef.nativeElement);
     }
   }
   ngAfterViewInit(): void {

diff --git a/packages/survey-angular-ui/src/questions/image.component.ts b/packages/survey-angular-ui/src/questions/image.component.ts
@@ -7,6 +7,17 @@ import { AngularComponentFactory } from "../component-factory";
   selector: "sv-ng-image-question",
   templateUrl: "./image.component.html"
 })
-export class ImageQuestionComponent extends QuestionAngular<QuestionImageModel> {}
+export class ImageQuestionComponent extends QuestionAngular<QuestionImageModel> {
+  override ngAfterViewInit(): void {
+    this.model.locImageLink.onChanged = () => {
+      this.detectChanges();
+    };
+    super.ngAfterViewInit();
+  }
+  override ngOnDestroy(): void {
+    this.model.locImageLink.onChanged = () => {};
+    super.ngOnDestroy();
+  }
+}
 
 AngularComponentFactory.Instance.registerComponent("image-question", ImageQuestionComponent);
diff --git a/packages/survey-angular-ui/src/questions/matrixcell.component.html b/packages/survey-angular-ui/src/questions/matrixcell.component.html
@@ -2,7 +2,9 @@
   <td [class]="cell.className" [attr.data-responsive-title]="getHeaders()" [title]="cell.getTitle()" [style]="getCellStyle()" [attr.colspan]="cell.colSpans" #cellContainer>
     <sv-ng-matrix-drag-drop-icon *ngIf="cell.isDragHandlerCell" [model]="$any({ data: { row: row, question: question } })"></sv-ng-matrix-drag-drop-icon>
     <sv-action-bar *ngIf="cell.isActionsCell" [model]="cell.item.getData()" [handleClick]="false"></sv-action-bar>
-    <sv-ng-panel *ngIf="cell.hasPanel" [model]="cell.panel"></sv-ng-panel>
+    <ng-container *ngIf="cell.hasPanel">
+      <ng-template [component]="{ name: panelComponentName, data: panelComponentData }"></ng-template>
+    </ng-container>
     <div *ngIf="cell.hasQuestion" [class]="question.cssClasses.cellQuestionWrapper" [visible]="cell.question.isVisible">
       <div *ngIf="cell.showErrorOnTop && cell.question.hasVisibleErrors" [element]="cell.question" [location]="'top'" sv-ng-errors></div>
       <ng-container *ngIf="!cell.isChoice && cell.question.isDefaultRendering()">
@@ -23,7 +25,11 @@
       <div *ngIf="cell.showErrorOnBottom && cell.question.hasVisibleErrors" [element]="cell.question" [location]="'top'" sv-ng-errors></div>
       <div *ngIf="cell.question.isErrorsModeTooltip && cell.question.hasVisibleErrors" [element]="cell.question" [location]="'tooltip'" sv-ng-errors></div>
     </div>
-    <sv-ng-string *ngIf="cell.hasTitle" [model]="cell.locTitle"></sv-ng-string>
-    <span *ngIf="!!cell.requiredText" [class]="question.cssClasses.cellRequiredText">{{ cell.requiredText }}</span>
+    <ng-container *ngIf="cell.hasTitle">
+      <ng-template [component]="{ name: question.getCellWrapperComponentName($any(cell)), data: { componentData: question.getCellWrapperComponentData($any(cell))} }">
+        <sv-ng-string [model]="cell.locTitle"></sv-ng-string>
+        <span *ngIf="!!cell.requiredText" [class]="question.cssClasses.cellRequiredText">{{ cell.requiredText }}</span>  
+      </ng-template>
+    </ng-container>
 </td>
 </ng-template>
diff --git a/packages/survey-angular-ui/src/questions/matrixcell.component.ts b/packages/survey-angular-ui/src/questions/matrixcell.component.ts
@@ -3,7 +3,8 @@ import { BaseAngular } from "../base-angular";
 import {
   Question,
   QuestionMatrixDropdownModelBase,
-  QuestionMatrixDropdownRenderedCell
+  QuestionMatrixDropdownRenderedCell,
+  SurveyModel
 } from "survey-core";
 
 @Component({
@@ -25,6 +26,32 @@ export class MatrixCellComponent extends BaseAngular<Question> {
   public get row() {
     return this.cell.row;
   }
+  public get panelComponentName(): string {
+    const panel = this.cell.panel;
+    const survey = <SurveyModel>panel.survey;
+    if(!!survey) {
+      const name = survey.getElementWrapperComponentName(panel);
+      if(!!name) {
+        return name;
+      }
+    }
+    return "panel";
+  }
+  public get panelComponentData(): any {
+    const panel = this.cell.panel;
+    const survey = <SurveyModel>panel.survey;
+    let data: any;
+    if(!!survey) {
+      data = survey.getElementWrapperComponentData(panel);
+    }
+    return {
+      componentName: "panel",
+      componentData: {
+        model: panel,
+        data: data
+      }
+    };
+  }
 
   getComponentName(element: Question) {
     if (element.customWidget) {