jobtrackingapp/docs/ui-modernisation/visual-correction/evidence/admin-user-2fa/RED.txt


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

  console.error
    An update to AdminUsersPage inside a test was not wrapped in act(...).
    
    When testing, code that causes React state updates should be wrapped into act(...):
    
    act(() => {
      /* fire events that update state */
    });
    /* assert on the output */
    
    This ensures that you're testing the behavior the user would see in the browser. Learn more at https://react.dev/link/wrap-tests-with-act

      66 |     return () => { checkSessionCookie(); return lifetime.mounted && lifetime.generation===generation && !isSessionInvalidated() && getSessionContext()===context; };
      67 |   }, []);
    > 68 |   const finishAction=useCallback((active: () => boolean) => { owner.current.busy=false; if (active()) setBusy(false); }, []);
         |                                                                                                       ^
      69 |
      70 |   const createUser=async () => {
      71 |     if (!canCreate) return;

      at node_modules/react-dom/cjs/react-dom-client.development.js:18758:19
      at runWithFiberInDEV (node_modules/react-dom/cjs/react-dom-client.development.js:874:13)
      at warnIfUpdatesNotWrappedWithActDEV (node_modules/react-dom/cjs/react-dom-client.development.js:18757:9)
      at scheduleUpdateOnFiber (node_modules/react-dom/cjs/react-dom-client.development.js:16409:11)
      at dispatchSetStateInternal (node_modules/react-dom/cjs/react-dom-client.development.js:9170:13)
      at dispatchSetState (node_modules/react-dom/cjs/react-dom-client.development.js:9127:7)
      at setBusy (src/views/AdminUsersPage.tsx:68:103)
      at finishAction (src/views/AdminUsersPage.tsx:123:15)

node.exe : FAIL src/admin-users-page.test.tsx (13.775 s)
At line:1 char:1
+ & "C:\Program Files\nodejs/node.exe" "C:\Program Files\nodejs/node_mo ...
+ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    + CategoryInfo          : NotSpecified: (FAIL src/admin-....tsx (13.775 s):String) [], RemoteException
    + FullyQualifiedErrorId : NativeCommandError
 
  ● reports 2FA state without mistaking an older response for disabled (mobile true)

    Unable to find an element with the text: 2FA enabled. This could be because the text is broken up by multiple 
elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.

    Ignored nodes: comments, script, style
    <body>
      <div>
        <div
          aria-busy="false"
          aria-label="Users"
          class="MuiBox-root css-1pt1ae"
          role="group"
          tabindex="-1"
        >
          <div
            class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation0 MuiAlert-root 
MuiAlert-colorInfo MuiAlert-standardInfo MuiAlert-standard css-cc6lo2-MuiPaper-root-MuiAlert-root"
            role="alert"
            style="--Paper-shadow: var(--shadows-0); --Paper-overlay: var(--overlays-0);"
          >
            <div
              class="MuiAlert-icon css-1wrdnka-MuiAlert-icon"
            >
              <svg
                aria-hidden="true"
                class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit css-8hoymy-MuiSvgIcon-root"
                data-testid="InfoOutlinedIcon"
                focusable="false"
                viewBox="0 0 24 24"
              >
                <path
                  d="M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20, 
12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10, 10 0 0,0 
12,2M11,17H13V11H11V17Z"
                />
              </svg>
            </div>
            <div
              class="MuiAlert-message css-zioonp-MuiAlert-message"
            >
              The final administrator is protected. Removing your own administrator role requires explicit 
confirmation.
            </div>
          </div>
          <section
            aria-labelledby="_r_35_"
            class="MuiBox-root css-agrbqe"
          >
            <header
              class="MuiBox-root css-ekq74m"
            >
              <div
                class="MuiBox-root css-14m33b5"
              >
                <h2
                  class="MuiTypography-root MuiTypography-sectionTitle 
css-1ebwfki-MuiTypography-root"
                  id="_r_35_"
                >
                  Create user
                </h2>
              </div>
            </header>
            <div
              class="MuiBox-root css-31l7gp"
            >
              <form
                class="MuiBox-root css-0"
              >
                <div
                  class="MuiBox-root css-1ngi8ue"
                >
                  <div
                    class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root 
css-cmpglg-MuiFormControl-root-MuiTextField-root"
                  >
                    <label
                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl 
MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root 
MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined 
css-gv8fz8-MuiFormLabel-root-MuiInputLabel-root"
                      data-shrink="false"
                      for="_r_36_"
                      id="_r_36_-label"
                    >
                      Email
                    </label>
                    <div
                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary 
MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-sizeSmall 
css-1pdqkhm-MuiInputBase-root-MuiOutlinedInput-root"
                    >
                      <input
                        aria-invalid="false"
                        class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputSizeSmall 
css-t1wzep-MuiInputBase-input-MuiOutlinedInput-input"
                        id="_r_36_"
                        type="text"
                        value=""
                      />
                      <fieldset
                        aria-hidden="true"
                        class="MuiOutlinedInput-notchedOutline 
css-3q580a-MuiNotchedOutlined-root-MuiOutlinedInput-notchedOutline"
                      >
                        <legend
                          class="css-1n64csd-MuiNotchedOutlined-root"
                        >
                          <span>
                            Email
                          </span>
                        </legend>
                      </fieldset>
                    </div>
                  </div>
                  <div
                    class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root 
css-cmpglg-MuiFormControl-root-MuiTextField-root"
                  >
                    <label
                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl 
MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root 
MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined 
css-gv8fz8-MuiFormLabel-root-MuiInputLabel-root"
                      data-shrink="false"
                      for="_r_37_"
                      id="_r_37_-label"
                    >
                      New password
                    </label>
                    <div
                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary 
MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-sizeSmall 
css-1pdqkhm-MuiInputBase-root-MuiOutlinedInput-root"
                    >
                      <input
                        aria-invalid="false"
                        class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputSizeSmall 
css-t1wzep-MuiInputBase-input-MuiOutlinedInput-input"
                        id="_r_37_"
                        type="password"
                        value=""
                      />
                      <fieldset
                        aria-hidden="true"
                        class="MuiOutlinedInput-notchedOutline css-3q580a-MuiNotchedOut...

      73 |     { ...common, id: 'unknown', email: 'unknown@example.test' },
      74 |   ]);
    > 75 |   expect(await screen.findByText('2FA enabled')).toBeVisible();
         |                       ^
      76 |   expect(screen.getByText('2FA disabled')).toBeVisible();
      77 |   expect(screen.getByText('2FA status unavailable')).toBeVisible();
      78 |   expect(mockedApi.get).toHaveBeenCalledWith('/users');

      at waitForWrapper (node_modules/@testing-library/dom/dist/wait-for.js:163:27)
      at node_modules/@testing-library/dom/dist/query-helpers.js:86:33
      at findByText (src/admin-users-page.test.tsx:75:23)

  ● reports 2FA state without mistaking an older response for disabled (mobile false)

    Unable to find an element with the text: 2FA enabled. This could be because the text is broken up by multiple 
elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.

    Ignored nodes: comments, script, style
    <body>
      <div>
        <div
          aria-busy="false"
          aria-label="Users"
          class="MuiBox-root css-1pt1ae"
          role="group"
          tabindex="-1"
        >
          <div
            class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation0 MuiAlert-root 
MuiAlert-colorInfo MuiAlert-standardInfo MuiAlert-standard css-cc6lo2-MuiPaper-root-MuiAlert-root"
            role="alert"
            style="--Paper-shadow: var(--shadows-0); --Paper-overlay: var(--overlays-0);"
          >
            <div
              class="MuiAlert-icon css-1wrdnka-MuiAlert-icon"
            >
              <svg
                aria-hidden="true"
                class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit css-8hoymy-MuiSvgIcon-root"
                data-testid="InfoOutlinedIcon"
                focusable="false"
                viewBox="0 0 24 24"
              >
                <path
                  d="M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20, 
12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10, 10 0 0,0 
12,2M11,17H13V11H11V17Z"
                />
              </svg>
            </div>
            <div
              class="MuiAlert-message css-zioonp-MuiAlert-message"
            >
              The final administrator is protected. Removing your own administrator role requires explicit 
confirmation.
            </div>
          </div>
          <section
            aria-labelledby="_r_3u_"
            class="MuiBox-root css-agrbqe"
          >
            <header
              class="MuiBox-root css-ekq74m"
            >
              <div
                class="MuiBox-root css-14m33b5"
              >
                <h2
                  class="MuiTypography-root MuiTypography-sectionTitle 
css-1ebwfki-MuiTypography-root"
                  id="_r_3u_"
                >
                  Create user
                </h2>
              </div>
            </header>
            <div
              class="MuiBox-root css-31l7gp"
            >
              <form
                class="MuiBox-root css-0"
              >
                <div
                  class="MuiBox-root css-1ngi8ue"
                >
                  <div
                    class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root 
css-cmpglg-MuiFormControl-root-MuiTextField-root"
                  >
                    <label
                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl 
MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root 
MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined 
css-gv8fz8-MuiFormLabel-root-MuiInputLabel-root"
                      data-shrink="false"
                      for="_r_3v_"
                      id="_r_3v_-label"
                    >
                      Email
                    </label>
                    <div
                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary 
MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-sizeSmall 
css-1pdqkhm-MuiInputBase-root-MuiOutlinedInput-root"
                    >
                      <input
                        aria-invalid="false"
                        class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputSizeSmall 
css-t1wzep-MuiInputBase-input-MuiOutlinedInput-input"
                        id="_r_3v_"
                        type="text"
                        value=""
                      />
                      <fieldset
                        aria-hidden="true"
                        class="MuiOutlinedInput-notchedOutline 
css-3q580a-MuiNotchedOutlined-root-MuiOutlinedInput-notchedOutline"
                      >
                        <legend
                          class="css-1n64csd-MuiNotchedOutlined-root"
                        >
                          <span>
                            Email
                          </span>
                        </legend>
                      </fieldset>
                    </div>
                  </div>
                  <div
                    class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root 
css-cmpglg-MuiFormControl-root-MuiTextField-root"
                  >
                    <label
                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl 
MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root 
MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined 
css-gv8fz8-MuiFormLabel-root-MuiInputLabel-root"
                      data-shrink="false"
                      for="_r_40_"
                      id="_r_40_-label"
                    >
                      New password
                    </label>
                    <div
                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary 
MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-sizeSmall 
css-1pdqkhm-MuiInputBase-root-MuiOutlinedInput-root"
                    >
                      <input
                        aria-invalid="false"
                        class="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputSizeSmall 
css-t1wzep-MuiInputBase-input-MuiOutlinedInput-input"
                        id="_r_40_"
                        type="password"
                        value=""
                      />
                      <fieldset
                        aria-hidden="true"
                        class="MuiOutlinedInput-notchedOutline css-3q580a-MuiNotchedOut...

      73 |     { ...common, id: 'unknown', email: 'unknown@example.test' },
      74 |   ]);
    > 75 |   expect(await screen.findByText('2FA enabled')).toBeVisible();
         |                       ^
      76 |   expect(screen.getByText('2FA disabled')).toBeVisible();
      77 |   expect(screen.getByText('2FA status unavailable')).toBeVisible();
      78 |   expect(mockedApi.get).toHaveBeenCalledWith('/users');

      at waitForWrapper (node_modules/@testing-library/dom/dist/wait-for.js:163:27)
      at node_modules/@testing-library/dom/dist/query-helpers.js:86:33
      at findByText (src/admin-users-page.test.tsx:75:23)

Test Suites: 1 failed, 1 total
Tests:       2 failed, 12 passed, 14 total
Snapshots:   0 total
Time:        14.829 s, estimated 15 s
Ran all test suites matching admin-users-page.test.tsx.