Chore: [AEA-4658] - Select your role page header (#207)

## Summary

🎫 [AEA-4658](https://nhsd-jira.digital.nhs.uk/browse/AEA-4658) Select
your role page header

- Routine Change

### Details

Added tests for the Select Your Role page header.

---------

Co-authored-by: SeanSteberis <[email protected]>

features/cpts_ui/select_your_role.feature

@@ -4,11 +4,11 @@ Feature: Role selection page renders roles properly when logged in
 
     Background:
         Given I am logged in
-        And I am on the select_your_role page
+        And I am on the select your role page
 
     @allure.tms:https://nhsd-jira.digital.nhs.uk/browse/AEA-4653
     Scenario: User can navigate to the select_your_role page
-        Then I am on the select_your_role page
+        Then I am on the select your role page
 
     @allure.tms:https://nhsd-jira.digital.nhs.uk/browse/AEA-4653
     Scenario: User can see the summary container, but not the table contents by default
@@ -24,11 +24,19 @@ Feature: Role selection page renders roles properly when logged in
         When I click on the summary expander
         Then I can see the summary container
         And I cannot see the summary table body
-        
+
     @allure.tms:https://nhsd-jira.digital.nhs.uk/browse/AEA-4651
     Scenario: User can see roles with access cards
         Then I can see the roles with access cards
 
     @allure.tms:https://nhsd-jira.digital.nhs.uk/browse/AEA-4651
-    Scenario: User can navigate to the your_selected_role page
-        Then I can navigate to the your_selected_role page by clicking a card
+    Scenario: User can navigate to the your selected role page
+        Then I can navigate to the your selected role page by clicking a card
+
+    @allure.tms:https://nhsd-jira.digital.nhs.uk/browse/AEA-4658
+    Scenario: User can see the header on the select your role page
+        Then I can see the your selected role header
+
+    @allure.tms:https://nhsd-jira.digital.nhs.uk/browse/AEA-4658
+    Scenario: User can see the subheader on the select your role page
+        Then I can see the your selected role subheader

features/environment.py

@@ -50,6 +50,7 @@
     "dispenser": {"user_id": "555260695103", "role_id": "555265434108"},
 }
 LOGIN_USERS = {"user_id": "9449304130"}
+MOCK_CIS2_LOGIN_ID = "555073103100"
 
 REPOS = {
     "CPTS-UI": "https://github.com/NHSDigital/eps-prescription-tracker-ui",

features/steps/cpts_ui/select_your_role_steps.py

@@ -3,21 +3,22 @@
 from playwright.sync_api import expect
 
 from pages.select_your_role import SelectYourRole
+from features.environment import MOCK_CIS2_LOGIN_ID
 
 
-@when("I go to the select_your_role page")
+@when("I go to the select your role page")
 def i_go_to_the_select_your_role_page(context):
     context.page.goto(context.cpts_ui_base_url + "site/selectyourrole.html")
 
 
-@given("I am on the select_your_role page")
+@given("I am on the select your role page")
 def i_am_on_select_your_role_page(context):
     i_go_to_the_select_your_role_page(context)
     select_your_role_page = SelectYourRole(context.page)
     expect(select_your_role_page.summary).to_be_visible()
 
 
-@then("I am on the select_your_role page")
+@then("I am on the select your role page")
 def verify_on_select_your_role_page(context):
     select_your_role_page = SelectYourRole(context.page)
     expect(select_your_role_page.summary).to_be_visible()
@@ -27,7 +28,7 @@ def verify_on_select_your_role_page(context):
 def login(context):
     context.page.goto(context.cpts_ui_base_url + "site/auth_demo.html")
     context.page.get_by_role("button", name="Log in with mock CIS2").click()
-    context.page.get_by_label("Username").fill("555073103100")
+    context.page.get_by_label("Username").fill(MOCK_CIS2_LOGIN_ID)
     context.page.get_by_role("button", name="Sign In").click()
     context.page.wait_for_url("**/auth_demo.html")
 
@@ -75,29 +76,24 @@ def click_on_summary_expander(context):
 @then("I can see the roles with access cards")
 def i_can_see_the_roles_with_access_cards(context):
     select_your_role_page = SelectYourRole(context.page)
-    try:
-        expect(select_your_role_page.first_role_card).to_be_visible(timeout=5000)
-        print("Verified that at least one role card is displayed.")
-    except Exception as e:
-        print("Error verifying roles with access cards:", str(e))
-        print("Page content during error:")
-        print(context.page.content())
-        raise
+    expect(select_your_role_page.first_role_card).to_be_visible()
 
 
-@then("I can navigate to the your_selected_role page by clicking a card")
+@then("I can navigate to the your selected role page by clicking a card")
 def i_can_navigate_to_the_your_selected_role_page(context):
     select_your_role_page = SelectYourRole(context.page)
-    try:
-        expect(select_your_role_page.first_role_card).to_be_visible(timeout=5000)
-        select_your_role_page.first_role_card.click()
-        context.page.wait_for_url(select_your_role_page.selected_role_url)
-        print(
-            "Navigation to your_selected_role page successful. Current URL:",
-            context.page.url,
-        )
-    except Exception as e:
-        print("Error navigating to your_selected_role page:", str(e))
-        print("Page content during error:")
-        print(context.page.content())
-        raise
+    expect(select_your_role_page.first_role_card).to_be_visible()
+    select_your_role_page.first_role_card.click()
+    context.page.wait_for_url(select_your_role_page.selected_role_url)
+
+
+@then("I can see the your selected role header")
+def i_can_see_select_your_role_header(context):
+    select_your_role_page = SelectYourRole(context.page)
+    expect(select_your_role_page.select_role_header).to_be_visible()
+
+
+@then("I can see the your selected role subheader")
+def i_can_see_select_your_role_subheader(context):
+    select_your_role_page = SelectYourRole(context.page)
+    expect(select_your_role_page.select_role_subheader).to_be_visible()

pages/select_your_role.py

@@ -3,9 +3,12 @@
 
 class SelectYourRole:
     def __init__(self, page: Page):
+        """
+        Initialise the SelectYourRole page object with locators and text constants.
+        """
         self.page = page
 
-        self.slr_title = "Select your role"
+        # Title and summary locators
         self.summary = page.locator("summary")
         self.organisation_column_header = page.get_by_role(
             "columnheader", name="Organisation"
@@ -19,11 +22,19 @@ def __init__(self, page: Page):
             "cell", name="Registration Authority Agent"
         ).first
 
+        # Role cards - roles with access
         self.roles_with_access_cards = page.locator(".nhsuk-card--clickable")
         self.first_role_card = self.roles_with_access_cards.first
         self.role_card_headings = page.locator(".nhsuk-card__heading")
         self.role_card_descriptions = page.locator(".eps-card__roleName")
         self.selected_role_url = "**/site/yourselectedrole"
 
-        self.header = "[id='eps_header']"
-        self.footer = "[id='eps_footer']"
+        # Header locators
+        self.select_role_header = page.locator(
+            "span[data-testid='eps_header_selectYourRole'] > span.nhsuk-title"
+        )
+
+        # Subheader locators
+        self.select_role_subheader = page.locator(
+            "span.nhsuk-caption-l.nhsuk-caption--bottom"
+        )