Work for surveyjs/survey-creator#4484 - added dispose tests

src/actions/action.ts

@@ -164,7 +164,7 @@ export function createDropdownActionModelAdvanced(actionOptions: IAction, listOp
     listOptions.items,
     (item: Action) => {
       listOptions.onSelectionChanged(item),
-      innerPopupModel.toggleVisibility();
+        innerPopupModel.toggleVisibility();
     },
     listOptions.allowSelection,
     listOptions.selectedItem,
@@ -179,7 +179,7 @@ export function createDropdownActionModelAdvanced(actionOptions: IAction, listOp
   const newActionOptions = Object.assign({}, actionOptions, {
     component: "sv-action-bar-item-dropdown",
     popupModel: innerPopupModel,
-    action: (action:IAction, isUserAction: boolean) => {
+    action: (action: IAction, isUserAction: boolean) => {
       !!(actionOptions.action) && actionOptions.action();
       innerPopupModel.isFocusedContent = !isUserAction || listModel.showFilter;
       innerPopupModel.toggleVisibility();
@@ -305,7 +305,7 @@ export abstract class BaseAction extends Base implements IAction {
     return this.tooltip || this.title;
   }
   public getIsTrusted(args: any): boolean {
-    if(!!args.originalEvent) {
+    if (!!args.originalEvent) {
       return args.originalEvent.isTrusted;
     }
     return args.isTrusted;
@@ -448,7 +448,8 @@ export class Action extends BaseAction implements IAction, ILocalizableOwner {
     return this._component;
   }
   public dispose(): void {
-    if(this.popupModel) {
+    super.dispose();
+    if (this.popupModel) {
       this.popupModel.dispose();
     }
     this.action = undefined;

tests/basetests.ts

@@ -665,6 +665,45 @@ QUnit.test("Update via function - nested dependencies", function (assert) {
   assert.equal(updaterCallCount1, 2, "update called - responsive");
   assert.equal(base1.propS, "responsive");
 });
+QUnit.test("Unsubscribe dependencies on dispose", function (assert) {
+  const base1 = new BaseTester1();
+  const base2 = new BaseTester2();
+  const base3 = new BaseTester3();
+  let updaterCallCount = 0;
+  const updater = new ComputedUpdater<number>(() => {
+    updaterCallCount++;
+    return base1.propA + base2.propB;
+  });
+  base3.propC = <any>updater;
+
+  assert.equal(Object.keys(base3.dependencies).length, 1, "one computed");
+  assert.equal(Object.keys(base3.dependencies)[0], "propC", "propC");
+  assert.equal(base3.dependencies["propC"]["getDependencies"]().dependencies.length, 2, "depends on two properties");
+
+  assert.equal(base1["onPropChangeFunctions"].length, 1, "base1 one subscription");
+  assert.equal(base1["onPropChangeFunctions"][0].name, "propA", "base1 one subscription to A");
+  assert.equal(base2["onPropChangeFunctions"].length, 1, "base2 one subscription");
+  assert.equal(base2["onPropChangeFunctions"][0].name, "propB", "base2 one subscription to B");
+
+  assert.equal(updaterCallCount, 1, "first time calculation");
+  assert.equal(base3.propC, 3, "1 + 2");
+  base1.propA = 2;
+  assert.equal(updaterCallCount, 2, "propA changed");
+  assert.equal(base3.propC, 4, "2 + 2");
+
+  base3.dispose();
+
+  assert.equal(Object.keys(base3.dependencies).length, 1, "one computed");
+  assert.equal(base3.dependencies["propC"]["getDependencies"](), undefined, "no dependencies");
+
+  assert.equal(base1["onPropChangeFunctions"].length, 0, "base1 no subscriptions");
+  assert.equal(base2["onPropChangeFunctions"].length, 0, "base2 no subscriptions");
+
+  base1.propA = 3;
+  assert.equal(updaterCallCount, 2, "updater doesn't react on changes");
+  assert.equal(base3.propC, 4, "no value updates");
+});
+
 QUnit.test("findParentByClassNames function", function (assert) {
   const parentElement = document.createElement("div");
   parentElement.classList.add("class1");

tests/components/actionbartests.ts

@@ -97,7 +97,8 @@ QUnit.test("Check hideItemsGreaterN with minVisibleItemsCount", (assert) => {
 QUnit.test("Check dropdown action pressed state", (assert) => {
   const p1 = new PopupModel("", "");
   const p2 = new PopupModel("", "");
-  const action: Action = new Action({ id: "first",
+  const action: Action = new Action({
+    id: "first",
     component: "sv-action-bar-item-dropdown",
     popupModel: p1
   },);
@@ -173,7 +174,7 @@ QUnit.test("Action title in list model", (assert) => {
     locTitleName: "selectAllItemText",
     locTooltipName: "previewText"
   });
-  const list = new ListModel([action1], () => {}, true);
+  const list = new ListModel([action1], () => { }, true);
   const popupModel = new PopupModel("sv-list", list, "bottom", "center");
   survey.addNavigationItem({ id: "action1", title: "test", popupModel: popupModel });
   assert.equal(action1.locTitle.text, "Select All", "take text from en localization");
@@ -202,4 +203,29 @@ QUnit.test(
     action.ariaExpanded = true;
     assert.ok(action.ariaExpanded, "property exists");
   }
-);
+);
+QUnit.test("Dispose dots item and all it content", (assert) => {
+  const model: AdaptiveActionContainer = new AdaptiveActionContainer();
+  model.setItems([
+    { id: "first", },
+    { id: "second" },
+  ]);
+  model["hideItemsGreaterN"](0);
+  assert.equal(model.actions[0].mode, "popup");
+  assert.equal(model.actions[1].mode, "popup");
+  assert.notEqual(model.dotsItem.popupModel, undefined, "popup model exists");
+  assert.equal(model.dotsItem.popupModel.isDisposed, false, "popup model is not disposed");
+  assert.notEqual(model.dotsItem.data, undefined, "list model exists");
+  assert.equal(model.dotsItem.data.isDisposed, false, "list model is not disposed");
+
+  const action1 = model.actions[0];
+  const action2 = model.actions[1];
+
+  model.dispose();
+  assert.equal(model.actions.length, 0, "actions are removed");
+  assert.equal(action1.isDisposed, true, "action 1 is disposed");
+  assert.equal(action2.isDisposed, true, "action 2 is disposed");
+  assert.equal(model.dotsItem.isDisposed, true, "dotsItem is disposed");
+  assert.equal(model.dotsItem.popupModel.isDisposed, true, "popup model is disposed");
+  assert.equal(model.dotsItem.data.isDisposed, true, "list model is disposed");
+});