# Test info

- Name: UI case for request tests >> REQ_011 - Verify UI create request with Step by Step
- Location: /root/code/portal-automation-test/tests/request/ui.spec.ts:35:7

# Error details

```
Error: Timed out 10000ms waiting for expect(locator).toMatchAriaSnapshot(expected)

Locator: locator('//div[@id=\'root\']')
- Expected  - 1
+ Received  + 1

@@ -25,11 +25,11 @@
  - img
  - paragraph: Prescription
  - img
  - paragraph: Affidavit
  - img
- - paragraph: Coordination
+ - paragraph: Referral
  - img
  - paragraph: Transfer
  - img
  - paragraph: Delivery
  - img
Call log:
  - expect.toMatchAriaSnapshot with timeout 10000ms
  - waiting for locator('//div[@id=\'root\']')
    13 × locator resolved to <div id="root" class="request-create">…</div>
       - unexpected value "- img
- text: New Request
- button "Switch to Fast Submission"
- paragraph: "1"
- paragraph: Action
- text: Perform an Action
- paragraph: "2"
- paragraph: Client
- text: Identify the Client
- paragraph: "3"
- paragraph: Business
- text: Identify a Business
- paragraph: "4"
- paragraph: Message
- text: Prepare a message
- paragraph: "5"
- paragraph: Share
- text: Share with recipients
- img
- text: Select an Action
- img
- paragraph: Letter of Protection
- img
- paragraph: Medical Bill
- img
- paragraph: Prescription
- img
- paragraph: Affidavit
- img
- paragraph: Referral
- img
- paragraph: Transfer
- img
- paragraph: Delivery
- img
- paragraph: Others
- text: Next"

    at /root/code/portal-automation-test/tests/request/ui.spec.ts:39:49
```

# Page snapshot

```yaml
- complementary:
  - img
  - link "(Portal_Automation_Testing) Portal Assistant":
    - /url: /
    - paragraph: (Portal_Automation_Testing)
    - paragraph: Portal Assistant
  - list:
    - listitem:
      - link "Home":
        - /url: https://app.portalassistant.com
        - img
        - text: Home
    - listitem:
      - link "Case":
        - /url: https://app.portalassistant.com/cases
        - img
        - text: Case
    - listitem:
      - link "Request":
        - /url: https://app.portalassistant.com/requests
        - img
        - text: Request
    - listitem:
      - link "Client":
        - /url: https://app.portalassistant.com/clients
        - img
        - text: Client
    - listitem:
      - button "Business/Contact":
        - img
        - text: Business/Contact
    - listitem:
      - button "Inbox/Sent":
        - img
        - text: Inbox/Sent
    - listitem:
      - button "Settings":
        - img
        - text: Settings
  - list:
    - listitem:
      - button "Shared with me":
        - img
        - text: Shared with me
- banner:
  - img
  - img
  - textbox "Search..."
  - img
  - img
  - paragraph: No notifications yet
  - paragraph: When you get notifications, they'll show up here
  - button "Refresh"
  - list:
    - listitem:
      - img
      - paragraph: Pause notifications...
      - list:
        - listitem: For 30 minutes
        - listitem: For 1 hour
        - listitem: For 2 hours
        - listitem: Until tomorrow
    - listitem:
      - img
    - listitem:
      - img
    - listitem:
      - img
    - listitem:
      - img
    - listitem:
      - img
    - listitem:
      - img
  - img
  - button "0 Cart":
    - img
    - text: 0 Cart
  - text: Feedback
  - img
  - link "Open user menu":
    - /url: "#"
    - text: Portal
- img
- text: New Request
- button "Switch to Fast Submission"
- paragraph: "1"
- paragraph: Action
- text: Perform an Action
- paragraph: "2"
- paragraph: Client
- text: Identify the Client
- paragraph: "3"
- paragraph: Business
- text: Identify a Business
- paragraph: "4"
- paragraph: Message
- text: Prepare a message
- paragraph: "5"
- paragraph: Share
- text: Share with recipients
- img
- text: Select an Action
- img
- paragraph: Letter of Protection
- img
- paragraph: Medical Bill
- img
- paragraph: Prescription
- img
- paragraph: Affidavit
- img
- paragraph: Referral
- img
- paragraph: Transfer
- img
- paragraph: Delivery
- img
- paragraph: Others
- text: Next
```

# Test source

```ts
   1 | import { test, expect } from "../../fixtures/index";
   2 | import { LoginPage } from "../../pom/login.page";
   3 | import { RequestPage } from "../../pom/request/request.page";
   4 | import { getEnv } from "../../utils/env";
   5 |
   6 | test.describe("UI case for request tests", async () => {
   7 |   let loginPage: LoginPage;
   8 |   let requestPage: RequestPage;
   9 |
   10 |   test.beforeEach(async ({ page, conf }) => {
   11 |     loginPage = new LoginPage(page);
   12 |     requestPage = new RequestPage(page);
   13 |
   14 |     await loginPage.open();
   15 |     await loginPage.login(conf.data.username, conf.data.password);
   16 |     await requestPage.open();
   17 |   });
   18 |
   19 |   test(
   20 |     "REQ_001 - Verify UI when empty state",
   21 |     {
   22 |       tag: ["@REQ_001", "@request", "@ui"],
   23 |     },
   24 |     async () => {
   25 |       await test.step('Verify heading and create button', async () => {
   26 |         await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.headingAndCreateButton);
   27 |       });
   28 |
   29 |       await test.step('Verify empty state', async () => {
   30 |         await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.emptyState);
   31 |       });
   32 |     }
   33 |   );
   34 |
   35 |   test("REQ_011 - Verify UI create request with Step by Step", {
   36 |     tag: ["@REQ_011", "@request", "@ui", "@PRODUCTION_READ_ONLY"],
   37 |   }, async () => {
   38 |     await requestPage.gotoCreateRequest("step");
>  39 |     await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.createRequestStepByStep);
      |                                                 ^ Error: Timed out 10000ms waiting for expect(locator).toMatchAriaSnapshot(expected)
   40 |   })
   41 |
   42 |   test("REQ_012 - Verify UI create request with Fast Submission", {
   43 |     tag: ["@REQ_012", "@request", "@ui", "@PRODUCTION_READ_ONLY"],
   44 |   }, async () => {
   45 |     await test.step("Verify UI create request with single record type", async () => {
   46 |       await requestPage.gotoCreateRequest("multi");
   47 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.createRequestFastSubmission);
   48 |     });
   49 |
   50 |     await test.step("Verify UI create request with multi record type", async () => {
   51 |       await requestPage.dashboardLoc.buttonByText("Add more").click();
   52 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.createRequestFastSubmissionMulti);
   53 |     });
   54 |   })
   55 |
   56 |   test("REQ_015 - Verify UI self-generated request details", {
   57 |     tag: ["@REQ_015", "@request", "@ui"],
   58 |   }, async ({ conf }) => {
   59 |     await test.step("Verify detail request", async () => {
   60 |       await requestPage.getDetailCase(conf.data.case);
   61 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.detailRequestHeader);
   62 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.detailRequestBody);
   63 |     })
   64 |
   65 |     await test.step("Verify edit share business request", async () => {
   66 |       await requestPage.requestLoc.detail.btnDropdownEditBusiness.click();
   67 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.detailRequestEditShare);
   68 |     })
   69 |   })
   70 |
   71 |   test("REQ_015A - Verify UI self-generated request details in production", {
   72 |     tag: ["@REQ_015A", "@request", "@ui", "@PRODUCTION_READ_ONLY"],
   73 |   }, async ({ conf }) => {
   74 |     test.skip(getEnv() !== 'production', 'Only run in production');
   75 |     await test.step("Verify detail request", async () => {
   76 |       await requestPage.getDetailCase(conf.data.case);
   77 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.detailRequestHeaderProduction);
   78 |     })
   79 |
   80 |     await test.step("Verify edit share business request", async () => {
   81 |       await requestPage.requestLoc.detail.btnDropdownEditBusiness.click();
   82 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.detailRequestEditShareProduction);
   83 |     })
   84 |   })
   85 |
   86 |   test("REQ_022 - Verify UI snapshot with action type medical bill", {
   87 |     tag: ["@REQ_022", "@request", "@function"]
   88 |   }, async ({ conf, browser }) => {
   89 |     await test.step("Verify UI by request owner", async () => {
   90 |       await requestPage.getDetailCase(conf.data.case);
   91 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(`
   92 |               - listitem:
   93 |                 - text: /Minh Phong .* Balance/
   94 |                 - paragraph: /\\$\\d+,\\d+\\.\\d+/
   95 |                 - text: Finalize Reduction Update Balance
   96 |               `, { timeout: 35_000 });
   97 |     })
   98 |
   99 |     await test.step("verify UI of the person receiving the share request", async () => {
  100 |       const { context: contextB, requestPage: requestPageB } = await requestPage.loginInAnotherBrowser(browser, conf.data.username_recive, conf.data.password);
  101 |       await requestPageB.open();
  102 |       await requestPageB.getDetailCase(conf.data.case);
  103 |       await expect(requestPageB.dashboardLoc.root).toMatchAriaSnapshot(`
  104 |             - listitem:
  105 |                 - text: /Minh Phong .* Balance/
  106 |                 - paragraph: /\\$\\d+,\\d+\\.\\d+/
  107 |                 - text: Finalize Reduction
  108 |               `);
  109 |       await contextB.close();
  110 |     })
  111 |   })
  112 |
  113 |   test("REQ_029 - Verify UI when turn off all Notification", {
  114 |     tag: ["@REQ_029", "@request", "@function"]
  115 |   }, async ({ conf }) => {
  116 |     await test.step("Turn off all notifications", async () => {
  117 |       await requestPage.getDetailCase(conf.data.case);
  118 |       await requestPage.requestLoc.detail.notification.btnOpenModalNoti.nth(1).click();
  119 |       await requestPage.requestLoc.detail.notification.btnTurnOffAll.click();
  120 |       await requestPage.requestLoc.detail.btnCofirmRemove.click();
  121 |
  122 |       //Verify UI turn off all in app
  123 |       await requestPage.requestLoc.detail.notification.btnToggleSettingNoti.first().click();
  124 |       await expect(requestPage.page.locator('#flush-collapse-3').first()).toMatchAriaSnapshot(`
  125 |               - text: Responses
  126 |               - checkbox "Responses"
  127 |               - text: Comments
  128 |               - checkbox "Comments"
  129 |               - text: Discussions
  130 |               - checkbox "Discussions"
  131 |               `);
  132 |
  133 |       //Verify UI turn off all in mail
  134 |       await requestPage.requestLoc.detail.notification.btnToggleSettingNoti.nth(1).click();
  135 |       await expect(requestPage.page.locator('#flush-collapse-3').first()).toMatchAriaSnapshot(`
  136 |               - text: Comments
  137 |               - checkbox "Comments"
  138 |               - text: Discussions
  139 |               - checkbox "Discussions"
```