test: 14609 - playwright test for adding adding a row and editing a codelist for org

frontend/testing/playwright/pages/OrgLibraryPage/CodeLists.ts

@@ -50,28 +50,28 @@ export class CodeLists extends BasePage {
       .click();
   }
 
-  public async verifyAlternativeRowIsVisible(row: number): Promise<void> {
-    const alternativeRow = this.page.getByRole('textbox', {
-      name: this.textMock('code_list_editor.value_item', { number: row.toString() }),
+  public async verifyNewItemValueFieldIsVisible(itemNumber: number): Promise<void> {
+    const newItemValueField = this.page.getByRole('textbox', {
+      name: this.textMock('code_list_editor.value_item', { number: itemNumber.toString() }),
       exact: true,
     });
 
-    await expect(alternativeRow).toBeVisible();
+    await expect(newItemValueField).toBeVisible();
   }
 
-  public async writeCodelistValue(row: number, value: string): Promise<void> {
+  public async writeCodelistValue(itemNumber: number, value: string): Promise<void> {
     await this.page
       .getByRole('textbox', {
-        name: this.textMock('code_list_editor.value_item', { number: row.toString() }),
+        name: this.textMock('code_list_editor.value_item', { number: itemNumber.toString() }),
         exact: true,
       })
       .fill(value);
   }
 
-  public async writeCodelistLabel(row: number, label: string): Promise<void> {
+  public async writeCodelistLabel(itemNumber: number, label: string): Promise<void> {
     await this.page
       .getByRole('textbox', {
-        name: this.textMock('code_list_editor.label_item', { number: row.toString() }),
+        name: this.textMock('code_list_editor.label_item', { number: itemNumber.toString() }),
       })
       .fill(label);
   }
@@ -94,6 +94,14 @@ export class CodeLists extends BasePage {
     await expect(codeList).toBeVisible();
   }
 
+  public async clickOnAddItemButton(): Promise<void> {
+    await this.page
+      .getByRole('button', {
+        name: this.textMock('code_list_editor.add_option'),
+      })
+      .click();
+  }
+
   public async clickOnCodeListAccordion(codeListTitle: string): Promise<void> {
     await this.page.getByRole('heading', { name: codeListTitle }).click();
   }
@@ -114,12 +122,35 @@ export class CodeLists extends BasePage {
       .click();
   }
 
-  private async clickOnUploadCodelistButton(): Promise<void> {
-    await this.page
-      .getByRole('button', {
-        name: this.textMock('app_content_library.code_lists.upload_code_list'),
-      })
-      .click();
+  public async verifyEmptyValueTextfield(itemNumber: number): Promise<void> {
+    this.verifyValueTextfield(itemNumber, '');
+  }
+
+  public async verifyEmptyLabelTextfield(itemNumber: number): Promise<void> {
+    const textfield = this.page.getByRole('textbox', {
+      name: this.textMock('code_list_editor.value_item', { number: itemNumber.toString() }),
+      exact: true,
+    });
+
+    await expect(textfield).toHaveValue('');
+  }
+
+  public async verifyValueTextfield(itemNumber: number, value: string): Promise<void> {
+    const textfield = this.page.getByRole('textbox', {
+      name: this.textMock(`code_list_editor.value_item`, { number: itemNumber.toString() }),
+      exact: true,
+    });
+
+    await expect(textfield).toHaveValue(value);
+  }
+
+  public async verifyLabelTextfield(itemNumber: number, value: string): Promise<void> {
+    const textfield = this.page.getByRole('textbox', {
+      name: this.textMock(`code_list_editor.label_item`, { number: itemNumber.toString() }),
+      exact: true,
+    });
+
+    await expect(textfield).toHaveValue(value);
   }
 
   public async clickOnUploadButtonAndSelectFileToUpload(fileName: string): Promise<void> {
@@ -151,8 +182,8 @@ export class CodeLists extends BasePage {
     await expect(codeList).toBeHidden();
   }
 
-  public async verifyNumberOfRowsInTheCodelist(
-    numberOfRows: number,
+  public async verifyNumberOfItemsInTheCodelist(
+    numberOfItems: number,
     codeListTitle: string,
   ): Promise<void> {
     const accordionTitle = this.page.getByRole('heading', { name: codeListTitle });
@@ -161,8 +192,16 @@ export class CodeLists extends BasePage {
     const rows = table.getByRole('row');
 
     const headerRow: number = 1;
-    const totalNumberOfRows: number = numberOfRows + headerRow;
+    const totalNumberOfRows: number = numberOfItems + headerRow;
 
     await expect(rows).toHaveCount(totalNumberOfRows);
   }
+
+  private async clickOnUploadCodelistButton(): Promise<void> {
+    await this.page
+      .getByRole('button', {
+        name: this.textMock('app_content_library.code_lists.upload_code_list'),
+      })
+      .click();
+  }
 }

frontend/testing/playwright/tests/org-library/create-codelists.spec.ts → frontend/testing/playwright/tests/org-library/codelists.spec.ts

@@ -10,7 +10,9 @@ const TEST_ORG: string = 'ttd';
 const CODELIST_TITLE_MANUALLY: string = 'Test_codelist';
 const CODELIST_TITLE_UPLOADED: string = 'testCodelist';
 
-const EXPECTED_NUMBER_OF_ROWS_IN_MANUALLY_CODELIST: number = 1;
+const EXPECTED_NUMBER_OF_ITEMS_IN_MANUALLY_CREATED_CODELIST: number = 1;
+const EXPECTED_NUMBER_OF_ROWS_IN_MANUALLY_CODELIST_AFTER_ADDING_ROW: number =
+  EXPECTED_NUMBER_OF_ITEMS_IN_MANUALLY_CREATED_CODELIST + 1;
 const EXPECTED_NUMBER_OF_ROWS_IN_UPLOADED_CODELIST: number = 3;
 
 test.describe.configure({ mode: 'serial' });
@@ -51,31 +53,65 @@ test('that it is possible to create a new codelist', async ({ page, testAppName
   await orgLibraryPage.codeLists.writeCodelistTitle(CODELIST_TITLE_MANUALLY);
   await orgLibraryPage.codeLists.clickOnAddAlternativeButton();
 
-  await orgLibraryPage.codeLists.verifyAlternativeRowIsVisible(
-    EXPECTED_NUMBER_OF_ROWS_IN_MANUALLY_CODELIST,
+  await orgLibraryPage.codeLists.verifyNewItemValueFieldIsVisible(
+    EXPECTED_NUMBER_OF_ITEMS_IN_MANUALLY_CREATED_CODELIST,
   );
   const firstRowValue: string = 'First value';
   await orgLibraryPage.codeLists.writeCodelistValue(
-    EXPECTED_NUMBER_OF_ROWS_IN_MANUALLY_CODELIST,
+    EXPECTED_NUMBER_OF_ITEMS_IN_MANUALLY_CREATED_CODELIST,
     firstRowValue,
   );
   const firstRowLabel: string = 'First label';
   await orgLibraryPage.codeLists.writeCodelistLabel(
-    EXPECTED_NUMBER_OF_ROWS_IN_MANUALLY_CODELIST,
+    EXPECTED_NUMBER_OF_ITEMS_IN_MANUALLY_CREATED_CODELIST,
     firstRowLabel,
   );
 
   await orgLibraryPage.codeLists.clickOnSaveCodelistButton();
   await orgLibraryPage.codeLists.verifyThatCodeListIsVisible(CODELIST_TITLE_MANUALLY);
 });
 
+test('that it is possible to add a new row to an existing codelist and modify the fields in the row', async ({
+  page,
+  testAppName,
+}) => {
+  const orgLibraryPage: OrgLibraryPage = await setupAndVerifyCodeListPage(page, testAppName);
+
+  await orgLibraryPage.codeLists.verifyThatCodeListIsVisible(CODELIST_TITLE_MANUALLY);
+  await orgLibraryPage.codeLists.clickOnCodeListAccordion(CODELIST_TITLE_MANUALLY);
+
+  await orgLibraryPage.codeLists.verifyNumberOfItemsInTheCodelist(
+    EXPECTED_NUMBER_OF_ITEMS_IN_MANUALLY_CREATED_CODELIST,
+    CODELIST_TITLE_MANUALLY,
+  );
+
+  await orgLibraryPage.codeLists.clickOnAddItemButton();
+  await orgLibraryPage.codeLists.verifyNumberOfItemsInTheCodelist(
+    EXPECTED_NUMBER_OF_ROWS_IN_MANUALLY_CODELIST_AFTER_ADDING_ROW,
+    CODELIST_TITLE_MANUALLY,
+  );
+
+  const lastlyAddedItemNumber: number =
+    EXPECTED_NUMBER_OF_ROWS_IN_MANUALLY_CODELIST_AFTER_ADDING_ROW;
+  await orgLibraryPage.codeLists.verifyEmptyValueTextfield(lastlyAddedItemNumber);
+  await orgLibraryPage.codeLists.verifyEmptyLabelTextfield(lastlyAddedItemNumber);
+
+  const value: string = 'value';
+  await orgLibraryPage.codeLists.writeCodelistValue(lastlyAddedItemNumber, value);
+  await orgLibraryPage.codeLists.verifyValueTextfield(lastlyAddedItemNumber, value);
+
+  const label: string = 'label';
+  await orgLibraryPage.codeLists.writeCodelistLabel(lastlyAddedItemNumber, label);
+  await orgLibraryPage.codeLists.verifyLabelTextfield(lastlyAddedItemNumber, label);
+});
+
 test('that it is possible to upload a new codelist', async ({ page, testAppName }) => {
   const orgLibraryPage: OrgLibraryPage = await setupAndVerifyCodeListPage(page, testAppName);
 
   const codelistFileName: string = `${CODELIST_TITLE_UPLOADED}.json`;
   await orgLibraryPage.codeLists.clickOnUploadButtonAndSelectFileToUpload(codelistFileName);
   await orgLibraryPage.codeLists.verifyThatCodeListIsVisible(CODELIST_TITLE_UPLOADED);
-  await orgLibraryPage.codeLists.verifyNumberOfRowsInTheCodelist(
+  await orgLibraryPage.codeLists.verifyNumberOfItemsInTheCodelist(
     EXPECTED_NUMBER_OF_ROWS_IN_UPLOADED_CODELIST,
     CODELIST_TITLE_UPLOADED,
   );
@@ -91,7 +127,7 @@ test('that it is possible to search for and delete the new codelists', async ({
   await deleteAndVerifyDeletionOfCodeList(
     orgLibraryPage,
     CODELIST_TITLE_MANUALLY,
-    EXPECTED_NUMBER_OF_ROWS_IN_MANUALLY_CODELIST,
+    EXPECTED_NUMBER_OF_ROWS_IN_MANUALLY_CODELIST_AFTER_ADDING_ROW,
   );
 
   await searchForAndOpenCodeList(orgLibraryPage, CODELIST_TITLE_UPLOADED);
@@ -116,7 +152,7 @@ const deleteAndVerifyDeletionOfCodeList = async (
   codelistTitle: string,
   expectedNumberOfRowsInCodeList: number,
 ): Promise<void> => {
-  await orgLibraryPage.codeLists.verifyNumberOfRowsInTheCodelist(
+  await orgLibraryPage.codeLists.verifyNumberOfItemsInTheCodelist(
     expectedNumberOfRowsInCodeList,
     codelistTitle,
   );