Skip to content

Commit 88fae66

Browse files
kyle-wannacottkyle-wannacott
committed
Wrote tests for data-sort attribute; deprecated days-of-week in favour of data-sort.
1 parent bd9f05b commit 88fae66

File tree

4 files changed

+78
-97
lines changed

4 files changed

+78
-97
lines changed

‎public/table-sort.js‎

Lines changed: 2 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@ function tableSortJs(test = false, domDocumentWindow = document) {
6868

6969
if (desc && tableArrows) {
7070
th.insertAdjacentText("beforeend", arrowDown);
71-
} else if (tableArrows){
71+
} else if (tableArrows) {
7272
th.insertAdjacentText("beforeend", arrowUp);
7373
}
7474

@@ -86,45 +86,6 @@ function tableSortJs(test = false, domDocumentWindow = document) {
8686
}
8787
}
8888

89-
let isDayOfWeek = th.classList.contains("days-of-week");
90-
if (isDayOfWeek) {
91-
const day =
92-
/(Monday|Tuesday|Wednesday|Thursday|Friday|Saturday|Sunday|Mon|Tue|Wed|Thur|Fri|Sat|Sun)/i;
93-
const dayOfWeek = {
94-
Monday: 1,
95-
Tuesday: 2,
96-
Wednesday: 3,
97-
Thursday: 4,
98-
Friday: 5,
99-
Saturday: 6,
100-
Sunday: 7,
101-
};
102-
for (let [i, tr] of tableRows.entries()) {
103-
const dayOfWeekTd = tr
104-
.querySelectorAll("td")
105-
.item(columnIndex).textContent;
106-
if (dayOfWeekTd.match(day)) {
107-
if (dayOfWeekTd.match(/Monday|Mon/i)) {
108-
columnData.push(`${dayOfWeek.Monday}#${i}`);
109-
} else if (dayOfWeekTd.match(/Tuesday|Tue/i)) {
110-
columnData.push(`${dayOfWeek.Tuesday}#${i}`);
111-
} else if (dayOfWeekTd.match(/Wednesday|Wed/i)) {
112-
columnData.push(`${dayOfWeek.Wednesday}#${i}`);
113-
} else if (dayOfWeekTd.match(/Thursday|Thur/i)) {
114-
columnData.push(`${dayOfWeek.Thursday}#${i}`);
115-
} else if (dayOfWeekTd.match(/Friday|Fri/i)) {
116-
columnData.push(`${dayOfWeek.Friday}#${i}`);
117-
} else if (dayOfWeekTd.match(/Saturday|Sat/i)) {
118-
columnData.push(`${dayOfWeek.Saturday}#${i}`);
119-
} else if (dayOfWeekTd.match(/Sunday|Sun/i)) {
120-
columnData.push(`${dayOfWeek.Sunday}#${i}`);
121-
}
122-
} else {
123-
columnData.push(`!X!Y!Z!#${i}`);
124-
}
125-
}
126-
}
127-
12889
// Handle filesize sorting (e.g KB, MB, GB, TB) - Turns data into KiB.
12990
let isFileSize = th.classList.contains("file-size");
13091
if (isFileSize) {
@@ -320,10 +281,7 @@ function tableSortJs(test = false, domDocumentWindow = document) {
320281
if (isFileSize) {
321282
fileSizeColumnTextAndRow[columnData[i]] = tr.innerHTML;
322283
}
323-
if (isDayOfWeek) {
324-
columnIndexAndTableRow[columnData[i]] = tr.innerHTML;
325-
}
326-
if (!isFileSize && !isDayOfWeek && !isDataAttribute) {
284+
if (!isFileSize && !isDataAttribute) {
327285
columnData.push(`${tdTextContent}#${i}`);
328286
columnIndexAndTableRow[`${tdTextContent}#${i}`] = tr.innerHTML;
329287
}

‎test/dataSort.js‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
const jsdom = require("jsdom");
2+
const { JSDOM } = jsdom;
3+
require("iconv-lite").encodingExists("foo");
4+
const tableSortJs = require("../public/table-sort");
5+
6+
function createDataSortTestTable(testTableData, classTags="") {
7+
8+
let getClassTagsForTH = [];
9+
let testTableThRow = `<tr><th class="${classTags}">Testing Column</th></tr>`;
10+
getClassTagsForTH.push(testTableThRow);
11+
12+
let testTableTdRows = [];
13+
for (let i = 0; i < testTableData.length; i++) {
14+
let testTableTdRow = `<tr><td data-sort="${i}">${testTableData[i]}</td></tr>`;
15+
console.log(testTableTdRow)
16+
testTableTdRows.push(testTableTdRow);
17+
}
18+
19+
const dom = new JSDOM(`<!DOCTYPE html>
20+
<html>
21+
<head>
22+
</head>
23+
<body>
24+
<table class="table-sort">
25+
<thead>
26+
${getClassTagsForTH}
27+
</thead>
28+
<tbody>
29+
${testTableTdRows}
30+
</tbody>
31+
</table>
32+
</body>
33+
</html>`);
34+
35+
// Call tablesort and make table sortable and simulate click from a user.
36+
tableSortJs(test=true,dom.window.document);
37+
dom.window.document.querySelector("table th").click();
38+
39+
// Make an array from table contents to test if sorted correctly.
40+
let table = dom.window.document.querySelector("table");
41+
const tableBody = table.querySelector("tbody");
42+
const tableRows = tableBody.querySelectorAll("tr");
43+
const testIfSortedList = [];
44+
for (let [i, tr] of tableRows.entries()) {
45+
testIfSortedList.push(tr.querySelectorAll("td").item(0).innerHTML);
46+
}
47+
return testIfSortedList;
48+
}
49+
50+
module.exports = createDataSortTestTable;

‎test/table.js‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,12 @@ function createTestTable(testTableData, classTags="") {
1111

1212
let testTableTdRows = [];
1313
for (let i = 0; i < testTableData.length; i++) {
14-
let testTableTdRow = `<tr><td>${testTableData[i]}</td></tr>`;
14+
let testTableTdRow;
15+
if(classTags.includes("data-sort")){
16+
testTableTdRow = `<tr><td data-sort="${i}">${testTableData[i]}</td></tr>`;
17+
}else{
18+
testTableTdRow = `<tr><td>${testTableData[i]}</td></tr>`;
19+
}
1520
testTableTdRows.push(testTableTdRow);
1621
}
1722

‎test/table.test.js‎

Lines changed: 20 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -230,7 +230,7 @@ test("Release Versions: order-by-desc", () => {
230230
).toStrictEqual(["4.2.0", "4.1.0", "4.0.1", "3.0.4", "3.0.2"]);
231231
});
232232

233-
test("Expects week begins at Monday.", () => {
233+
test("data-sort: example days of week", () => {
234234
expect(
235235
createTestTable(
236236
[
@@ -241,20 +241,21 @@ test("Expects week begins at Monday.", () => {
241241
"Thursday",
242242
"Tuesday",
243243
"Monday",
244-
], "days-of-week"
244+
],
245+
"data-sort"
245246
)
246247
).toStrictEqual([
247-
"Monday",
248-
"Tuesday",
249-
"Wednesday",
250-
"Thursday",
251-
"Friday",
252-
"Saturday",
253-
"Sunday",
248+
"Saturday",
249+
"Wednesday",
250+
"Sunday",
251+
"Friday",
252+
"Thursday",
253+
"Tuesday",
254+
"Monday",
254255
]);
255256
});
256257

257-
test("Expects week begins at Monday: order-by-desc", () => {
258+
test("data-sort: example days of week - reversed", () => {
258259
expect(
259260
createTestTable(
260261
[
@@ -265,49 +266,16 @@ test("Expects week begins at Monday: order-by-desc", () => {
265266
"Thursday",
266267
"Tuesday",
267268
"Monday",
268-
], "days-of-week order-by-desc"
269+
],
270+
"data-sort order-by-desc"
269271
)
270272
).toStrictEqual([
271-
"Sunday",
272-
"Saturday",
273-
"Friday",
274-
"Thursday",
275-
"Wednesday",
276-
"Tuesday",
277-
"Monday",
273+
"Monday",
274+
"Tuesday",
275+
"Thursday",
276+
"Friday",
277+
"Sunday",
278+
"Wednesday",
279+
"Saturday",
278280
]);
279281
});
280-
281-
// test("Day of the weeks. order-by-desc", () =
282-
// expect(
283-
// createTestTable([])
284-
// ).toStrictEqual([]);
285-
// });
286-
// Tests For Sorting not yet implemented
287-
// test("Sizes", () => {
288-
// expect(createTestTable(["xs", "lg", "sm", "md", "xlg"])).toStrictEqual([
289-
// "xs",
290-
// "sm",
291-
// "md",
292-
// "lg",
293-
// "xlg",
294-
// ]);
295-
// });
296-
// test("Months", () => {
297-
// expect(createTestTable(["March", "October", "December", "February", "January"])).toStrictEqual([
298-
// "January",
299-
// "February",
300-
// "March",
301-
// "October",
302-
// "December",
303-
// ]);
304-
// });
305-
// test("Weekdays (Expects week begins at Monday)", () => {
306-
// expect(createTestTable(["Wednesday", "Monday", "Friday", "Thursday", "Sunday"])).toStrictEqual([
307-
// "Monday",
308-
// "Wednesday",
309-
// "Thursday",
310-
// "Friday",
311-
// "Sunday",
312-
// ]);
313-
// });

0 commit comments

Comments
 (0)