OBPIH-7920 Putaway - add comment to putaway

src/fixtures/fixtures.ts

@@ -30,6 +30,7 @@ import ProductEditPage from '@/pages/product/productEdit/ProductEditPage';
 import ProductShowPage from '@/pages/product/productShow/ProductShowPage';
 import CreatePutawayPage from '@/pages/putaway/CreatePutawayPage';
 import PutawayListPage from '@/pages/putaway/list/PutawayListPage';
+import AddCommentToPutawayPage from '@/pages/putaway/putawayDetails/AddCommentToPutawayPage';
 import PutawayDetailsPage from '@/pages/putaway/putawayDetails/PutawayDetailsPage';
 import ReceivingPage from '@/pages/receiving/ReceivingPage';
 import OldViewShipmentPage from '@/pages/stockMovementShow/OldViewShipmentPage';
@@ -74,6 +75,7 @@ type Fixtures = {
   putawayListPage: PutawayListPage;
   productEditPage: ProductEditPage;
   editTransactionPage: EditTransactionPage;
+  addCommentToPutawayPage: AddCommentToPutawayPage;
   // COMPONENTS
   navbar: Navbar;
   locationChooser: LocationChooser;
@@ -153,6 +155,8 @@ export const test = baseTest.extend<Fixtures>({
   productEditPage: async ({ page }, use) => use(new ProductEditPage(page)),
   editTransactionPage: async ({ page }, use) =>
     use(new EditTransactionPage(page)),
+  addCommentToPutawayPage: async ({ page }, use) =>
+    use(new AddCommentToPutawayPage(page)),
   // COMPONENTS
   navbar: async ({ page }, use) => use(new Navbar(page)),
   locationChooser: async ({ page }, use) => use(new LocationChooser(page)),

src/pages/product/productShow/ProductShowPage.ts

@@ -36,7 +36,7 @@ class ProductShowPage extends BasePageModel {
     return this.page.getByRole('link', { name: 'Stock History' });
   }
 
-  get editProductkButton() {
+  get editProductButton() {
     return this.page.getByRole('link', { name: 'Edit Product' });
   }
 }

src/pages/putaway/list/PutawayListTable.ts

@@ -15,6 +15,15 @@ class PutawayListTable extends BasePageModel {
     return new Row(this.page, this.rows.nth(index));
   }
 
+  rowByOrderNumber(orderNumber: string) {
+    return new Row(
+      this.page,
+      this.rows.filter({
+        has: this.page.getByTestId('order-number').getByText(orderNumber),
+      })
+    );
+  }
+
   async clickDeleteOrderButton(index: number) {
     this.page.once('dialog', (dialog) => dialog.accept());
     await this.row(index).deleteOrder.click();

src/pages/putaway/putawayDetails/AddCommentToPutawayPage.ts

@@ -0,0 +1,42 @@
+import { expect } from '@playwright/test';
+
+import BasePageModel from '@/pages/BasePageModel';
+
+class AddCommentToPutawayPage extends BasePageModel {
+  async isLoaded() {
+    await expect(
+      this.page.getByRole('heading', { name: 'Add Comment' })
+    ).toBeVisible();
+  }
+
+  get commentField() {
+    return this.page.locator('#comment');
+  }
+
+  get saveButton() {
+    return this.page.getByRole('button', { name: 'Save' });
+  }
+
+  get recipientDropdown() {
+    return this.page.locator('#recipient_id_chosen .chosen-single');
+  }
+
+  get recipientOptions() {
+    return this.page.locator('#recipient_id_chosen .chosen-results li');
+  }
+
+  async selectRecipient(name: string) {
+    await this.recipientDropdown.click();
+
+    await this.recipientOptions.filter({ hasText: name }).click();
+  }
+
+  get senderName() {
+    return this.page
+      .locator('tr.prop')
+      .filter({ hasText: 'From' })
+      .locator('td.value');
+  }
+}
+
+export default AddCommentToPutawayPage;

src/pages/putaway/putawayDetails/PutawayDetailsPage.ts

@@ -4,6 +4,7 @@ import FileHandler from '@/components/FileHandler';
 import BasePageModel from '@/pages/BasePageModel';
 
 import AuditingTable from './components/AuditingTable';
+import CommentsTable from './components/CommentsTable';
 import ItemDetailsTable from './components/ItemDetailsTable';
 import ItemStatusTable from './components/ItemStatusTable';
 import OrderHeaderTable from './components/OrderHeaderTable';
@@ -16,6 +17,7 @@ class PutawayDetailsPage extends BasePageModel {
   itemDetailsTable: ItemDetailsTable;
   auditingTable: AuditingTable;
   fileHandler: FileHandler;
+  commentsTable: CommentsTable;
 
   constructor(page: Page) {
     super(page);
@@ -25,6 +27,7 @@ class PutawayDetailsPage extends BasePageModel {
     this.itemDetailsTable = new ItemDetailsTable(page);
     this.auditingTable = new AuditingTable(page);
     this.fileHandler = new FileHandler(page);
+    this.commentsTable = new CommentsTable(page);
   }
 
   async isLoaded() {
@@ -127,6 +130,20 @@ class PutawayDetailsPage extends BasePageModel {
     this.page.once('dialog', (dialog) => dialog.accept());
     await this.actionsDeleteButton.click();
   }
+
+  get badgeCount() {
+    return this.page.locator('li.tab-badge');
+  }
+
+  get spinner() {
+    return this.page.locator('.loading');
+  }
+
+  async waitUntilSpinnerHides() {
+    await this.spinner.waitFor({
+      state: 'hidden',
+    });
+  }
 }
 
 export default PutawayDetailsPage;

src/pages/putaway/putawayDetails/components/CommentsTable.ts

@@ -0,0 +1,72 @@
+import { expect, Locator, Page } from '@playwright/test';
+
+import BasePageModel from '@/pages/BasePageModel';
+
+class CommentsTable extends BasePageModel {
+  constructor(page: Page) {
+    super(page);
+  }
+
+  async isLoaded() {
+    await expect(
+      this.page.getByRole('heading').getByText('Comments')
+    ).toBeVisible();
+  }
+
+  get table() {
+    return this.page.getByRole('table').filter({
+      hasText: 'Comment',
+    });
+  }
+
+  get rows() {
+    return this.table.getByRole('row');
+  }
+
+  row(index: number) {
+    return new Row(this.page, this.rows.nth(index));
+  }
+
+  getColumnHeader(columnName: string) {
+    return this.table.getByRole('row').getByText(columnName, { exact: true });
+  }
+
+  async clickDeleteCommentButton(index: number) {
+    this.page.once('dialog', (dialog) => dialog.accept());
+    await this.row(index).deleteButton.click();
+  }
+
+  get emptyCommentTable() {
+    return this.page.locator('.fade.center.empty').getByText('No comments');
+  }
+}
+
+class Row extends BasePageModel {
+  row: Locator;
+  constructor(page: Page, row: Locator) {
+    super(page);
+    this.row = row;
+  }
+
+  get commentContent() {
+    return this.row.getByRole('cell').nth(2);
+  }
+
+  get recipientContent() {
+    return this.row.getByRole('cell').nth(0);
+  }
+
+  get senderContent() {
+    return this.row.getByRole('cell').nth(1);
+  }
+
+  get editButton() {
+    return this.row.getByRole('link', { name: 'Edit', exact: true });
+  }
+
+  get deleteButton() {
+    return this.row.getByRole('link', { name: 'Delete', exact: true });
+  }
+}
+
+export default CommentsTable;

src/pages/putaway/steps/StartStep.ts

@@ -55,6 +55,12 @@ class StartStep extends BasePageModel {
   async closeDisplayedError() {
     return this.page.locator('.alert-close-icon').first().click();
   }
+
+  get orderNumberValue() {
+    return this.page.locator(
+      '[data-testid=\'wizardTitle\'] > div > span:nth-of-type(2)'
+    );
+  }
 }
 
 export default StartStep;