jobtrackingapp/docs/ui-modernisation/visual-correction/evidence/audit-search/RED.txt


> job-tracker-ui@0.1.0 test
> jest --runInBand admin-audit-page.test.tsx

node.exe : FAIL src/admin-audit-page.test.tsx
At line:1 char:1
+ & "C:\Program Files\nodejs/node.exe" "C:\Program Files\nodejs/node_mo ...
+ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    + CategoryInfo          : NotSpecified: (FAIL src/admin-audit-page.test.tsx:String) [], RemoteException
    + FullyQualifiedErrorId : NativeCommandError
 
  ● searches loaded audit metadata without querying the API or matching notes

    TestingLibraryElementError: Unable to find an accessible element with the role "searchbox" and name "Search recent 
audit events"

    Here are the accessible roles:

      region:

      Name "Events":
      <section
        aria-labelledby="_r_0_"
        class="MuiBox-root css-s8beop"
      />

      Name "Audit log":
      <div
        aria-busy="false"
        aria-label="Audit log"
        class="MuiBox-root css-1dspuux"
        role="region"
        tabindex="0"
      />

      --------------------------------------------------
      banner:

      Name "":
      <header
        class="MuiBox-root css-163u82n"
      />

      --------------------------------------------------
      heading:

      Name "Events":
      <h2
        class="MuiTypography-root MuiTypography-sectionTitle css-uf4832-MuiTypography-root"
        id="_r_0_"
      />

      --------------------------------------------------
      status:

      Name "":
      <span
        aria-atomic="true"
        aria-live="polite"
        class="MuiBox-root css-ty8jgw"
        role="status"
      />

      --------------------------------------------------
      table:

      Name "Audit log":
      <table
        aria-label="Audit log"
        class="MuiTable-root css-10fa1bu-MuiTable-root"
      />

      --------------------------------------------------
      rowgroup:

      Name "":
      <thead
        class="MuiTableHead-root css-1a7iywq-MuiTableHead-root"
      />

      Name "":
      <tbody
        class="MuiTableBody-root css-gmh7jj-MuiTableBody-root"
      />

      --------------------------------------------------
      row:

      Name "At Type Job User Details Actions":
      <tr
        class="MuiTableRow-root MuiTableRow-head css-1xtozoh-MuiTableRow-root"
      />

      Name "20/10/2026, 14:00:00 Deleted Teacher jobId=42 alice@example.test Owner authored text Undo Restore":
      <tr
        class="MuiTableRow-root MuiTableRow-hover css-1xtozoh-MuiTableRow-root"
      />

      Name "20/10/2026, 14:00:00 StatusChanged Clinic - Nurse jobId=420 - Sensitive phrase Undo":
      <tr
        class="MuiTableRow-root MuiTableRow-hover css-1xtozoh-MuiTableRow-root"
      />

      --------------------------------------------------
      columnheader:

      Name "At":
      <th
        class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-196w20h-MuiTableCell-root"
        scope="col"
      />

      Name "Type":
      <th
        class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-1dgvq2m-MuiTableCell-root"
        scope="col"
      />

      Name "Job":
      <th
        class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-1v0kiah-MuiTableCell-root"
        scope="col"
      />

      Name "User":
      <th
        class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-1g8y0zc-MuiTableCell-root"
        scope="col"
      />

      Name "Details":
      <th
        class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-1uet7a6-MuiTableCell-root"
        scope="col"
      />

      Name "Actions":
      <th
        class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-1kin7cs-MuiTableCell-root"
        scope="col"
      />

      --------------------------------------------------
      cell:

      Name "20/10/2026, 14:00:00":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "Deleted":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "Teacher jobId=42":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "alice@example.test":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "Owner authored text":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "Undo Restore":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "20/10/2026, 14:00:00":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "StatusChanged":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "Clinic - Nurse jobId=420":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "-":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "Sensitive phrase":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      Name "Undo":
      <td
        class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
      />

      --------------------------------------------------
      paragraph:

      Name "":
      <p
        class="MuiTypography-root MuiTypography-body1 css-8yxce8-MuiTypography-root"
      />

      Name "":
      <p
        class="MuiTypography-root MuiTypography-body1 css-1g7ym63-MuiTypography-root"
      />

      Name "":
      <p
        class="MuiTypography-root MuiTypography-body1 css-1w5cmg1-MuiTypography-root"
      />

      Name "":
      <p
        class="MuiTypography-root MuiTypography-body1 css-8yxce8-MuiTypography-root"
      />

      Name "":
      <p
        class="MuiTypography-root MuiTypography-body1 css-1g7ym63-MuiTypography-root"
      />

      Name "":
      <p
        class="MuiTypography-root MuiTypography-body1 css-1w5cmg1-MuiTypography-root"
      />

      --------------------------------------------------
      button:

      Name "Undo":
      <button
        class="MuiButtonBase-root MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary 
MuiButton-sizeSmall MuiButton-outlinedSizeSmall MuiButton-colorPrimary MuiButton-root MuiButton-outlined 
MuiButton-outlinedPrimary MuiButton-sizeSmall MuiButton-outlinedSizeSmall MuiButton-colorPrimary 
css-74b9is-MuiButtonBase-root-MuiButton-root"
        tabindex="0"
        type="button"
      />

      Name "Restore":
      <button
        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary 
MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-colorPrimary MuiButton-root MuiButton-contained 
MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-colorPrimary 
css-tm237w-MuiButtonBase-root-MuiButton-root"
        tabindex="0"
        type="button"
      />

      Name "Undo":
      <button
        class="MuiButtonBase-root MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary 
MuiButton-sizeSmall MuiButton-outlinedSizeSmall MuiButton-colorPrimary MuiButton-root MuiButton-outlined 
MuiButton-outlinedPrimary MuiButton-sizeSmall MuiButton-outlinedSizeSmall MuiButton-colorPrimary 
css-74b9is-MuiButtonBase-root-MuiButton-root"
        tabindex="0"
        type="button"
      />

      --------------------------------------------------

    Ignored nodes: comments, script, style
    <body>
      <div>
        <div
          class="MuiBox-root css-emz572"
        >
          <section
            aria-labelledby="_r_0_"
            class="MuiBox-root css-s8beop"
          >
            <header
              class="MuiBox-root css-163u82n"
            >
              <div
                class="MuiBox-root css-14m33b5"
              >
                <h2
                  class="MuiTypography-root MuiTypography-sectionTitle 
css-uf4832-MuiTypography-root"
                  id="_r_0_"
                >
                  Events
                </h2>
              </div>
            </header>
            <div
              class="MuiBox-root css-31l7gp"
            >
              <div
                aria-busy="false"
                aria-label="Audit log"
                class="MuiBox-root css-1dspuux"
                role="region"
                tabindex="0"
              >
                <span
                  aria-atomic="true"
                  aria-live="polite"
                  class="MuiBox-root css-ty8jgw"
                  role="status"
                >
                  Content loaded.
                </span>
                <div
                  class="MuiTableContainer-root css-1e232co-MuiTableContainer-root"
                >
                  <table
                    aria-label="Audit log"
                    class="MuiTable-root css-10fa1bu-MuiTable-root"
                  >
                    <thead
                      class="MuiTableHead-root css-1a7iywq-MuiTableHead-root"
                    >
                      <tr
                        class="MuiTableRow-root MuiTableRow-head css-1xtozoh-MuiTableRow-root"
                      >
                        <th
                          class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-196w20h-MuiTableCell-root"
                          scope="col"
                        >
                          At
                        </th>
                        <th
                          class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-1dgvq2m-MuiTableCell-root"
                          scope="col"
                        >
                          Type
                        </th>
                        <th
                          class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-1v0kiah-MuiTableCell-root"
                          scope="col"
                        >
                          Job
                        </th>
                        <th
                          class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-1g8y0zc-MuiTableCell-root"
                          scope="col"
                        >
                          User
                        </th>
                        <th
                          class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-1uet7a6-MuiTableCell-root"
                          scope="col"
                        >
                          Details
                        </th>
                        <th
                          class="MuiTableCell-root MuiTableCell-head MuiTableCell-sizeSmall 
css-1kin7cs-MuiTableCell-root"
                          scope="col"
                        >
                          Actions
                        </th>
                      </tr>
                    </thead>
                    <tbody
                      class="MuiTableBody-root css-gmh7jj-MuiTableBody-root"
                    >
                      <tr
                        class="MuiTableRow-root MuiTableRow-hover css-1xtozoh-MuiTableRow-root"
                      >
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          20/10/2026, 14:00:00
                        </td>
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          <div
                            class="MuiChip-root MuiChip-outlined MuiChip-sizeSmall MuiChip-colorDefault 
MuiChip-outlinedDefault css-1w2bku1-MuiChip-root"
                          >
                            <span
                              class="MuiChip-label MuiChip-labelSmall css-19m61dl-MuiChip-label"
                            >
                              Deleted
                            </span>
                          </div>
                        </td>
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          <p
                            class="MuiTypography-root MuiTypography-body1 
css-8yxce8-MuiTypography-root"
                          >
                            Teacher
                          </p>
                          <span
                            class="MuiTypography-root MuiTypography-caption 
css-2qd4a1-MuiTypography-root"
                          >
                            jobId=
                            42
                          </span>
                        </td>
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          <p
                            class="MuiTypography-root MuiTypography-body1 
css-1g7ym63-MuiTypography-root"
                          >
                            alice@example.test
                          </p>
                        </td>
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          <p
                            class="MuiTypography-root MuiTypography-body1 
css-1w5cmg1-MuiTypography-root"
                          >
                            Owner authored text
                          </p>
                        </td>
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          <div
                            class="MuiBox-root css-1mcghfl"
                          >
                            <button
                              class="MuiButtonBase-root MuiButton-root MuiButton-outlined 
MuiButton-outlinedPrimary MuiButton-sizeSmall MuiButton-outlinedSizeSmall MuiButton-colorPrimary MuiButton-root 
MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeSmall MuiButton-outlinedSizeSmall MuiButton-colorPrimary 
css-74b9is-MuiButtonBase-root-MuiButton-root"
                              tabindex="0"
                              type="button"
                            >
                              Undo
                            </button>
                            <button
                              class="MuiButtonBase-root MuiButton-root MuiButton-contained 
MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-colorPrimary MuiButton-root 
MuiButton-contained MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-colorPrimary 
css-tm237w-MuiButtonBase-root-MuiButton-root"
                              tabindex="0"
                              type="button"
                            >
                              Restore
                            </button>
                          </div>
                        </td>
                      </tr>
                      <tr
                        class="MuiTableRow-root MuiTableRow-hover css-1xtozoh-MuiTableRow-root"
                      >
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          20/10/2026, 14:00:00
                        </td>
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          <div
                            class="MuiChip-root MuiChip-outlined MuiChip-sizeSmall MuiChip-colorDefault 
MuiChip-outlinedDefault css-1w2bku1-MuiChip-root"
                          >
                            <span
                              class="MuiChip-label MuiChip-labelSmall css-19m61dl-MuiChip-label"
                            >
                              StatusChanged
                            </span>
                          </div>
                        </td>
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          <p
                            class="MuiTypography-root MuiTypography-body1 
css-8yxce8-MuiTypography-root"
                          >
                            Clinic - 
                            Nurse
                          </p>
                          <span
                            class="MuiTypography-root MuiTypography-caption 
css-2qd4a1-MuiTypography-root"
                          >
                            jobId=
                            420
                          </span>
                        </td>
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          <p
                            class="MuiTypography-root MuiTypography-body1 
css-1g7ym63-MuiTypography-root"
                          >
                            -
                          </p>
                        </td>
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          <p
                            class="MuiTypography-root MuiTypography-body1 
css-1w5cmg1-MuiTypography-root"
                          >
                            Sensitive phrase
                          </p>
                        </td>
                        <td
                          class="MuiTableCell-root MuiTableCell-body MuiTableCell-sizeSmall 
css-1uwqjd6-MuiTableCell-root"
                        >
                          <div
                            class="MuiBox-root css-1mcghfl"
                          >
                            <button
                              class="MuiButtonBase-root MuiButton-root MuiButton-outlined 
MuiButton-outlinedPrimary MuiButton-sizeSmall MuiButton-outlinedSizeSmall MuiButton-colorPrimary MuiButton-root 
MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeSmall MuiButton-outlinedSizeSmall MuiButton-colorPrimary 
css-74b9is-MuiButtonBase-root-MuiButton-root"
                              tabindex="0"
                              type="button"
                            >
                              Undo
                            </button>
                          </div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>
            </div>
          </section>
        </div>
      </div>
    </body>

      41 |   renderPage();
      42 |   await screen.findByText("Teacher");
    > 43 |   const search = screen.getByRole("searchbox", { name: "Search recent audit events" });
         |                         ^
      44 |   expect(search).toHaveAccessibleDescription("Searches up to 200 loaded events by user, event type, 
application ID, title or company.");
      45 |
      46 |   for (const query of [" ALICE ", "al", "user-a", "Deleted", "42", "teacher"]) {

      at Object.getElementError (node_modules/@testing-library/dom/dist/config.js:37:19)
      at node_modules/@testing-library/dom/dist/query-helpers.js:76:38
      at node_modules/@testing-library/dom/dist/query-helpers.js:52:17
      at node_modules/@testing-library/dom/dist/query-helpers.js:95:19
      at Object.getByRole (src/admin-audit-page.test.tsx:43:25)

Test Suites: 1 failed, 1 total
Tests:       1 failed, 9 passed, 10 total
Snapshots:   0 total
Time:        4.042 s
Ran all test suites matching admin-audit-page.test.tsx.