Fix: [AEA-5721] - Add testid to session logged out and session selection (#1385)

## Summary

- Routine Change

### Details

Add required testids to session logged out and session selection page,
so that the regression tests can assert against elements.

---------

Signed-off-by: Connor Avery <[email protected]>

Author: connoravo-nhs

packages/cpt-ui/src/pages/SessionLoggedOut.tsx

@@ -9,35 +9,37 @@ export default function SessionLoggedOutPage() {
 
   if (auth.invalidSessionCause === "ConcurrentSession") {
     return (
-      <main id="main-content" className="nhsuk-main-wrapper">
+      <main id="main-content" className="nhsuk-main-wrapper" data-testid="session-logged-out-concurrent">
         <Container>
           <Row>
             <Col width="full">
-              <h1>You have been logged out</h1>
-              <p>We have logged you out because you started another session in a new window or browser.</p>
-              <p>
+              <h1 data-testid="concurrent-title">You have been logged out</h1>
+              <p data-testid="concurrent-description">
+                We have logged you out because you started another session in a new window or browser.</p>
+              <p data-testid="concurrent-contact">
                 Contact the NHS national service desk at{" "}
-                <a href="mailto:[email protected]">
+                <a href="mailto:[email protected]" data-testid="nhs-service-desk-email">
                   [email protected]
                 </a>{" "}
                 if you did not start another session in another window or browser.
               </p>
-              <Link to="/login">{EpsLogoutStrings.login_link}</Link>
+              <Link to="/login" data-testid="login-link">{EpsLogoutStrings.login_link}</Link>
             </Col>
           </Row>
         </Container>
       </main>
     )
   }
   return (
-    <main id="main-content" className="nhsuk-main-wrapper">
+    <main id="main-content" className="nhsuk-main-wrapper" data-testid="session-logged-out-timeout">
       <Container>
         <Row>
           <Col width="full">
-            <h1>For your security, we have logged you out</h1>
-            <p>We have logged you out because you did not do anything for 15 minutes.</p>
-            <p>This is to protect patient information.</p>
-            <Link to="/login">{EpsLogoutStrings.login_link}</Link>
+            <h1 data-testid="timeout-title">For your security, we have logged you out</h1>
+            <p data-testid="timeout-description">
+              We have logged you out because you did not do anything for 15 minutes.</p>
+            <p data-testid="timeout-description2">This is to protect patient information.</p>
+            <Link to="/login" data-testid="login-link">{EpsLogoutStrings.login_link}</Link>
           </Col>
         </Row>
       </Container>

packages/cpt-ui/src/pages/SessionSelection.tsx

@@ -40,22 +40,25 @@ export default function SessionSelectionPage() {
   // TODO: In the future, if error state from session management API,
   // draw banner item or full page content to describe to user.
   return (
-    <main id="main-content" className="nhsuk-main-wrapper">
+    <main id="main-content" className="nhsuk-main-wrapper" data-testid="session-selection-page">
       <Container>
         <Row>
           <Col width="full">
-            <h1>You are already logged in to the Prescription Tracker</h1>
-            <p>There is a session using these login details in another browser, window or device.</p>
-            <p>You can continue to start a new session in this window, but this will end the other session.</p>
+            <h1 data-testid="title">You are already logged in to the Prescription Tracker</h1>
+            <p data-testid="description">
+              There is a session using these login details in another browser, window or device.</p>
+            <p data-testid="instructions">
+              You can continue to start a new session in this window, but this will end the other session.</p>
           </Col>
         </Row>
 
         <Row>
           <Col width="full">
             <Button id="create-a-new-session" style={{margin: "8px"}} className="nhsuk-button"
-              onClick={setSession} disabled={startNewSessionClicked}>Start a new session</Button>
+              onClick={setSession} disabled={startNewSessionClicked} data-testid="new-session-button">
+                Start a new session</Button>
             <Button id="close-this-window" style={{margin: "8px"}} className="nhsuk-button nhsuk-button--secondary"
-              onClick={logout}>Close this window</Button>
+              onClick={logout} data-testid="close-window-button">Close this window</Button>
           </Col>
         </Row>
       </Container>