Adorners switch to compact mode inconsistently (#8771)

* Adorners switch to compact mode inconsistently fixed surveyjs/survey-creator#5683 * fix illegal invocation surveyjs/survey-creator#5683 --------- Co-authored-by: Aleksey Novikov <[email protected]>
surveyjs · Sep 4, 2024 · d498385 · d498385
1 parent 66759ac
commit d498385
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 21 deletions.
diff --git a/packages/survey-core/src/utils/responsivity-manager.ts b/packages/survey-core/src/utils/responsivity-manager.ts
@@ -27,11 +27,12 @@ export class ResponsivityManager {
     private model: AdaptiveActionContainer,
     private itemsSelector: string,
     private dotsItemSize: number = null,
-    private delayedUpdateFunction?: (callback: () => void) => void
+    private delayedUpdateFunction: (callback: () => void) => void = (callback: () => void) => { if (queueMicrotask) queueMicrotask(callback); else callback(); }
   ) {
     this.model.updateCallback = (isResetInitialized: boolean) => {
-      if (isResetInitialized)
+      if (isResetInitialized) {
         this.isInitialized = false;
+      }
       setTimeout(() => { this.process(); }, 1);
     };
     if (typeof ResizeObserver !== "undefined") {
@@ -75,16 +76,6 @@ export class ResponsivityManager {
       : currentAction.maxDimension;
   }
 
-  private getRenderedVisibleActionsCount() {
-    let count = 0;
-    this.container.querySelectorAll(this.itemsSelector).forEach(item => {
-      if(this.calcItemSize(item as HTMLDivElement) > 0) {
-        count++;
-      }
-    });
-    return count;
-  }
-
   private calcItemsSizes() {
     if(this.isInitialized) return;
     const actions = this.model.actions;
@@ -121,14 +112,8 @@ export class ResponsivityManager {
           this.isInitialized = true;
           processResponsiveness();
         };
-        if(this.getRenderedVisibleActionsCount() < this.model.visibleActions.length) {
-          if(this.delayedUpdateFunction) {
-            this.delayedUpdateFunction(callback);
-          } else if(queueMicrotask) {
-            queueMicrotask(callback);
-          } else {
-            callback();
-          }
+        if (this.delayedUpdateFunction) {
+          this.delayedUpdateFunction(callback);
         } else {
           callback();
         }

diff --git a/packages/survey-core/tests/responsivityTests.ts b/packages/survey-core/tests/responsivityTests.ts
@@ -313,7 +313,6 @@ QUnit.test("ResponsivityManager process test", function (assert) {
   (<any>manager.getComputedStyle) = () => {
     return { boxSizing: "content-box", paddingLeft: 5, paddingRight: 5 };
   };
-  manager["getRenderedVisibleActionsCount"] = () => model.actions.length;
   manager["calcItemsSizes"] = () => {
     model.actions.forEach(action => {
       action.minDimension = 20;

diff --git a/testCafe/survey/titleActions.js b/testCafe/survey/titleActions.js
@@ -330,6 +330,51 @@ frameworks.forEach((framework) => {
       .expect(myAction.visible).ok()
       .expect(dotsItem.visible).notOk();
   });
+
+  test("check adaptivity with title changes", async (t) => {
+    const json = {
+      questions: [
+        {
+          name: "name",
+          type: "text",
+          placeHolder: "Jon Snow",
+          isRequired: true
+        }
+      ]
+    };
+    await initSurvey(framework, json, {
+      onGetQuestionTitleActions: (_, opt) => {
+        opt.titleActions = [
+          {
+            title: "Act1 long title for adaptivity testing",
+            iconName: "excellent",
+            action: () => { },
+          },
+          {
+            title: "Act2 long title for adaptivity testing",
+            iconName: "good",
+            action: () => { },
+          },
+        ];
+      },
+    });
+    const myAction = Selector(".sv-action").nth(0);
+    const myAction2 = Selector(".sv-action").nth(1);
+    const dotsItem = Selector(".sv-action.sv-dots");
+
+    await t
+      .resizeWindow(600, 600)
+      .expect(myAction.find(".sv-action-bar-item__title").exists).ok()
+      .expect(myAction2.find(".sv-action-bar-item__title").exists).notOk()
+      .expect(dotsItem.visible).notOk();
+
+    await ClientFunction(() => {
+      window["survey"].getQuestionByName("name").getTitleToolbar().actions[0].title = "Act1.1 long title for adaptivity testing";
+    })();
+    await t
+      .expect(myAction.find(".sv-action-bar-item__title").exists).ok()
+      .expect(myAction2.find(".sv-action-bar-item__title").exists).notOk();
+  });
 });
 
 const themeName = "defaultV2";