Fix a test

Author: johnsimons

src/Frontend/src/components/TimeSince.vue

@@ -39,6 +39,6 @@ onUnmounted(() => window.clearInterval(interval));
     <template #content>
       <div v-for="row in title" :key="row">{{ row }}</div>
     </template>
-    <span>{{ text }}</span>
+    <span role="timer" :aria-label="title.join('\n')">{{ text }}</span>
   </Tippy>
 </template>

src/Frontend/src/components/customchecks/CustomCheckView.vue

@@ -23,7 +23,7 @@ const store = useCustomChecksStore();
                     <span class="metadata"><i aria-hidden="true" class="fa fa-list"></i> Category: {{ customCheck.category }}</span>
                     <span class="metadata"><i aria-hidden="true" class="fa pa-endpoint"></i> Endpoint: {{ customCheck.originating_endpoint.name }}</span>
                     <span class="metadata"><i aria-hidden="true" class="fa fa-server"></i> Host: {{ customCheck.originating_endpoint.host }}</span>
-                    <span class="metadata"><i aria-hidden="true" class="fa fa-clock-o"></i> Last checked: <TimeSince :date-utc="customCheck.reported_at" role="note" aria-label="custom-check-reported-date"></TimeSince></span>
+                    <span class="metadata" role="note" aria-label="custom-check-reported-date"><i aria-hidden="true" class="fa fa-clock-o"></i> Last checked: <TimeSince :date-utc="customCheck.reported_at"></TimeSince></span>
                   </p>
                 </div>
               </div>

src/Frontend/test/specs/customchecks/questions/failedCustomChecks.ts

@@ -1,4 +1,4 @@
-import { screen } from "@testing-library/vue";
+import { screen, within } from "@testing-library/vue";
 import moment from "moment";
 
 export function customChecksMessageElement() {
@@ -25,11 +25,13 @@ export function customChecksListPaginationElement() {
   const customChecksListPaginationElement = screen.queryByRole("row", { name: "custom-check-pagination" });
   return customChecksListPaginationElement;
 }
-export async function customChecksReportedDateList() {
-  const timeElements = await screen.getAllByRole("note", { name: "custom-check-reported-date" });
+export function customChecksReportedDateList() {
+  const timeElements = screen.getAllByRole("note", { name: "custom-check-reported-date" });
 
   const timeStamps = timeElements.map((el) => {
-    const utcDateString = el.title.match(/(\w+day, \w+ \d+, \d+ \d+:\d+ [APM]+ \(UTC\))/);
+    const utcDateString = within(el)
+      .getByRole("timer")
+      ?.ariaLabel?.match(/(\w+day, \w+ \d+, \d+ \d+:\d+ [APM]+ \(UTC\))/);
 
     const finalUtcString = utcDateString ? utcDateString[0] : moment.utc().format("dddd, MMMM D, YYYY h:mm A (UTC)");
 

src/Frontend/test/specs/customchecks/viewing-failing-custom-checks.spec.ts

@@ -72,7 +72,7 @@ describe("FEATURE: Failing custom checks", () => {
     });
   });
   describe("RULE: Failed custom checks should be shown in descending order of last checked", () => {
-    test("EXAMPLE:Three failed custom checks is  displayed in descending order of last checked on the custom checks tab", async ({ driver }) => {
+    test("EXAMPLE:Three failed custom checks are displayed in descending order of last checked on the custom checks tab", async ({ driver }) => {
       const failingCustomCheckCount = 5;
       const passingCustomCheckCount = 3;
 
@@ -82,13 +82,13 @@ describe("FEATURE: Failing custom checks", () => {
       await driver.goTo("/custom-checks");
 
       await waitFor(async () => {
-        expect(await customChecksListElement()).toBeInTheDocument(); //failed list is visisble
+        expect(await customChecksListElement()).toBeInTheDocument(); //failed list is visible
       });
       await waitFor(async () => {
         expect(await customChecksFailedRowsList()).toHaveLength(failingCustomCheckCount); //count of failed checks matches failing count set
       });
 
-      const timestamps = await customChecksReportedDateList(); // Ensure this is awaited correctly
+      const timestamps = customChecksReportedDateList(); // Ensure this is awaited correctly
 
       // Ensure that the times are in descending order
       for (let i = 0; i < timestamps.length - 1; i++) {