find occurence of time, improve time formatting js

app/assets/javascripts/main.js

@@ -1,49 +1,58 @@
 window.formatAllDates = function () {
   $(".local-datetime-short").each(function (index) {
-    let datetime = new Date($(this).text().trim());
+    let datetimeRaw = $(this).text().trim();
+    let datetime = new Date(datetimeRaw);
     let locale = window.APP_LANG == "fr" ? "fr-CA" : "en-US";
 
     if (datetime instanceof Date && !isNaN(datetime)) {
-      $(this).text(
-        datetime.toLocaleString(locale, {
-          month: "short",
-          day: "numeric",
-          hour: "numeric",
-          minute: "2-digit",
-        }),
-      );
+      $(this)
+        .attr("datetime", datetimeRaw)
+        .text(
+          datetime.toLocaleString(locale, {
+            month: "short",
+            day: "numeric",
+            hour: "numeric",
+            minute: "2-digit",
+          }),
+        );
     }
   });
 
   $(".local-datetime-short-year").each(function (index) {
-    let datetime = new Date($(this).text().trim());
+    let datetimeRaw = $(this).text().trim();
+    let datetime = new Date(datetimeRaw);
     let locale = window.APP_LANG == "fr" ? "fr-CA" : "en-US";
 
     if (datetime instanceof Date && !isNaN(datetime)) {
-      $(this).text(
-        datetime.toLocaleString(locale, {
-          month: "short",
-          day: "numeric",
-          year: "numeric",
-        }),
-      );
+      $(this)
+        .attr("datetime", datetimeRaw)
+        .text(
+          datetime.toLocaleString(locale, {
+            month: "short",
+            day: "numeric",
+            year: "numeric",
+          }),
+        );
     }
   });
 
   $(".local-datetime-full").each(function (index) {
-    let datetime = new Date($(this).text().trim());
+    let datetimeRaw = $(this).text().trim();
+    let datetime = new Date(datetimeRaw);
     let locale = window.APP_LANG == "fr" ? "fr-CA" : "en-US";
 
     if ($(this).text().trim() === "None") {
       $(this).text(window.APP_PHRASES["never"]);
     }
 
     if (datetime instanceof Date && !isNaN(datetime)) {
-      $(this).text(
-        datetime.toLocaleDateString(locale, { dateStyle: "long" }) +
-          ", " +
-          datetime.toLocaleTimeString(locale, { timeStyle: "short" }),
-      );
+      $(this)
+        .attr("datetime", datetimeRaw)
+        .text(
+          datetime.toLocaleDateString(locale, { dateStyle: "long" }) +
+            ", " +
+            datetime.toLocaleTimeString(locale, { timeStyle: "short" }),
+        );
     }
   });
 

app/templates/partials/jobs/notifications_header.html

@@ -24,7 +24,7 @@
         {% else %}
           <a href="{{ download_link }}" download class="text-smaller leading-tight font-bold">{{ _('Download this report') }}</a>
           <div class="mt-2 text-small leading-tight font-normal">
-            {{ _("Available until") }} <span id="time-left" class="local-datetime-short-year">{{ available_until_date }}</span>
+            {{ _("Available until") }} <time id="time-left" class="local-datetime-short-year">{{ available_until_date }}</time>
           </div>
         {% endif %}
       </div>

app/templates/partials/jobs/status.html

@@ -12,7 +12,7 @@
         </div>
         <div class="pb-4">
           {{ _('Started:') }}
-          <span class="local-datetime-short">{{ job.created_at }}</span>
+          <time class="local-datetime-short">{{ job.created_at }}</time>
         </div>
         <div class="pb-4">
           {% if job.api_key %}

app/templates/views/api/index.html

@@ -99,7 +99,7 @@ <h3 class="api-notifications-item-recipient">
                 ] %}
                   {% if notification[key] %}
                     <dt>{{ key }}:</dt>
-                    <dd class="api-notifications-item-data-item local-datetime-full">{{ notification[key] }}</dd>
+                    <dd class="api-notifications-item-data-item"><time class="local-datetime-full">{{ notification[key] }}</time></dd>
                   {% endif %}
                 {% endfor %}
                 {% if notification.status not in ('pending-virus-check', 'virus-scan-failed') %}

app/templates/views/api/keys.html

@@ -64,19 +64,19 @@ <h2 class="heading-small">
             {% endif %}
           </div>
             <div class="hint">
-              {{ _('Created:') }} <span class="local-datetime-full">{{ item.created_at }}</span>
+              {{ _('Created:') }} <time class="local-datetime-full">{{ item.created_at }}</time>
             </div>
             <div class="hint">
-              {{ _('Expires:') }} <span class="local-datetime-full">{{ item.expiry_date }}</span>
+              {{ _('Expires:') }} <time class="local-datetime-full">{{ item.expiry_date }}</time>
             </div>
             <div class="hint">
-              {{ _('Last used:') }} <span class="local-datetime-full">{{ item.last_send }}</span>
+              {{ _('Last used:') }} <time class="local-datetime-full">{{ item.last_send }}</time>
             </div>
         </div>
       {% endcall %}
       {% if item.expiry_date %}
         {% call field(align='right') %}
-          <span class='hint'>{{ _('Revoked') }} <span class="local-datetime-short">{{ item.expiry_date }}</span></span>
+          <span class='hint'>{{ _('Revoked') }} <time class="local-datetime-short">{{ item.expiry_date }}</time></span>
         {% endcall %}
       {% else %}
         {% call field(align='right', status='error') %}

app/templates/views/dashboard/_jobs.html

@@ -22,9 +22,9 @@
         <a class="file-list-filename" href="{{ url_for('.view_job', service_id=current_service.id, job_id=item.id) }}">{{ item.original_file_name }}</a>
         <span class="file-list-hint">
           {{ _('Sent') }}
-            <span class="local-datetime-short">
+            <time class="local-datetime-short">
               {{item.scheduled_for if item.scheduled_for else item.created_at}}
-            </span>
+            </time>
         </span>
       </div>
     {% endcall %}

app/templates/views/dashboard/_upcoming.html

@@ -20,7 +20,7 @@
           <div class="file-list">
             <a class="file-list-filename" href="{{ url_for('.view_job', service_id=current_service.id, job_id=item.id) }}">{{ item.original_file_name }}</a>
             <span class="file-list-hint">
-              {{ _("Starting") }} <span class="local-datetime-short">{{ item.scheduled_for }}</span>
+              {{ _("Starting") }} <time class="local-datetime-short">{{ item.scheduled_for }}</time>
             </span>
           </div>
         {% endcall %}

app/templates/views/jobs/job.html

@@ -35,7 +35,7 @@ <h1 class="heading-large">
           {{ _('Scheduled for') }}
         </div>
         <div class="w-full sm:w-3/4 border-solid border-b-1 border-gray-600-1 pt-4 pb-4">
-          <span class="local-datetime-short">{{ job.scheduled_for }}</span>
+          <time class="local-datetime-short">{{ job.scheduled_for }}</time>
         </div>
         <div class="w-full sm:w-1/4 border-solid font-bold sm:font-normal sm:border-b-1 border-gray-600-1 pt-4 pb-4">
           {% if job.api_key %}
@@ -82,7 +82,7 @@ <h1 class="heading-large">
       {% else %}
 
       {{ empty_list(
-          _("GC Notify disposed of the information in this report on <span class='local-datetime-short'>{}</span>").format(job.updated_at), 
+          _("GC Notify disposed of the information in this report on <time class='local-datetime-short'>{}</time>").format(job.updated_at), 
           _('After {} days, we keep only non-identifying statistics.').format(svc_retention_days), 
           'emptyBirdHole'
         ) 

app/templates/views/notifications/invalid_precompiled_letter.html

@@ -9,7 +9,7 @@
     <h1 class="heading-large">Letter</h1>
 
     <p>
-      Provided as PDF on <span class="local-datetime-short">{{ created_at }}</span>
+      Provided as PDF on <time class="local-datetime-short">{{ created_at }}</time>
     </p>
     <p class="notification-status-cancelled">
       Validation failed – this isn’t a PDF file that Notification can read

app/templates/views/notifications/notification.html

@@ -44,14 +44,14 @@
         {% elif created_by %}
           {{ _('by') }} {{ created_by.name }}
         {% endif %}
-        {{ _('on') }} <span class="local-datetime-short">{{ created_at }}</span>
+        {{ _('on') }} <time class="local-datetime-short">{{ created_at }}</time>
       </p>
     </div>
 
     {% if template.template_type == 'letter' %}
       {% if notification_status in ('permanent-failure', 'cancelled') %}
         <p class="notification-status-cancelled">
-          Cancelled <span class="local-datetime-short">{{ updated_at }}</span>
+          Cancelled <time class="local-datetime-short">{{ updated_at }}</time>
         </p>
       {% elif notification_status == 'validation-failed' %}
         <p class="notification-status-cancelled">

app/templates/views/platform-admin/complaints.html

@@ -29,7 +29,7 @@ <h1 class="heading-large">
 
       {{ text_field(item.complaint_type) }}
 
-      <span class="local-datetime-short">{{ text_field(item.complaint_date if item.complaint_date else None) }}</span>
+      <time class="local-datetime-short">{{ text_field(item.complaint_date if item.complaint_date else None) }}</time>
 
   {% endcall %}
 

app/templates/views/providers/provider.html

@@ -29,7 +29,7 @@
         {{ text_field(item.version) }}
 
         {% if item.updated_at %}
-          <span class="local-datetime-short">{{ text_field(item.updated_at) }}</span>
+          <time class="local-datetime-short">{{ text_field(item.updated_at) }}</time>
         {% else %}
             {{ text_field('None') }}
         {% endif %}

app/templates/views/providers/providers.html

@@ -30,7 +30,7 @@ <h2 class="heading-medium">SMS</h2>
       {{ text_field(item.active) }}
 
       {% if item.updated_at %}
-        <span class="local-datetime-short">{{ text_field(item.updated_at) }}</span>
+        <time class="local-datetime-short">{{ text_field(item.updated_at) }}</time>
       {% else %}
           {{ text_field('None') }}
       {% endif %}
@@ -59,7 +59,7 @@ <h2 class="heading-medium">Email</h2>
       {{ text_field(item.active) }}
 
       {% if item.updated_at %}
-        <span class="local-datetime-short">{{ text_field(item.updated_at) }}</span>
+        <time class="local-datetime-short">{{ text_field(item.updated_at) }}</time>
       {% else %}
           {{ text_field('None') }}
       {% endif %}
@@ -88,7 +88,7 @@ <h1 class="heading-large">International SMS Providers</h1>
       {{ text_field(item.active) }}
 
       {% if item.updated_at %}
-        <span class="local-datetime-short">{{ text_field(item.updated_at) }}</span>
+        <time class="local-datetime-short">{{ text_field(item.updated_at) }}</time>
       {% else %}
           {{ text_field('None') }}
       {% endif %}

app/templates/views/templates/_template_history.html

@@ -7,10 +7,10 @@ <h2 class="message-name">{{ template.name }}</h2>
       {{ _("Version {}").format(template.get_raw('version', 1)) }}{{ _(": ")}}
     {% endif %}
     {% if template.get_raw('version', 1) > 1 %}
-      {{ _('Edit made') }} {% if template.get_raw('updated_at', None) %}<span class="local-datetime-full">{{ template.get_raw('updated_at') }}</span>{% endif %}
+      {{ _('Edit made') }} {% if template.get_raw('updated_at', None) %}<time class="local-datetime-full">{{ template.get_raw('updated_at') }}</time>{% endif %}
     {% else %}
       {{ _('Created') }}
-      {% if template.get_raw('created_at', None) %}<span class="local-datetime-full">{{ template.get_raw('created_at') }}</span>{% endif %}
+      {% if template.get_raw('created_at', None) %}<time class="local-datetime-full">{{ template.get_raw('created_at') }}</time>{% endif %}
     {% endif %}
     {{ _('by') }} {{ template.get_raw('created_by').name }}
   </p>

app/translations/csv/fr.csv

@@ -1794,7 +1794,7 @@
 "Started:","Début :"
 "Spreadsheet:","Feuille de calcul :"
 "API request name:","Nom de la requête API :"
-"GC Notify disposed of the information in this report on <span class='local-datetime-short'>{}</span>","Notification GC a supprimé les renseignements de ce rapport le <span class='local-datetime-short'>{}</span>"
+"GC Notify disposed of the information in this report on <time class='local-datetime-short'>{}</time>","Notification GC a supprimé les renseignements de ce rapport le <time class='local-datetime-short'>{}</time>"
 "After {} days, we keep only non-identifying statistics.","Après {} jours, nous ne conservons que des statistiques anonymes qui ne permettent pas d’identifier les destinataires."
 "{} is not on our list of government domains. If it’s a government email address, <a href='{}'>{}</a>.","{} ne figure pas sur notre liste de domaines gouvernementaux. S’il s’agit d’une adresse courriel gouvernementale, <a href='{}'>{}</a>."
 "System status","État du système"

tests/app/main/views/test_jobs.py

@@ -202,7 +202,7 @@ def test_should_show_page_for_one_job(
         status=status_argument,
     )
     assert csv_link.text == "Download this report"
-    assert page.find("span", {"id": "time-left"}).text.split(" ")[0] == "2016-01-09"
+    assert page.find("time", {"id": "time-left"}).text.split(" ")[0] == "2016-01-09"
 
     assert normalize_spaces(page.select_one("tbody tr").text) == normalize_spaces(
         "6502532222 " "template content " "No " "Delivered 11:10:00.061258"
@@ -231,7 +231,7 @@ def test_should_show_page_for_one_job_with_flexible_data_retention(
     mock_get_service_data_retention.side_effect = [[{"days_of_retention": 10, "notification_type": "sms"}]]
     page = client_request.get("main.view_job", service_id=SERVICE_ONE_ID, job_id=fake_uuid, status="delivered")
 
-    assert page.find("span", {"id": "time-left"}).text.split(" ")[0] == "2016-01-12"
+    assert page.find("time", {"id": "time-left"}).text.split(" ")[0] == "2016-01-12"
     assert "Cancel sending these letters" not in page