Conservancy/reimbursinator
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add displayListOfReports tests

Browse source
This commit is contained in:
Preston Doman 2019-03-05 15:58:41 -08:00
parent 839edcf794
commit 5ac57e88e2
3 changed files with 60 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
front/static/js/testObjects.js
View file

@ -36,3 +36,7 @@ const typeEditExpectedHTML = `<div class="modal fade" id="editReportModal" tabin
</div> </div>
</div> </div>
</div>`; </div>`;
const displayReportsOneReportExpected = `<div class="card-body"><table class="table table-striped table-responsive-sm" style="visibility: visible;"><thead><tr><th>Title</th><th>Date Created</th><th class="d-none d-md-table-cell">Date Submitted</th><th>Action</th></tr></thead><tbody><tr><td>TEST1</td><td>3/5/2019</td><td class="d-none d-md-table-cell">TBD</td><td><button type="submit" data-rid="4" class="btn btn-primary edit-report-button" data-toggle="modal" data-target="#editReportModal">Edit</button></td></tr></tbody></table></div>`;
const displayReportsTwoReportsExpected = `<div class="card-body"><table class="table table-striped table-responsive-sm" style="visibility: visible;"><thead><tr><th>Title</th><th>Date Created</th><th class="d-none d-md-table-cell">Date Submitted</th><th>Action</th></tr></thead><tbody><tr><td>TEST1</td><td>3/5/2019</td><td class="d-none d-md-table-cell">TBD</td><td><button type="submit" data-rid="4" class="btn btn-primary edit-report-button" data-toggle="modal" data-target="#editReportModal">Edit</button></td></tr><tr><td>TEST2</td><td>3/5/2019</td><td class="d-none d-md-table-cell">TBD</td><td><button type="submit" data-rid="5" class="btn btn-primary edit-report-button" data-toggle="modal" data-target="#editReportModal">Edit</button></td></tr></tbody></table></div>`;

18
front/static/js/viewHistory.js
View file

@ -295,12 +295,6 @@ function createReportForm(parsedData, type) {
const accordion = document.createElement("div"); const accordion = document.createElement("div");
accordion.classList.add("accordion"); accordion.classList.add("accordion");
//submit button
const submitButton = document.querySelector(".submit-report-button");
if (submitButton) {
submitButton.setAttribute("data-rid", parsedData.report_pk);
}
if (type === reportType.EDIT) { if (type === reportType.EDIT) {
modalBody = document.querySelector("#editReportModalBody"); modalBody = document.querySelector("#editReportModalBody");
modalLabel = document.querySelector("#editReportModalLabel"); modalLabel = document.querySelector("#editReportModalLabel");
@ -317,6 +311,11 @@ function createReportForm(parsedData, type) {
return; return;
} }
const submitButton = document.querySelector(".submit-report-button");
if (submitButton) {
submitButton.setAttribute("data-rid", parsedData.report_pk);
}
while (modalBody.firstChild) { while (modalBody.firstChild) {
modalBody.removeChild(modalBody.firstChild); modalBody.removeChild(modalBody.firstChild);
} }
@ -339,13 +338,6 @@ function createReportForm(parsedData, type) {
// Traverse the fields of this section // Traverse the fields of this section
let fields = sections[i].fields; let fields = sections[i].fields;
for (let j = 0; j < fields.length; j++) { for (let j = 0; j < fields.length; j++) {
/*
console.log("Field label: " + fields[j].label);
console.log("Field type: " + fields[j].field_type);
console.log("Field value: " + fields[j].value);
*/
// Create a form group for each field and add it to the form // Create a form group for each field and add it to the form
form.appendChild(createFormGroup(sectionIdStr, fields[j])); form.appendChild(createFormGroup(sectionIdStr, fields[j]));
} }

59
front/static/tests/qunit_tests.html
View file

@ -10,6 +10,23 @@
<body> <body>
<div id="qunit"></div> <div id="qunit"></div>
<div id="qunit-fixture"> <div id="qunit-fixture">
<div class="card-body">
<div class="text-center">
<i class="fas fa-spinner fa-3x fa-spin"></i>
</div>
<table class="table table-striped table-responsive-sm" style="visibility:hidden">
<thead>
<tr>
<th>Title</th>
<th>Date Created</th>
<th class="d-none d-md-table-cell">Date Submitted</th>
<th>Action</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<div class="modal fade" id="newReportModal" tabindex="-1" role="dialog"> <div class="modal fade" id="newReportModal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg" role="document"> <div class="modal-dialog modal-lg" role="document">
<div class="modal-content"> <div class="modal-content">
@ -96,9 +113,6 @@
assert.deepEqual(formGroup.outerHTML, expectedHTML, "boolean true renders as yes option selected"); assert.deepEqual(formGroup.outerHTML, expectedHTML, "boolean true renders as yes option selected");
}); });
// END: Test rendering of fields with type boolean
// BEGIN: Test rendering of fields with type date // BEGIN: Test rendering of fields with type date
QUnit.test("date input group renders", function(assert) { QUnit.test("date input group renders", function(assert) {
let sectionIdStr = "section-1-"; let sectionIdStr = "section-1-";
@ -138,7 +152,6 @@
let value = formGroup.querySelector("#section-1-departure_date").value; let value = formGroup.querySelector("#section-1-departure_date").value;
assert.deepEqual(value, field.value, "date input initialized to a value is rendered with that value"); assert.deepEqual(value, field.value, "date input initialized to a value is rendered with that value");
}); });
// END: Test rendering of fields with type date
// BEGIN: Test rendering of fields with type string // BEGIN: Test rendering of fields with type string
QUnit.test("string input group renders", function(assert) { QUnit.test("string input group renders", function(assert) {
@ -166,7 +179,6 @@
let value = formGroup.querySelector("#section-1-city").value; let value = formGroup.querySelector("#section-1-city").value;
assert.deepEqual(value, field.value, "text input initialized to a value is rendered with that value"); assert.deepEqual(value, field.value, "text input initialized to a value is rendered with that value");
}); });
// END: Test rendering of fields with type date
// BEGIN: Test rendering of fields with type decimal // BEGIN: Test rendering of fields with type decimal
QUnit.test("decimal input group renders", function(assert) { QUnit.test("decimal input group renders", function(assert) {
@ -207,7 +219,6 @@
let value = formGroup.querySelector("#section-1-lowest_fare").value; let value = formGroup.querySelector("#section-1-lowest_fare").value;
assert.deepEqual(value, field.value, "decimal input initialized to 1337 has value 1337"); assert.deepEqual(value, field.value, "decimal input initialized to 1337 has value 1337");
}); });
// END: Test rendering of fields with type decimal
// BEGIN: Test rendering of fields with type integer // BEGIN: Test rendering of fields with type integer
QUnit.test("integer input group renders", function(assert) { QUnit.test("integer input group renders", function(assert) {
@ -248,8 +259,6 @@
let value = formGroup.querySelector("#section-1-full_days").value; let value = formGroup.querySelector("#section-1-full_days").value;
assert.deepEqual(value, field.value.toString(), "integer input initialized to 1234 has string value 1234"); assert.deepEqual(value, field.value.toString(), "integer input initialized to 1234 has string value 1234");
}); });
// END: Test rendering of fields with type integer
// BEGIN: Test rendering of fields with type file // BEGIN: Test rendering of fields with type file
QUnit.test("file input group renders", function(assert) { QUnit.test("file input group renders", function(assert) {
@ -277,7 +286,7 @@
let value = formGroup.querySelector(".form-text").innerHTML; let value = formGroup.querySelector(".form-text").innerHTML;
assert.deepEqual(value, field.value, "file input initialized to screenshot.jpg has string value screenshot.jpg"); assert.deepEqual(value, field.value, "file input initialized to screenshot.jpg has string value screenshot.jpg");
}); });
// END: Test rendering of fields with type file
// BEGIN createCollapsibleCard unit tests // BEGIN createCollapsibleCard unit tests
QUnit.module("createCollapsibleCard"); QUnit.module("createCollapsibleCard");
@ -352,6 +361,7 @@
assert.deepEqual(collapseDiv.outerHTML, expectedHTML, "collapseDiv html and expectedHTML are identical"); assert.deepEqual(collapseDiv.outerHTML, expectedHTML, "collapseDiv html and expectedHTML are identical");
}); });
// BEGIN createCardFooter unit tests // BEGIN createCardFooter unit tests
QUnit.module("createCardFooter"); QUnit.module("createCardFooter");
@ -375,6 +385,8 @@
assert.deepEqual(cardFooter.outerHTML, expectedHTML, "cardFooter html and expectedHTML are identical"); assert.deepEqual(cardFooter.outerHTML, expectedHTML, "cardFooter html and expectedHTML are identical");
}); });
// BEGIN createReportForm unit tests
QUnit.module("createReportForm"); QUnit.module("createReportForm");
QUnit.test("new report renders", function(assert) { QUnit.test("new report renders", function(assert) {
@ -397,6 +409,35 @@
createReportForm(testReport, undefined); createReportForm(testReport, undefined);
assert.deepEqual(qunitFixture.outerHTML, expectedHTML, "report forms and expectedHTML are identical") assert.deepEqual(qunitFixture.outerHTML, expectedHTML, "report forms and expectedHTML are identical")
}); });
// BEGIN displayListOfReports unit tests
QUnit.module("displayListOfReports");
QUnit.test("empty reports", function(assert) {
let expectedHTML = `<div class="card-body"><h5 class="text-center">No reports found.</h5></div>`;
let parsedData = {"reports": []};
displayListOfReports(parsedData);
let cardBody = document.querySelector(".card-body");
assert.deepEqual(cardBody.outerHTML.replace(/>\s+</g, "><"), expectedHTML, "card body and expectedHTML are identical");
});
QUnit.test("one report", function(assert) {
let parsedData = {"reports": [{"date_created": "2019-03-05T08:00:00Z", "title": "TEST1", "reference_number": "1234", "date_submitted": "2019-03-05T08:00:00Z", "user_id": 2, "submitted": false, "report_pk": 4}]};
let expectedHTML = displayReportsOneReportExpected;
displayListOfReports(parsedData);
let cardBody = document.querySelector(".card-body");
assert.deepEqual(cardBody.outerHTML.replace(/>\s+</g, "><"), expectedHTML, "card body and expectedHTML are identical");
});
QUnit.test("two reports", function(assert) {
let parsedData = {"reports": [{"date_created": "2019-03-05T08:00:00Z", "title": "TEST1", "reference_number": "1234", "date_submitted": "2019-03-05T08:00:00Z", "user_id": 2, "submitted": false, "report_pk": 4}, {"date_created": "2019-03-05T08:00:00Z", "title": "TEST2", "reference_number": "12345", "date_submitted": "2019-03-05T08:00:00Z", "user_id": 2, "submitted": false, "report_pk": 5}]};
let expectedHTML = displayReportsTwoReportsExpected;
displayListOfReports(parsedData);
let cardBody = document.querySelector(".card-body");
assert.deepEqual(cardBody.outerHTML.replace(/>\s+</g, "><"), expectedHTML, "card body and expectedHTML are identical");
});
</script> </script>
</body> </body>
</html> </html>