test updated

src/lib/ext-listen.js

@@ -32,17 +32,18 @@ export function openActivityLogPage() {
   });
 }
 
-export function timeFormat(timestamp) {
+export function dateTimeFormat(timestamp, options) {
   const dateTime = new Date(timestamp);
-  return `${dateTime.toLocaleTimeString()}`;
-}
+  const time = dateTime.toLocaleTimeString();
 
-export function dateTimeFormat(timestamp) {
-  const options = { month: 'short', day: 'numeric', year: 'numeric' };
-  const dateTime = new Date(timestamp);
-  const formattedDate = new Intl.DateTimeFormat(undefined, options).format(
+  if (options?.timeOnly) {
+    return time;
+  }
+
+  const dateFormatOptions = { month: 'short', day: 'numeric', year: 'numeric' };
+  const date = new Intl.DateTimeFormat(undefined, dateFormatOptions).format(
     dateTime
   );
 
-  return `${formattedDate} ${dateTime.toLocaleTimeString()}`;
+  return `${date} ${time}`;
 }

src/lib/web-component/log-view/log-view-element.js

@@ -1,4 +1,4 @@
-import { timeFormat, dateTimeFormat } from '../../ext-listen.js';
+import { dateTimeFormat } from '../../ext-listen.js';
 
 export class LogView extends HTMLElement {
   constructor() {
@@ -43,7 +43,8 @@ export class LogView extends HTMLElement {
       logTableRowInstance.querySelector('.id').textContent = log.id;
 
       const timestamp = logTableRowInstance.querySelector('.timestamp');
-      timestamp.textContent = timeFormat(log.timeStamp);
+
+      timestamp.textContent = dateTimeFormat(log.timeStamp, { timeOnly: true });
       timestamp.title = dateTimeFormat(log.timeStamp);
 
       logTableRowInstance.querySelector('.api-type').textContent = log.type;

tests/ext-activitylog.test.js

@@ -5,6 +5,7 @@ import ActivityLog from '../src/lib/ext-activitylog';
 import { FilterOption } from '../src/lib/web-component/filter-option/filter-option-element';
 import { LogView } from '../src/lib/web-component/log-view/log-view-element';
 import { FilterKeyword } from '../src/lib/web-component/filter-keyword/filter-keyword-element';
+import * as ExtListen from '../src/lib/ext-listen';
 
 const activityLogHtml = fs.readFileSync(
   path.resolve(__dirname, '../src/activitylog/activitylog.html'),
@@ -301,24 +302,42 @@ test('timestamp is formatted and rendered correctly', () => {
   });
 
   document.body.innerHTML = activityLogBody;
+  const dateTimeFormatFn = jest.spyOn(ExtListen, 'dateTimeFormat');
 
   const { activityLog } = new ActivityLog();
 
+  // To have consistant date format, we choose "en-US" formatting
+  let expectedDate;
+  dateTimeFormatFn.mockImplementation((timestamp, options) => {
+    const dateTime = new Date(timestamp);
+    const time = dateTime.toLocaleTimeString();
+
+    if (options?.timeOnly) {
+      return time;
+    }
+
+    const dateFormatOptions = {
+      month: 'short',
+      day: 'numeric',
+      year: 'numeric',
+    };
+    expectedDate = new Intl.DateTimeFormat('en-US', dateFormatOptions).format(
+      dateTime
+    );
+
+    return `${expectedDate} ${time}`;
+  });
+
   activityLog.handleNewLogs(logs);
 
-  const dateTime = new Date(logTimestamp);
-
-  const options = { month: 'short', day: 'numeric', year: 'numeric' };
-  const expectedDate = new Intl.DateTimeFormat(undefined, options).format(
-    dateTime
-  );
+  expect(dateTimeFormatFn).toHaveBeenCalled();
 
+  const dateTime = new Date(logTimestamp);
   const expectedTime = dateTime.toLocaleTimeString();
   const expectedDateTime = `${expectedDate} ${expectedTime}`;
 
   const tableBody = activityLog.view.logView.shadowRoot.querySelector('tbody');
   const tableRows = tableBody.querySelectorAll('tr');
-
   const firstRowTimestamp = tableRows[0].querySelector('.timestamp');
 
   // For log timestamp: 1597686226302