#6799 Change design for questions in one row - different sizes

Fixes #6799
surveyjs · Aug 31, 2023 · 2e77759 · 2e77759
1 parent 632c25c
commit 2e77759
Show file tree

Hide file tree

Showing 3 changed files with 61 additions and 0 deletions.
diff --git a/src/defaultV2-theme/blocks/sd-row.scss b/src/defaultV2-theme/blocks/sd-row.scss
@@ -66,10 +66,12 @@
 .sd-row__panel {
   box-sizing: border-box;
   width: 100%;
+  height: 100%
 }
 
 .sd-row__question {
   box-sizing: border-box;
   width: 100%;
   white-space: nowrap;
+  height: 100%
 }
diff --git a/visualRegressionTests/tests/defaultV2/etalons/multiple-row-heights.png b/visualRegressionTests/tests/defaultV2/etalons/multiple-row-heights.png
diff --git a/visualRegressionTests/tests/defaultV2/question.ts b/visualRegressionTests/tests/defaultV2/question.ts
@@ -234,6 +234,65 @@ frameworks.forEach(framework => {
     });
   });
 
+  test("Check questions in one row with different default heights", async (t) => {
+    await wrapVisualTest(t, async (t, comparer) => {
+
+      await t.resizeWindow(1920, 1080);
+      await initSurvey(framework, {
+        "pages": [
+          {
+            "name": "page1",
+            "elements": [
+              {
+                "type": "text",
+                "name": "question3"
+              },
+              {
+                "type": "checkbox",
+                "name": "question4",
+                "startWithNewLine": false,
+                "choices": [
+                  "Item 1",
+                  "Item 2",
+                  "Item 3"
+                ]
+              },
+              {
+                "type": "panel",
+                "name": "panel1",
+                "elements": [
+                  {
+                    "type": "text",
+                    "name": "question2"
+                  }
+                ],
+                "title": "Panel"
+              },
+              {
+                "type": "checkbox",
+                "name": "question1",
+                "startWithNewLine": false,
+                "choices": [
+                  "Item 1",
+                  "Item 2",
+                  "Item 3",
+                  "Item 4",
+                  "Item 5",
+                  "Item 6"
+                ]
+              }
+            ]
+          }
+        ],
+        "widthMode": "static",
+        "width": "1000px"
+      },);
+      const rowSelector = Selector(".sd-page");
+      await resetFocusToBody();
+      await takeElementScreenshot("multiple-row-heights.png", rowSelector, t, comparer);
+    });
+  });
+
   test("Check questions in one row (overflow content)", async (t) => {
     await wrapVisualTest(t, async (t, comparer) => {