Add E2E testing

.gitignore

@@ -2,7 +2,14 @@ target
 .idea
 *.iml
 .DS_Store
-node_modules
+
+.env
+node_modules/
+test-results/
+playwright-report/
+blob-report/
+playwright/.cache/
+
 *.bat
 
 react-app/build

e2e/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "e2e",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {},
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "@playwright/test": "^1.40.0",
+    "@types/node": "^20.10.0"
+  },
+  "dependencies": {
+    "dotenv": "^16.3.1"
+  }
+}

e2e/playwright.config.js

@@ -0,0 +1,57 @@
+// @ts-check
+const { defineConfig, devices } = require('@playwright/test');
+
+require('dotenv').config();
+
+/**
+ * @see https://playwright.dev/docs/test-configuration
+ */
+module.exports = defineConfig({
+  testDir: './tests',
+
+  /* Maximum time one test can run for. */
+  timeout: 1 * 60 * 1000,
+
+  expect: {
+
+    /**
+     * Maximum time expect() should wait for the condition to be met.
+     * For example in `await expect(locator).toHaveText();`
+     *
+     * note: waiting longer on CI
+     */
+    timeout: process.env.CI ? 40 * 1000 : 5 * 1000
+  },
+
+  /* Run tests in files in parallel */
+  fullyParallel: false,
+  /* Fail the build on CI if you accidentally left test.only in the source code. */
+  forbidOnly: !!process.env.CI,
+  /* Retry on CI only */
+  retries: process.env.CI ? 1 : 0,
+  /* Opt out of parallel tests on CI. */
+  workers: process.env.CI ? 1 : undefined,
+  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+  reporter: 'html',
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    baseURL: process.env.URL || 'http://localhost:3000',
+
+    /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
+    actionTimeout: 40 * 1000,
+
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: 'on-first-retry',
+  },
+
+  /* Configure projects for major browsers */
+  projects: [
+    {
+      name: 'chromium',
+      use: { ...devices['Desktop Chrome'] },
+    },
+  ],
+
+});
+

e2e/tests/dashboard.spec.js

@@ -0,0 +1,22 @@
+// @ts-check
+const { test, expect } = require('@playwright/test');
+const utils = require('./utils');
+
+test('Dashboard', async ({ page }) => {
+  await page.goto('/');
+  await expect(page).toHaveTitle(/AfP MyPlatform/);
+
+  await page.goto('/login');
+  await expect(page.locator('text="Login"')).toBeVisible();
+  // perform login
+  await page.fill('input[name="username"]', utils.USERNAME);
+  await page.fill('input[name="password"]', "123");
+  await page.getByRole('button', { name: 'Submit' }).click();
+
+  await expect(page.locator('text="Dashboard"')).toBeVisible();
+  await expect(page.locator('text="Status"')).toBeVisible();
+
+  await page.goto('/products');
+  await expect(page.locator('text="My Products"')).toBeVisible();
+});
+

e2e/tests/home.spec.js

@@ -0,0 +1,39 @@
+// @ts-check
+const { test, expect } = require('@playwright/test');
+
+test('Homepage', async ({ page }) => {
+  await page.goto('/');
+  await expect(page).toHaveTitle(/AfP MyPlatform/);
+});
+
+test('Goto Signup', async ({ page }) => {
+  await page.goto('/');
+  await expect(page).toHaveTitle(/AfP MyPlatform/);
+
+  await page.goto('/signup');
+  await expect(page.locator('text="Create an account"')).toBeVisible();
+});
+
+test('Goto Login', async ({ page }) => {
+  await page.goto('/');
+  await expect(page).toHaveTitle(/AfP MyPlatform/);
+
+  await page.goto('/login');
+  await expect(page.locator('text="Login"')).toBeVisible();
+});
+
+test('Invalid Login', async ({ page }) => {
+  await page.goto('/');
+  await expect(page).toHaveTitle(/AfP MyPlatform/);
+
+  await page.goto('/login');
+  await expect(page.locator('text="Login"')).toBeVisible();
+
+  await page.fill('input[name="username"]', "Unknown");
+  await page.fill('input[name="password"]', "123");
+  await page.getByRole('button', { name: 'Submit' }).click();
+
+  await expect(page.locator('text="Invalid credentials"')).toBeVisible();
+
+});
+

e2e/tests/utils.js

@@ -0,0 +1,8 @@
+const dotenv = require('dotenv');
+
+dotenv.config();
+
+module.exports = {
+    // valid AccountHolder id
+    USERNAME: process.env.AFP_USERNAME,
+};