Playwright test for input validatiojn (#577)

* feature: Added input validation when creating and editing a community (#172) * feature: Added input validation when creating and editing a community * feature: Added input validation when creating and editing a community * feature: Added input validation when creating and editing a community * test: Added test for input validation
NEAR-DevHub · Dec 19, 2023 · 6f63831 · 6f63831
1 parent 07e5583
commit 6f63831
Show file tree

Hide file tree

Showing 2 changed files with 93 additions and 0 deletions.
diff --git a/playwright-tests/testUtils.js b/playwright-tests/testUtils.js
@@ -17,3 +17,8 @@ export const waitForSelectorToBeVisible = async (page, selector) => {
     state: "visible",
   });
 };
+
+export const clickWhenSelectorIsVisible = async (page, selector) => {
+  waitForSelectorToBeVisible(page, selector);
+  await page.click(selector);
+};
diff --git a/playwright-tests/tests/communities.spec.js b/playwright-tests/tests/communities.spec.js
@@ -1,3 +1,9 @@
+import {
+  setInputAndAssert,
+  clickWhenSelectorIsVisible,
+  waitForSelectorToBeVisible,
+} from "../testUtils";
+
 const { test, expect } = require("@playwright/test");
 
 test.describe("Wallet is connected", () => {
@@ -20,8 +26,90 @@ test.describe("Wallet is connected", () => {
     const communitySpawnerSelector = 'div:has-text("Community information")';
     await page.waitForSelector(communitySpawnerSelector, { state: "visible" });
   });
+
+  test("should validate input when user is creating a new community", async ({
+    page,
+  }) => {
+    await page.goto("/devgovgigs.near/widget/app?page=communities");
+
+    await clickWhenSelectorIsVisible(
+      page,
+      'button:has-text("Create Community")'
+    );
+
+    await waitForSelectorToBeVisible(
+      page,
+      'div:has-text("Community information")'
+    );
+
+    // missing title
+    await expectInputValidation(
+      page,
+      "",
+      "The description",
+      "the-url-handle",
+      "the-tag",
+      false
+    );
+
+    // missing description
+    await expectInputValidation(
+      page,
+      "The title",
+      "",
+      "the-url-handle",
+      "the-tag",
+      false
+    );
+
+    // missing URL handle
+    await expectInputValidation(
+      page,
+      "The title",
+      "The description",
+      "",
+      "the-tag",
+      false
+    );
+
+    // missing tag
+    await expectInputValidation(
+      page,
+      "The title",
+      "The description",
+      "the-url-handle",
+      "",
+      false
+    );
+
+    // valid input
+    await expectInputValidation(
+      page,
+      "The title",
+      "The description",
+      "the-url-handle",
+      "the-tag",
+      true
+    );
+  });
 });
 
+const expectInputValidation = async (
+  page,
+  title,
+  description,
+  urlHandle,
+  tag,
+  valid
+) => {
+  await setInputAndAssert(page, 'input[aria-label="Name"]', title);
+  await setInputAndAssert(page, 'input[aria-label="Description"]', description);
+  await setInputAndAssert(page, 'input[aria-label="URL handle"]', urlHandle);
+  await setInputAndAssert(page, 'input[aria-label="Tag"]', tag);
+
+  expect(await page.isEnabled('button:has-text("Launch")')).toBe(valid);
+};
+
 test.describe("Wallet is not connected", () => {
   test.use({
     storageState: "playwright-tests/storage-states/wallet-not-connected.json",