Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

#7243 Dynamic Matrix - No space between the last and total rows #7256

Merged
merged 3 commits into from
Oct 30, 2023
Merged

#7243 Dynamic Matrix - No space between the last and total rows #7256

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
bb85749
#7243 Dynamic Matrix - No space between the last and total rows
novikov82 Oct 30, 2023
6d1697a
#7243 - fixed markup tests
novikov82 Oct 30, 2023
d6d366d
Fixes #7243
novikov82 Oct 30, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 5 additions & 8 deletions src/knockout/templates/question-matrixdynamic.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@
<td
data-bind="css: $data.className, style: { minWidth: $data.minWidth, width: $data.width }, attr: { 'data-responsive-title': headers, title: $data.getTitle(), colspan: $data.colSpans }, event: {focusin: $data.focusIn }"
>
<!-- ko if: $data.matrix -->
<div data-bind="visible: question.isVisible, css: $parentContext.question.cssClasses.cellQuestionWrapper">
<!-- ko if: $data.isOtherChoice -->
<div data-bind="css: question.getCommentAreaCss(true), template: { name: 'survey-other', data: {'question': question, 'visible': true } }"></div>
Expand Down Expand Up @@ -79,6 +80,7 @@
<!-- /ko -->
<!-- /ko -->
</div>
<!-- /ko -->
</td>
</script>
<script type="text/html" id="survey-matrixtable">
Expand Down Expand Up @@ -170,14 +172,9 @@
<tfoot>
<tr>
<!-- ko foreach: question.koTable().footerRow.cells -->
<!-- ko if: $data.hasQuestion -->
<!-- ko template: { name: 'survey-matrixcell', afterRender: function(els) { $data.matrix.koCellAfterRender(els, $data); } } --><!-- /ko -->
<!-- /ko -->
<!-- ko if: $data.hasTitle -->
<td>
<!-- ko template: { name: 'survey-string', data: $data.locTitle } --><!-- /ko -->
</td>
<!-- /ko -->

<!-- ko template: { name: 'survey-matrixcell', afterRender: function(els) { $data.matrix && $data.matrix.koCellAfterRender(els, $data); } } --><!-- /ko -->

<!-- /ko -->
</tr>
</tfoot>
Expand Down
4 changes: 2 additions & 2 deletions src/question_matrixdropdownrendered.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -449,7 +449,7 @@ export class QuestionMatrixDropdownRenderedTable extends Base {
this.footerRow.cells.push(this.createHeaderCell(null));
}
if (this.hasActionCellInRows("start")) {
this.footerRow.cells.push(this.createHeaderCell(null));
this.footerRow.cells.push(this.createHeaderCell(null, "action"));
}
if (this.matrix.hasRowText) {
this.footerRow.cells.push(
Expand All @@ -471,7 +471,7 @@ export class QuestionMatrixDropdownRenderedTable extends Base {
}
}
if (this.hasActionCellInRows("end")) {
this.footerRow.cells.push(this.createHeaderCell(null));
this.footerRow.cells.push(this.createHeaderCell(null, "action"));
}
}
protected buildRows() {
Expand Down
2 changes: 1 addition & 1 deletion src/react/reactquestion_matrixdropdownbase.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -145,7 +145,7 @@ export class SurveyQuestionMatrixDropdownBase extends SurveyQuestionElementBase

return (
<React.Fragment key={key}>
<MatrixRow model={row} parentMatrix={this.question}>{matrixrow}</MatrixRow>
{(reason == "row-footer") ? <tr>{matrixrow}</tr> : <MatrixRow model={row} parentMatrix={this.question}>{matrixrow}</MatrixRow>}
</React.Fragment>
);
}
Expand Down
21 changes: 21 additions & 0 deletions tests/markup/etalon_matrixdynamic.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,27 @@ registerMarkupTests(
before: () => StylesManager.applyTheme("defaultV2"),
after: () => StylesManager.applyTheme("default"),
snapshot: "matrixdynamic-defaultV2"
},
{
name: "Test matrixdynamic question (defaultV2) markup with totals",
json: {
"elements": [
{
"type": "matrixdynamic",
"titleLocation": "hidden",
"name": "question1",
"columns": [
{
"name": "Column 1",
"totalType": "count",
"totalFormat": "Count: {0}",
}
]
}
]
},
removeIds: true,
snapshot: "matrixdynamic-totals"
}
]
);
Expand Down
143 changes: 143 additions & 0 deletions tests/markup/snapshots/matrixdynamic-totals.snap.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,143 @@
<div>
<div>
<table class="sv_q_matrix_dynamic">
<thead>
<tr>
<th class="sv_matrix_cell_header sv_matrix_cell--dropdown">
<span class="sv-string-viewer">Column 1</span>
</th>
<td class="sv_matrix_cell_header sv_matrix_cell--action">
</td>
</tr>
</thead>
<tbody>
<tr class="sv_matrix_row" data-sv-drop-target-matrix-row="testid0row1">
<td class="sv_matrix_cell" colspan="1" data-responsive-title="Column 1" title="Column 1">
<div>
<div>
<div class="sv_select_wrapper">
<div aria-controls="testid0row1cell0i_list" aria-expanded="false" aria-invalid="false" aria-label="Column 1" aria-required="false" class="sv_q_dropdown_control" role="combobox">
<div class="sv_q_dropdown__value">
<input aria-controls="testid0row1cell0i_list" aria-expanded="false" aria-label="Column 1" autocomplete="off" class="sv_q_dropdown__filter-string-input" inputmode="text" placeholder="Select..." role="combobox" type="text">
</div>
<div class="sv_q_dropdown_clean-button" style="display:none;">
<svg aria-label="Clear" class="sv_q_dropdown_clean-button-svg sv-svg-icon" role="img">
<use xlink:href="#icon-clear_16x16" class="">
</use>
<title class="">Clear</title>
</svg>
</div>
</div>
<div>
<div class="sv-dropdown-popup sv-popup sv-popup--dropdown sv-single-select-list" style="display:none;" tabindex="-1">
<div class="sv-popup__container">
<div class="sv-popup__shadow">
<div class="sv-popup__body-content">
<div class="sv-popup__scrolling-content">
<div class="sv-popup__content">
<div class="sv-list__container">
<div class="sv-list__empty-container">
<div aria-label="No data to display" class="sv-list__empty-text">No data to display</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="sv_matrix_cell sv_matrix_cell_actions" colspan="1" data-responsive-title="" title="">
<div class="sv-action-bar sv-action-bar--default-size-mode">
<div class="sv-action">
<div class="sv-action__content">
<button class="sv_matrix_dynamic_button" type="button">
<span class="sv-string-viewer">Remove</span>
<span>
</span>
</button>
</div>
</div>
</div>
</td>
</tr>
<tr class="sv_matrix_row" data-sv-drop-target-matrix-row="testid0row3">
<td class="sv_matrix_cell" colspan="1" data-responsive-title="Column 1" title="Column 1">
<div>
<div>
<div class="sv_select_wrapper">
<div aria-controls="testid0row3cell0i_list" aria-expanded="false" aria-invalid="false" aria-label="Column 1" aria-required="false" class="sv_q_dropdown_control" role="combobox">
<div class="sv_q_dropdown__value">
<input aria-controls="testid0row3cell0i_list" aria-expanded="false" aria-label="Column 1" autocomplete="off" class="sv_q_dropdown__filter-string-input" inputmode="text" placeholder="Select..." role="combobox" type="text">
</div>
<div class="sv_q_dropdown_clean-button" style="display:none;">
<svg aria-label="Clear" class="sv_q_dropdown_clean-button-svg sv-svg-icon" role="img">
<use xlink:href="#icon-clear_16x16" class="">
</use>
<title class="">Clear</title>
</svg>
</div>
</div>
<div>
<div class="sv-dropdown-popup sv-popup sv-popup--dropdown sv-single-select-list" style="display:none;" tabindex="-1">
<div class="sv-popup__container">
<div class="sv-popup__shadow">
<div class="sv-popup__body-content">
<div class="sv-popup__scrolling-content">
<div class="sv-popup__content">
<div class="sv-list__container">
<div class="sv-list__empty-container">
<div aria-label="No data to display" class="sv-list__empty-text">No data to display</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="sv_matrix_cell sv_matrix_cell_actions" colspan="1" data-responsive-title="" title="">
<div class="sv-action-bar sv-action-bar--default-size-mode">
<div class="sv-action">
<div class="sv-action__content">
<button class="sv_matrix_dynamic_button" type="button">
<span class="sv-string-viewer">Remove</span>
<span>
</span>
</button>
</div>
</div>
</div>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td class="sv_matrix_cell" colspan="1" data-responsive-title="Column 1" title="Column 1">
<div>
<div>Count: 0</div>
</div>
</td>
<td class="sv_matrix_cell_header sv_matrix_cell--action" colspan="1" data-responsive-title="" title="">
</td>
</tr>
</tfoot>
</table>
</div>
<div class="sv_q_footer">
<button class="sv_matrix_dynamic_button" type="button">
<span class="sv-string-viewer">Add Row</span>
<span>
</span>
</button>
</div>
</div>
Binary file added visualRegressionTests/tests/defaultV2/etalons/matrixdynamic-with-totals.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
27 changes: 27 additions & 0 deletions visualRegressionTests/tests/defaultV2/matrixdynamic.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -275,4 +275,31 @@ frameworks.forEach(framework => {
await takeElementScreenshot("matrixdynamic-show-in-multiple-columns.png", matrixdynamicRoot, t, comparer);
});
});
test("Check Matrixdynamic with totals", async (t) => {
await wrapVisualTest(t, async (t, comparer) => {
await t.resizeWindow(1280, 1100);
await initSurvey(framework, {
showQuestionNumbers: "off",
elements: [
{
type: "matrixdynamic",
name: "orderList",
addRowText: "Add new item",
columns: [
{
name: "phone_model",
title: "Phone model",
totalType: "count",
totalFormat: "Items count: {0}",
}
]
}
]
});

const matrixdynamicRoot = Selector(".sd-question");
await resetFocusToBody();
await takeElementScreenshot("matrixdynamic-with-totals.png", matrixdynamicRoot, t, comparer);
});
});
});