#6641 Matrix. Vertical view issues. (#6680)

Fixes #6641
surveyjs · Aug 9, 2023 · 6ab1bf2 · 6ab1bf2
1 parent 284b546
commit 6ab1bf2
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 3 deletions.
diff --git a/src/question_matrixdropdownrendered.ts b/src/question_matrixdropdownrendered.ts
@@ -414,13 +414,14 @@ export class QuestionMatrixDropdownRenderedTable extends Base {
       var rows = this.matrix.visibleRows;
       for (var i = 0; i < rows.length; i++) {
         const cell = this.createTextCell(rows[i].locText);
+        this.setHeaderCellCssClasses(cell);
         cell.row = rows[i];
         this.headerRow.cells.push(cell);
       }
       if (this.matrix.hasFooter) {
-        this.headerRow.cells.push(
-          this.createTextCell(this.matrix.getFooterText())
-        );
+        const cell = this.createTextCell(this.matrix.getFooterText());
+        this.setHeaderCellCssClasses(cell);
+        this.headerRow.cells.push(cell);
       }
     }
     if (this.hasActionCellInRows("end")) {

diff --git a/tests/question_matrixdropdownbasetests.ts b/tests/question_matrixdropdownbasetests.ts
@@ -192,6 +192,43 @@ QUnit.test("column cell css classes by column cellType test", function (assert)
   assert.equal(matrix.renderedTable.headerRow.cells[5].className, "sv_matrix_cell_header sv_matrix_cell--dropdown", "column 5");
 
 });
+
+QUnit.test("column cell css classes for vertical layout", function (assert) {
+  var survey = new SurveyModel({
+    "elements": [
+      {
+        "type": "matrixdropdown",
+        "name": "question1",
+        "columns": [
+          {
+            "name": "Column 1"
+          },
+          {
+            "name": "Column 2"
+          }
+        ],
+        "columnLayout": "vertical",
+        "choices": [
+          1,
+          2,
+          3,
+          4,
+          5
+        ],
+        "rows": [
+          "Row 1",
+          "Row 2"
+        ]
+      }
+    ]
+  });
+
+  const matrix = <QuestionMatrixDropdownModelBase>survey.getQuestionByName("question1");
+  assert.equal(matrix.renderedTable.headerRow.cells.length, 3);
+  assert.equal(matrix.renderedTable.headerRow.cells[1].className, "sv_matrix_cell_header", "column 1");
+  assert.equal(matrix.renderedTable.headerRow.cells[2].className, "sv_matrix_cell_header", "column 2");
+});
+
 QUnit.test("column cell css classes by matrix cellType test", function (assert) {
   var survey = new SurveyModel({
     "elements": [