Fix calculation of durations in UI
The logic in this method was using round resulting in some
durations rendering incorrectly - specifically > 30 secs, >30 mins,
>12 hours, etc
The behavior I saw prior to this change is as follows:
> start = new Date("2021-01-21 18:14:25.000000000")
: Date Thu Jan 21 2021 18:14:25 GMT+1300 (New Zealand Daylight Time)
> end = new Date("2021-01-21 18:44:35.000000000")
: Date Thu Jan 21 2021 18:44:35 GMT+1300 (New Zealand Daylight Time)
> generateDurationString(start, end)
: "1 hour 30 min"
After the change it is as follows:
> start = new Date("2021-01-21 18:14:25.000000000")
: Date Thu Jan 21 2021 18:14:25 GMT+1300 (New Zealand Daylight Time)
> end = new Date("2021-01-21 18:44:35.000000000")
: Date Thu Jan 21 2021 18:44:35 GMT+1300 (New Zealand Daylight Time)
> generateDurationString(start, end)
: "30 min 10 sec"
Change also adds additional test coverage for these cases.
Change-Id: Ie6d1d5b66a67b478000db49dc19525592f156120
diff --git a/gr-checks/gr-checks-item.js b/gr-checks/gr-checks-item.js
index 494a330..40c4d77 100644
--- a/gr-checks/gr-checks-item.js
+++ b/gr-checks/gr-checks-item.js
@@ -225,21 +225,21 @@
if (secondsAgo % 60 !== 0) {
durationSegments.push(`${secondsAgo % 60} sec`);
}
- const minutesAgo = Math.round(secondsAgo / 60);
+ const minutesAgo = Math.floor(secondsAgo / 60);
if (minutesAgo % 60 !== 0) {
durationSegments.push(`${minutesAgo % 60} min`);
}
- const hoursAgo = Math.round(minutesAgo / 60);
+ const hoursAgo = Math.floor(minutesAgo / 60);
if (hoursAgo % 24 !== 0) {
const hours = pluralize(hoursAgo % 24, 'hour', 'hours');
durationSegments.push(`${hoursAgo % 24} ${hours}`);
}
- const daysAgo = Math.round(hoursAgo / 24);
+ const daysAgo = Math.floor(hoursAgo / 24);
if (daysAgo % 30 !== 0) {
const days = pluralize(daysAgo % 30, 'day', 'days');
durationSegments.push(`${daysAgo % 30} ${days}`);
}
- const monthsAgo = Math.round(daysAgo / 30);
+ const monthsAgo = Math.floor(daysAgo / 30);
if (monthsAgo > 0) {
const months = pluralize(monthsAgo, 'month', 'months');
durationSegments.push(`${monthsAgo} ${months}`);
@@ -255,4 +255,4 @@
*/
function pluralize(unit, singular, plural) {
return unit === 1 ? singular : plural;
-}
\ No newline at end of file
+}
diff --git a/gr-checks/gr-checks-item_test.html b/gr-checks/gr-checks-item_test.html
index e9ce401..305d965 100644
--- a/gr-checks/gr-checks-item_test.html
+++ b/gr-checks/gr-checks-item_test.html
@@ -79,6 +79,42 @@
.querySelector(`td:nth-of-type(${idx})`);
assert.equal(name.textContent.trim(), '0 sec');
});
+
+ test('renders > 1m correctly', () => {
+ element.check = {
+ checkId: 'test-check-id',
+ started: '2019-02-06T22:25:19.269Z',
+ finished: '2019-02-06T22:45:29.269Z',
+ };
+ const idx = CHECKS_ITEM.DURATION;
+ const name = element.shadowRoot
+ .querySelector(`td:nth-of-type(${idx})`);
+ assert.equal(name.textContent.trim(), '20 min 10 sec');
+ });
+
+ test('renders > 1h correctly', () => {
+ element.check = {
+ checkId: 'test-check-id',
+ started: '2019-02-06T22:25:19.269Z',
+ finished: '2019-02-06T23:45:29.269Z',
+ };
+ const idx = CHECKS_ITEM.DURATION;
+ const name = element.shadowRoot
+ .querySelector(`td:nth-of-type(${idx})`);
+ assert.equal(name.textContent.trim(), '1 hour 20 min');
+ });
+
+ test('renders > 1d correctly', () => {
+ element.check = {
+ checkId: 'test-check-id',
+ started: '2019-02-06T22:25:19.269Z',
+ finished: '2019-02-07T23:45:29.269Z',
+ };
+ const idx = CHECKS_ITEM.DURATION;
+ const name = element.shadowRoot
+ .querySelector(`td:nth-of-type(${idx})`);
+ assert.equal(name.textContent.trim(), '1 day 1 hour');
+ });
});
test('renders a link to the log', () => {
