Merge pull request #7767 from surveyjs/bug/7755-panel-dynamic-comment…

…-padding Fixed #7755 - Dynamic Panel with the Comment Area - The Other box is rendered incorrectly
surveyjs · Jan 30, 2024 · 7b0ccb8 · 7b0ccb8
2 parents 4845816 + a6adb61
commit 7b0ccb8
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 0 deletions.
diff --git a/src/defaultV2-theme/blocks/sd-paneldynamic.scss b/src/defaultV2-theme/blocks/sd-paneldynamic.scss
@@ -134,6 +134,14 @@
     }
 }
 
+.sd-question--paneldynamic:not(.sd-question--empty) {
+    &>.sd-question__content {
+        &>.sd-question__comment-area {
+            padding-bottom: var(--sd-base-padding);
+        }
+    }
+}
+
 .sd-paneldynamic__buttons-container .sd-action-bar {
     width: 100%;
     margin: 0 calcSize(-3);

diff --git a/visualRegressionTests/tests/defaultV2/etalons/panel-dynamic-comment.png b/visualRegressionTests/tests/defaultV2/etalons/panel-dynamic-comment.png
diff --git a/visualRegressionTests/tests/defaultV2/paneldynamic.ts b/visualRegressionTests/tests/defaultV2/paneldynamic.ts
@@ -458,4 +458,36 @@ frameworks.forEach(framework => {
       await takeElementScreenshot("paneldynamic-focused-tab", Selector(".sd-question--paneldynamic"), t, comparer);
     });
   });
+  test("Comment bottom padding in dynamic panel", async (t) => {
+    await wrapVisualTest(t, async (t, comparer) => {
+      await t.resizeWindow(800, 600);
+      const json = {
+        "pages": [
+          {
+            "name": "page1",
+            "elements": [
+              {
+                "type": "paneldynamic",
+                "name": "question1",
+                "showCommentArea": true,
+                "panelCount": 1,
+                "templateElements": [
+                  {
+                    "type": "text",
+                    "name": "question2"
+                  }
+                ]
+              }
+            ]
+          }
+        ],
+        "showQuestionNumbers": "off"
+      };
+
+      await initSurvey(framework, json);
+      await t.wait(100);
+      await takeElementScreenshot("panel-dynamic-comment.png", ".sd-question--paneldynamic", t, comparer);
+    });
+  });
+
 });