# Test info

- Name: UI case for request tests >> REQ_012 - Verify UI create request with Fast Submission
- Location: /root/code/portal-automation-test/tests/request/ui.spec.ts:42:7

# Error details

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

Locator: locator('#root')
- Expected  -  4
+ Received  + 10

@@ -1,5 +1,8 @@
+ - img
+ - text: New Request
+ - button "Switch to Step-by-Step"
  - img
  - paragraph: "1"
  - text: Action Perform an Action
  - paragraph: "2"
  - text: Business Select receiving business
@@ -18,11 +21,14 @@
  - checkbox "Apply all" [disabled]
  - text: Apply all
  - img
  - checkbox "Apply all"
  - text: Apply all Action Business Client Message Email
- - img
+ - button "Delete":
+   - img
- - text: Delete Action Business Client Message Email
+   - text: Delete
+ - text: Action Business Client Message Email
- - img
+ - button "Delete":
+   - img
- - text: Delete
+   - text: Delete
  - button "Add more"
  - button "Create Multiple"
Call log:
  - expect.toMatchAriaSnapshot with timeout 10000ms
  - waiting for locator('#root')
    13 × locator resolved to <div id="root" class="request-create">…</div>
       - unexpected value "- img
- text: New Request
- button "Switch to Step-by-Step"
- img
- paragraph: "1"
- text: Action Perform an Action
- paragraph: "2"
- text: Business Select receiving business
- paragraph: "3"
- text: Client Identify the Client
- paragraph: "4"
- text: Message Prepare a message
- paragraph: "5"
- text: Share Share with recipients
- checkbox "Apply all"
- text: Apply all
- checkbox "Apply all"
- text: Apply all
- checkbox "Apply all"
- text: Apply all
- checkbox "Apply all" [disabled]
- text: Apply all
- img
- checkbox "Apply all"
- text: Apply all Action Business Client Message Email
- button "Delete":
  - img
  - text: Delete
- text: Action Business Client Message Email
- button "Delete":
  - img
  - text: Delete
- button "Add more"
- button "Create Multiple""

    at /root/code/portal-automation-test/tests/request/ui.spec.ts:77:55
    at /root/code/portal-automation-test/tests/request/ui.spec.ts:74:5
```

# Page snapshot

```yaml
- complementary:
  - img
  - link:
    - /url: /
  - list:
    - listitem:
      - link:
        - /url: https://app.portalassistant.com
        - img
    - listitem:
      - link:
        - /url: https://app.portalassistant.com/cases
        - img
    - listitem:
      - link:
        - /url: https://app.portalassistant.com/requests
        - img
    - listitem:
      - link:
        - /url: https://app.portalassistant.com/clients
        - img
    - listitem:
      - button:
        - img
    - listitem:
      - button:
        - img
    - listitem:
      - button:
        - img
  - list:
    - listitem:
      - link:
        - /url: https://app.portalassistant.com/shared/requests
        - img
- banner:
  - button:
    - img
  - button:
    - img
  - img
  - text: Son Phan shared details regarding New Client007 Coordination. Check it out. 1 week ago
  - img
  - text: Son Phan shared details regarding New Client008 Letter of Protection. Read it now. 20 hours ago
  - img
  - text: "\"ádasdasdasdas \" - Son Phan 16 hours ago #855925 Letter of Protection - ref: New Client008"
  - img
  - text: Son Phan included you to the private channel 1 week ago
  - img
  - text: "Son Phan: \" Helloo 123333 \" 1 week ago #284652 Prescription - ref: New Client007"
  - img
  - text: Son Phan released a document concerning New Client005 Letter of Protection. Review it here. 1 week ago
  - img
  - text: Son Phan shared details regarding New Client008 Letter of Protection. Read it now. 20 hours ago
  - img
  - text: "\"sdasdsadasd \" - Son Phan 1 week ago #481818 Coordination - ref: New Client007"
  - img
  - text: Son Phan included you to the private channel 1 week ago
  - img
  - text: "Son Phan: \" Helloo 123333 \" 1 week ago #284652 Prescription - ref: New Client007"
  - img
  - text: Son Phan shared details about John Hardy Letter of Protection 3 days ago
  - img
  - text: Son Phan shared details regarding New Client008 Letter of Protection. Read it now. 20 hours ago
  - img
  - text: "\"ádasdasdasdas \" - Son Phan 16 hours ago #855925 Letter of Protection - ref: New Client008"
  - img
  - text: Son Phan included you to the private channel 1 week ago
  - img
  - text: "Son Phan: \" Helloo 123333 \" 1 week ago #284652 Prescription - ref: New Client007"
  - 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
  - img
  - button "2 Cart":
    - img
    - text: 2 Cart
  - text: Feedback
  - img
  - link "Open user menu":
    - /url: "#"
    - text: Portal
- img
- text: New Request
- button "Switch to Step-by-Step"
- img
- paragraph: "1"
- text: Action Perform an Action
- paragraph: "2"
- text: Business Select receiving business
- paragraph: "3"
- text: Client Identify the Client
- paragraph: "4"
- text: Message Prepare a message
- paragraph: "5"
- text: Share Share with recipients
- checkbox "Apply all"
- text: Apply all
- checkbox "Apply all"
- text: Apply all
- checkbox "Apply all"
- text: Apply all
- checkbox "Apply all" [disabled]
- text: Apply all
- img
- checkbox "Apply all"
- text: Apply all Action Business Client Message Email
- button "Delete":
  - img
  - text: Delete
- text: Action Business Client Message Email
- button "Delete":
  - img
  - text: Delete
- button "Add more"
- button "Create Multiple"
```

# 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);
   40 |   })
   41 |
   42 |   test("REQ_012 - Verify UI create request with Fast Submission", {
   43 |     tag: ["@REQ_012", "@request", "@ui", "@PRODUCTION_READ_ONLY"],
   44 |   }, async ({ conf }) => {
   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 in single step", async () => {
   51 |       // First step
   52 |       await requestPage.requestLoc.create.itemStep(1).first().click()
   53 |       await expect(requestPage.page.locator('#root')).toMatchAriaSnapshot(requestPage.requestSnapshot.createFastSubmissionStep1);
   54 |       await requestPage.requestLoc.actionLetterOfProtection.first().click();
   55 |
   56 |       // Second step
   57 |       await requestPage.requestLoc.create.itemStep(2).first().click();
   58 |       await expect(requestPage.page.locator('#root')).toMatchAriaSnapshot(requestPage.requestSnapshot.createFastSubmissionStep2);
   59 |
   60 |       // Third step
   61 |       await requestPage.requestLoc.create.itemStep(3).first().click();
   62 |       await expect(requestPage.page.locator('#root')).toMatchAriaSnapshot(requestPage.requestSnapshot.createFastSubmissionStep3);
   63 |       await requestPage.fillDataCreateRequest("Type or select a name", "Name", conf.data.patient);
   64 |
   65 |       // Fourth step
   66 |       await requestPage.requestLoc.create.itemStep(4).first().click();
   67 |       await expect(requestPage.page.locator('#root')).toMatchAriaSnapshot(requestPage.requestSnapshot.createFastSubmissionStep4);
   68 |
   69 |       // Fifth step
   70 |       await requestPage.requestLoc.create.itemStep(5).first().click();
   71 |       await expect(requestPage.page.locator('#modal-share')).toMatchAriaSnapshot(requestPage.requestSnapshot.createFastSubmissionStep5);
   72 |     });
   73 |
   74 |     await test.step("Verify UI when create multi", async () => {
   75 |       await requestPage.gotoCreateRequest("multi");
   76 |       await requestPage.dashboardLoc.buttonByText("Add more").click();
>  77 |       await expect(requestPage.page.locator('#root')).toMatchAriaSnapshot(requestPage.requestSnapshot.createRequestFastSubmissionMulti);
      |                                                       ^ Error: Timed out 10000ms waiting for expect(locator).toMatchAriaSnapshot(expected)
   78 |     });
   79 |   })
   80 |
   81 |   test("REQ_015 - Verify UI self-generated request details", {
   82 |     tag: ["@REQ_015", "@request", "@ui"],
   83 |   }, async ({ conf }) => {
   84 |     await test.step("Verify detail request", async () => {
   85 |       await requestPage.getDetailCase(conf.data.case);
   86 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.detailRequestHeader);
   87 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.detailRequestBody);
   88 |     })
   89 |
   90 |     await test.step("Verify edit share business request", async () => {
   91 |       await requestPage.requestLoc.detail.btnDropdownEditBusiness.click();
   92 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.detailRequestEditShare);
   93 |     })
   94 |   })
   95 |
   96 |   test("REQ_015A - Verify UI self-generated request details in production", {
   97 |     tag: ["@REQ_015A", "@request", "@ui", "@PRODUCTION_READ_ONLY"],
   98 |   }, async ({ conf }) => {
   99 |     test.skip(getEnv() !== 'production', 'Only run in production');
  100 |     await test.step("Verify detail request", async () => {
  101 |       await requestPage.getDetailCase(conf.data.case);
  102 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.detailRequestHeaderProduction);
  103 |     })
  104 |
  105 |     await test.step("Verify edit share business request", async () => {
  106 |       await requestPage.requestLoc.detail.btnDropdownEditBusiness.click();
  107 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(requestPage.requestSnapshot.detailRequestEditShareProduction);
  108 |     })
  109 |   })
  110 |
  111 |   test("REQ_022 - Verify UI snapshot with action type medical bill", {
  112 |     tag: ["@REQ_022", "@request", "@function"]
  113 |   }, async ({ conf, browser }) => {
  114 |     await test.step("Verify UI by request owner", async () => {
  115 |       await requestPage.getDetailCase(conf.data.case);
  116 |       await expect(requestPage.dashboardLoc.root).toMatchAriaSnapshot(`
  117 |               - listitem:
  118 |                 - text: /Minh Phong .* Balance/
  119 |                 - paragraph: /\\$\\d+,\\d+\\.\\d+/
  120 |                 - text: Finalize Reduction Update Balance
  121 |               `, { timeout: 35_000 });
  122 |     })
  123 |
  124 |     await test.step("verify UI of the person receiving the share request", async () => {
  125 |       const { context: contextB, requestPage: requestPageB } = await requestPage.loginInAnotherBrowser(browser, conf.data.username_recive, conf.data.password);
  126 |       await requestPageB.open();
  127 |       await requestPageB.getDetailCase(conf.data.case);
  128 |       await expect(requestPageB.dashboardLoc.root).toMatchAriaSnapshot(`
  129 |             - listitem:
  130 |                 - text: /Minh Phong .* Balance/
  131 |                 - paragraph: /\\$\\d+,\\d+\\.\\d+/
  132 |                 - text: Finalize Reduction
  133 |               `);
  134 |       await contextB.close();
  135 |     })
  136 |   })
  137 |
  138 |   test("REQ_029 - Verify UI when turn off all Notification", {
  139 |     tag: ["@REQ_029", "@request", "@function"]
  140 |   }, async ({ conf }) => {
  141 |     await test.step("Turn off all notifications", async () => {
  142 |       await requestPage.getDetailCase(conf.data.case);
  143 |       await requestPage.requestLoc.detail.notification.btnOpenModalNoti.nth(1).click();
  144 |       await expect(requestPage.dashboardLoc.modal.headerModal("Notifications settings")).toBeVisible();
  145 |
  146 |       await requestPage.requestLoc.detail.notification.btnTurnOffAll.click();
  147 |       await requestPage.requestLoc.detail.btnCofirmRemove.click();
  148 |       await expect(requestPage.dashboardLoc.notificationUpdateSuccess).toBeVisible();
  149 |       await requestPage.dashboardLoc.closeMsg.click();
  150 |       //Verify UI turn off all in app
  151 |       await requestPage.requestLoc.detail.notification.btnToggleSettingNoti.first().click();
  152 |       await expect(requestPage.page.locator('#flush-collapse-3').first()).toMatchAriaSnapshot(`
  153 |               - text: Responses
  154 |               - checkbox "Responses"
  155 |               - text: Comments
  156 |               - checkbox "Comments"
  157 |               - text: Discussions
  158 |               - checkbox "Discussions"
  159 |               `);
  160 |
  161 |       //Verify UI turn off all in mail
  162 |       await requestPage.requestLoc.detail.notification.btnToggleSettingNoti.nth(1).click();
  163 |       await expect(requestPage.page.locator('#flush-collapse-3').first()).toMatchAriaSnapshot(`
  164 |               - text: Comments
  165 |               - checkbox "Comments"
  166 |               - text: Discussions
  167 |               - checkbox "Discussions"
  168 |               `);
  169 |     })
  170 |
  171 |     await test.step("Turn on all notifications", async () => {
  172 |       await requestPage.requestLoc.detail.notification.btnTurnOnAll.click();
  173 |       await expect(requestPage.dashboardLoc.notificationUpdateSuccess).toBeVisible();
  174 |       await requestPage.dashboardLoc.closeMsg.click();
  175 |
  176 |       //Verify UI turn on all in app
  177 |       await requestPage.requestLoc.detail.notification.btnToggleSettingNoti.first().click();
```