Pages Collection Editor - The Trash Bin (Remove) button is unavailabl… (#6652)

* Pages Collection Editor - The Trash Bin (Remove) button is unavailable when you use the Add Page button fix Bug#6645

* FIx unit tests

Author: andrewtelnov

packages/survey-creator-core/src/creator-settings.ts

@@ -1,7 +1,7 @@
 import {
   StylesManager, Base, IAction, ItemValue,
   JsonObjectProperty, MatrixDropdownColumn, Question,
-  SurveyModel, ILocalizableString, PopupBaseViewModel, SurveyElement
+  SurveyModel, ILocalizableString, PopupBaseViewModel, PageModel
 } from "survey-core";
 
 /**
@@ -333,6 +333,7 @@ export interface ISurveyCreatorOptions {
     context?: { element: Base, item?: any, elementType?: string, propertyName?: string }
   ): void;
   translationLocalesOrder: Array<string>;
+  canAddPage(pageToAdd?: PageModel): boolean;
 }
 
 export class EmptySurveyCreatorOptions implements ISurveyCreatorOptions {
@@ -487,6 +488,7 @@ export class EmptySurveyCreatorOptions implements ISurveyCreatorOptions {
   doMachineTranslation(fromLocale: string, toLocale: string, strings: Array<string>, callback: (translated: Array<string>) => void): void { }
   chooseFiles(input: HTMLInputElement, callback: (files: File[]) => void, context?: { element: Base, item?: any, elementType?: string, propertyName?: string }): void { }
   translationLocalesOrder: Array<string> = [];
+  canAddPage(pageToAdd?: PageModel): boolean { return true; }
 }
 
 StylesManager.applyTheme("defaultV2");

packages/survey-creator-core/src/property-grid/matrices.ts

@@ -1,4 +1,4 @@
-import { Base, ComputedUpdater, IAction, ISurveyData, ItemValue, JsonMetadata, JsonMetadataClass, JsonObjectProperty, MatrixDropdownColumn, MatrixDropdownRowModelBase, MatrixDynamicRowModel, PanelModel, Question, QuestionHtmlModel, QuestionMatrixDropdownModelBase, QuestionMatrixDropdownRenderedRow, QuestionMatrixDynamicModel, QuestionRatingModel, renamedIcons, Serializer, SurveyElement } from "survey-core";
+import { Base, ComputedUpdater, IAction, ISurveyData, ItemValue, JsonMetadata, JsonMetadataClass, JsonObjectProperty, MatrixDropdownColumn, MatrixDropdownRowModelBase, MatrixDynamicRowModel, PanelModel, Question, QuestionHtmlModel, QuestionMatrixDropdownModelBase, QuestionMatrixDropdownRenderedRow, QuestionMatrixDynamicModel, QuestionRatingModel, renamedIcons, Serializer, SurveyElement, SurveyModel } from "survey-core";
 import { editorLocalization } from "../editorLocalization";
 import { SurveyQuestionProperties } from "../question-editor/properties";
 import { ISurveyCreatorOptions, settings } from "../creator-settings";
@@ -12,7 +12,6 @@ import {
 } from "./index";
 import { updateMatixActionsClasses, updateMatrixRemoveAction } from "../utils/actions";
 import { QuestionRatingAdornerViewModel } from "../components/question-rating";
-import { CreatorBase } from "../creator-base";
 import { ISurveyPropertyGridDefinition } from "../question-editor/definition";
 
 Serializer.addProperty("itemvalue",
@@ -669,7 +668,9 @@ export class PropertyGridEditorMatrixPages extends PropertyGridEditorMatrix {
     return prop.type == "surveypages";
   }
   protected addItem(creator: ISurveyCreatorOptions, obj: Base, question: QuestionMatrixDynamicModel) {
-    (creator as CreatorBase).addPage(undefined, false);
+    if(creator.canAddPage()) {
+      super.addItem(creator, obj, question);
+    }
   }
   protected getColumnClassName(obj: Base, prop: JsonObjectProperty): string {
     return "page@" + obj.getType();

packages/survey-creator-core/tests/property-grid/property-grid.tests.ts

@@ -33,7 +33,8 @@ import {
   ComponentCollection,
   QuestionBooleanModel,
   QuestionRadiogroupModel,
-  PageModel
+  PageModel,
+  ActionContainer
 } from "survey-core";
 import {
   EmptySurveyCreatorOptions,
@@ -3108,9 +3109,11 @@ test("Do not select page on adding new page in the property grid #5564", () => {
   expect(creator.survey.pages).toHaveLength(1);
   creator.selectElement(creator.survey);
   const pagesQuestion = <QuestionMatrixDynamicModel>creator.propertyGrid.getQuestionByName("pages");
+  expect(pagesQuestion.visibleRows).toHaveLength(1);
   const actions = pagesQuestion.getTitleActions();
   actions[actions.length - 1].action();
   expect(creator.survey.pages).toHaveLength(2);
+  expect(pagesQuestion.visibleRows).toHaveLength(2);
   expect((<any>creator.selectedElement).pages).toHaveLength(2);
 });
 test("Setup correct categories for dynamic properties in components", () => {
@@ -3665,4 +3668,29 @@ test("Undo for deleting validator in multiple text item, Bug#6295", () => {
   creator.undo();
   expect(item1.validators).toHaveLength(1);
   expect(matrix.visibleRows).toHaveLength(1);
-});
+});
+test("Pages Collection Editor - The Trash Bin (Remove) button is unavailable when you use the Add Page button Bug#6645", () => {
+  const creator = new CreatorTester();
+  const propertyGrid = new PropertyGridModelTester(creator.survey, creator);
+  const pagesQuestion = <QuestionMatrixDynamicModel>propertyGrid.survey.getQuestionByName("pages");
+  expect(pagesQuestion.visibleRows).toHaveLength(0);
+  const action = pagesQuestion.getTitleActions().filter(action => action.id === "add-item")[0];
+  expect(action).toBeTruthy();
+  action.action();
+  action.action();
+  expect(pagesQuestion.visibleRows).toHaveLength(2);
+
+  const rows = pagesQuestion.renderedTable.rows;
+  expect(rows[0].isErrorsRow).toBeFalsy();
+  expect(rows[0].hasEndActions).toBeTruthy();
+  let cell = rows[0].cells[rows[0].cells.length - 1];
+  expect(cell.isActionsCell).toBeTruthy();
+  let container = <ActionContainer>cell.item.value;
+  expect(container.getActionById("remove-row")).toBeTruthy();
+  expect(rows[2].isErrorsRow).toBeFalsy();
+  expect(rows[2].hasEndActions).toBeTruthy();
+  cell = rows[2].cells[rows[2].cells.length - 1];
+  expect(cell.isActionsCell).toBeTruthy();
+  container = <ActionContainer>cell.item.value;
+  expect(container.getActionById("remove-row")).toBeTruthy();
+});