Fix the bug with panel visibility: surveyjs#656

src/panel.ts

@@ -36,13 +36,16 @@ export class QuestionRowModel {
         var visCount = this.getVisibleCount();
         if (visCount == 0) return;
         var counter = 0;
-        for (var i = 0; i < this.elements.length; i++)
+        for (var i = 0; i < this.elements.length; i++) {
             if (this.elements[i].isVisible) {
                 var q = this.elements[i];
                 q.renderWidth = q.width ? q.width : Math.floor(100 / visCount) + '%';
                 q.rightIndent = counter < visCount - 1 ? 1 : 0;
                 counter++;
+            } else {
+                this.elements[i].renderWidth = "";
             }
+        }
     }
     private getVisibleCount(): number {
         var res = 0;

tests/elementslayouttests.ts

@@ -0,0 +1,36 @@
+import {SurveyModel} from "../src/survey";
+import {PageModel} from "../src/page";
+import {PanelModel, QuestionRowModel} from "../src/panel";
+import {QuestionFactory} from "../src/questionfactory";
+import {Question} from "../src/question";
+import {QuestionTextModel} from "../src/question_text";
+import {JsonObject, JsonUnknownPropertyError} from "../src/jsonobject";
+
+export default QUnit.module("ElementsLayout");
+
+QUnit.test("Simple layout test", function (assert) {
+    var page = new PageModel();
+    page.addNewQuestion("text", "q1");
+    page.addNewQuestion("text", "q2");
+    assert.equal(page.rows.length, 2, "There are two rows");
+    assert.equal(page.questions[0].renderWidth, "100%", "The render width is 100%");
+    page.questions[1].startWithNewLine = false;
+    assert.equal(page.rows.length, 1, "There is one row");
+    assert.equal(page.questions[0].renderWidth, "50%", "The render width is 50%");
+});
+QUnit.test("Two panels test", function (assert) {
+    var page = new PageModel();
+    var panel1 = page.addNewPanel("p1");
+    var panel2 = page.addNewPanel("p2");
+    panel2.startWithNewLine = false;
+    panel1.addNewQuestion("text", "p1_q1");
+    panel2.addNewQuestion("text", "p1_q2");
+    assert.equal(page.rows.length, 1, "There is one row");
+    assert.equal(page.elements[0].renderWidth, "50%", "1. The render width is 50%");
+    panel2.elements[0].visible = false;
+    assert.equal(page.elements[0].renderWidth, "100%", "2. The panel1 render width is 100%");
+    assert.equal(page.elements[1].renderWidth, "", "2. The panel2 render width is empty");
+    panel2.elements[0].visible = true;
+    assert.equal(page.elements[0].renderWidth, "50%", "3. The panel1 render width is 50% again");
+    assert.equal(page.elements[1].renderWidth, "50%", "3. The panel2 The render width is 50% again");
+});

tests/entries/test.ts

@@ -13,6 +13,7 @@ export * from '../surveytriggertests';
 export * from '../surveyvalidatortests';
 export * from '../textPreprocessorTests';
 export * from '../lowercasetests';
+export * from '../elementslayouttests';
 
 // localization
 import '../../src/localization/russian';