Merge branch 'main' into feature/bundle-journeys-by-domain

README.md

@@ -15,9 +15,13 @@ This golden sample provides examples of the code structure, configuration, and b
   - [Generate an application](#generate-an-application)
   - [Generate a library](#generate-a-library)
   - [Load app on a development server](#load-app-on-a-development-server)
+  - [User credentials](#user-credentials)
+  - [Running the app with Mocks](#running-the-app-with-mocks)
   - [Code scaffolding](#code-scaffolding)
   - [Build](#build)
   - [Tests](#tests)
+    - [Running unit tests](#running-unit-tests)
+    - [Running end-to-end tests](#running-end-to-end-tests)
   - [Understand your workspace](#understand-your-workspace)
   - [Running with docker](#running-with-docker)
   - [Package as a runnable Docker container](#package-as-a-runnable-docker-container)
@@ -140,15 +144,22 @@ To build the app to production, use the `--prod` flag.
 
 ## Tests
 
-- Running unit tests
+### Running unit tests
 
 Run `ng test my-app` to execute the unit tests via [Jest](https://jestjs.io).
 
 Run `nx affected:test` to execute the unit tests affected by a change.
 
-- Running end-to-end tests
+### Running end-to-end tests
 
-Run `npx playwright test`
+Run `npm run e2e` to run the default e2e tests suite that runs on the CI.
+
+Use one of the following commands to run a different set of tests:
+
+- `npm run e2e-test-mocks` - run all the tests against mocks data,
+- `npm run e2e-test-sndbx-all` - run all the tests against sandbox env,
+- `npm run e2e-test-sndbx-ci` - run sandbox CI tests suite,
+- `npm run e2e-test-responsive` - run only visual mobile tests.
 
 ## Understand your workspace
 

apps/golden-sample-app-e2e/config/ebp-sndbx.config.json

@@ -0,0 +1,11 @@
+{
+  "headerKey": "x-sdbxaz-api-key",
+  "headerValue": "apisandbox-d0d8278f-5fc5-46fb-5fc5-d0b6e1cc8059",
+  "users": {
+    "userWithNoContext": {
+      "username": "sdbxaz-stg-criscross",
+      "password": "GQXTZdIOsXeqBtjc",
+      "fullName": "Christopher Cross"
+    }
+  }
+}

apps/golden-sample-app-e2e/config/localhost.config.json

@@ -0,0 +1 @@
+{}

apps/golden-sample-app-e2e/data/mocks-data/index.ts

@@ -0,0 +1 @@
+export * from './transactions.mocks.api.data';

apps/golden-sample-app-e2e/data/mocks-data/transactions.mocks.api.data.ts

@@ -0,0 +1,20 @@
+import {
+  TransactionListDataType,
+  TransactionDetailDataType,
+} from '@backbase-gsa/transactions-journey/e2e-tests';
+
+export const transactionListMockData: TransactionListDataType = {
+  size: 10,
+  searchExpectations: [
+    { term: 'KLM', count: 7 },
+    { term: 'cafe', count: 3 },
+  ],
+};
+
+export const transactionDetailMocksData: TransactionDetailDataType = {
+  recipient: 'Hard Rock Cafe',
+  category: 'Alcohol & Bars',
+  description: 'Beer Bar Salt Lake',
+  status: 'BILLED',
+  id: '007jb5',
+};

apps/golden-sample-app-e2e/data/sandbox-api-data/index.ts

@@ -0,0 +1 @@
+export * from './transactions.sandbox.api.data';

apps/golden-sample-app-e2e/data/sandbox-api-data/transactions.sandbox.api.data.ts

@@ -0,0 +1,16 @@
+import {
+  TransactionListDataType,
+  TransactionDetailDataType,
+} from '@backbase-gsa/transactions-journey/e2e-tests';
+export const transactionListSandboxData: TransactionListDataType = {
+  size: 10,
+  searchExpectations: [{ term: 'pocket', count: 5 }],
+};
+
+export const transactionDetailSandboxData: TransactionDetailDataType = {
+  recipient: 'BP',
+  category: 'Gasoline/Fuel',
+  description: 'BP Global',
+  status: 'BILLED',
+  id: '8a82815f936800030193810b891452e0',
+};

apps/golden-sample-app-e2e/fixtures/transactions.fixture.ts

@@ -0,0 +1,42 @@
+import { testWithAuth as baseTest } from '../page-objects/test-runner';
+import { mergeTests } from '@playwright/test';
+import {
+  TransactionFixture,
+  test as transferTest,
+} from '@backbase-gsa/transactions-journey/e2e-tests';
+import {
+  transactionDetailMocksData,
+  transactionListMockData,
+} from '../data/mocks-data';
+import {
+  transactionDetailSandboxData,
+  transactionListSandboxData,
+} from '../data/sandbox-api-data';
+import { TestEnvironment } from 'test.model';
+
+// Transactions test data per Env type
+const testData: Partial<
+  Record<TestEnvironment, Pick<TransactionFixture, 'detailsData' | 'listData'>>
+> = {
+  // Mock data to run tests against mocks
+  [TestEnvironment.MOCKS]: {
+    detailsData: transactionDetailMocksData,
+    listData: transactionListMockData,
+  },
+  // Sandbox data to run tests against sandbox env
+  [TestEnvironment.SANDBOX]: {
+    detailsData: transactionDetailSandboxData,
+    listData: transactionListSandboxData,
+  },
+};
+
+export const test = mergeTests(
+  baseTest,
+  transferTest
+).extend<TransactionFixture>({
+  // overrode default data based on environment config
+  detailsData: async ({ env }, use) => await use(testData[env]!.detailsData),
+  listData: async ({ env }, use) => await use(testData[env]!.listData),
+  // type of the user
+  userType: 'userWithNoContext',
+});

apps/golden-sample-app-e2e/page-objects/test-runner.ts

@@ -2,13 +2,19 @@ import { test as baseTest } from '@playwright/test';
 import { VisualValidator } from '../utils/visual-validator';
 import { IdentityPage } from './pages/identity-page';
 import { testConfig } from '../test-config';
+import { User } from '../data/data-types/user';
+import { readFile } from '../utils/read-file';
 import 'dotenv/config';
+import { TestEnvironment, TestOptions } from '../../../test.model';
 
-export const test = baseTest.extend<{
-  // Pages
+interface TestRunnerOptions extends TestOptions {
   identityPage: IdentityPage;
   visual: VisualValidator;
-}>({
+  config: { users: Record<string, User> };
+  env: TestEnvironment;
+}
+
+export const test = baseTest.extend<TestRunnerOptions>({
   identityPage: async ({ page }, use, testInfo) => {
     await use(
       new IdentityPage(page, testInfo, { url: testConfig.appBaseUrl() })
@@ -17,4 +23,31 @@ export const test = baseTest.extend<{
   visual: async ({ page }, use) => {
     await use(new VisualValidator(page));
   },
+  configPath: ['', { option: true }],
+  config: async ({ configPath }, use) => {
+    await use(configPath ? readFile(configPath) : { users: {} });
+  },
+  testEnvironment: [TestEnvironment.MOCKS, { option: true }],
+  env: async ({ testEnvironment }, use) => {
+    await use(testEnvironment);
+  },
+});
+
+export const testWithAuth = test.extend<{
+  // Authentication
+  userType: string;
+  user: User;
+}>({
+  userType: ['', { option: true }],
+  user: async ({ config, userType }, use) => {
+    await use(config.users[userType]);
+  },
+  storageState: async ({ page, identityPage, user, baseURL }, use) => {
+    if (user) {
+      await identityPage.login(user);
+      await page.goto(baseURL ?? '');
+      await page.waitForTimeout(1000);
+    }
+    await use({ cookies: [], origins: [] });
+  },
 });

apps/golden-sample-app-e2e/project.json

@@ -3,13 +3,54 @@
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
   "projectType": "application",
   "tags": [],
-  "implicitDependencies": ["golden-sample-app"],
+  "implicitDependencies": [
+    "golden-sample-app"
+  ],
   "targets": {
     "e2e-chrome-mobile": {
       "executor": "nx:run-commands",
       "options": {
         "command": "npx playwright test --project 'mobile-chrome' --grep '@visual.+@responsive|@responsive.+@visual' --workers=2"
       }
+    },
+    "e2e-localhost-ebp-sndbx": {
+      "executor": "@dot-build/serve-and-run-angular:run",
+      "options": {
+        "devServerTarget": "golden-sample-app:serve:ebp-sndbox",
+        "command": "npx playwright",
+        "args": [
+          "test",
+          "--config=playwright.localhost.config.ts",
+          "--project=localhost-ebp-sndbx",
+          "--grep='@e2e'",
+          "--grep-invert='@error-handling'"
+        ]
+      }
+    },
+    "e2e-localhost-mocks": {
+      "executor": "@dot-build/serve-and-run-angular:run",
+      "options": {
+        "devServerTarget": "golden-sample-app:serve:mocks",
+        "command": "npx playwright",
+        "args": [
+          "test",
+          "--config=playwright.localhost.config.ts",
+          "--project=localhost-mocked",
+          "--grep='@e2e'",
+          "--grep-invert='@identity'"
+        ]
+      }
+    },
+    "e2e-modelbank-stg": {
+      "executor": "@dot-build/serve-and-run-angular:run",
+      "options": {
+        "command": "npx playwright",
+        "args": [
+          "test",
+          "--config=playwright.modelbank.config.ts",
+          "--project=remote-bus-stg"
+        ]
+      }
     }
   }
-}
+}

apps/golden-sample-app-e2e/specs/mb-login.spec.ts

@@ -0,0 +1,49 @@
+import { expect } from '@playwright/test';
+import { test } from '../page-objects/test-runner';
+import { wrongUser } from '../data/credentials';
+
+const i18n = {
+  identity: {
+    username: 'Username or email',
+    password: 'Password',
+    loginButton: 'Log in',
+    error:
+      'Incorrect username or passwordPlease check your details and try again',
+  },
+};
+
+test.describe.configure({ mode: 'parallel' });
+
+test.describe(
+  'Login tests',
+  { tag: ['@feature', '@i18n', '@e2e', '@identity'] },
+  () => {
+    test('Empty user name', async ({ identityPage }) => {
+      identityPage.open();
+      await test.step('Validate Input fields labels', async () => {
+        await expect
+          .soft(identityPage.userNameLabel, {
+            message: `Expect Username label: "${i18n.identity.username}"`,
+          })
+          .toHaveText(i18n.identity.username);
+        await expect
+          .soft(identityPage.passwordLabel, {
+            message: `Expect Password label: "${i18n.identity.password}"`,
+          })
+          .toHaveText(i18n.identity.password);
+      });
+      await test.step(`Fill in credentials: "${wrongUser.username}/${wrongUser.password}"`, async () => {
+        await identityPage.userName.fill(wrongUser.username);
+        await identityPage.password.fill(wrongUser.password);
+      });
+      await test.step('Try to login"', async () => {
+        await identityPage.loginButton.click();
+      });
+      await test.step('Validate Failed login error message', async () => {
+        await expect(identityPage.errorMessage, {
+          message: `Expect error message: "${i18n.identity.error}"`,
+        }).toHaveText(i18n.identity.error);
+      });
+    });
+  }
+);

apps/golden-sample-app-e2e/specs/transaction-details.spec.ts

@@ -0,0 +1,4 @@
+import { test } from '../fixtures/transactions.fixture';
+import { testTransactionDetails } from '@backbase-gsa/transactions-journey/e2e-tests';
+
+testTransactionDetails(test);

apps/golden-sample-app-e2e/specs/transactions-list.spec.ts

@@ -0,0 +1,4 @@
+import { test } from '../fixtures/transactions.fixture';
+import { testTransactionsList } from '@backbase-gsa/transactions-journey/e2e-tests';
+
+testTransactionsList(test);

apps/golden-sample-app-e2e/specs/transactions.spec.ts

@@ -1,7 +1,7 @@
 import { test } from '../page-objects/test-runner';
 
-test.beforeEach(async ({ page }) => {
-  await page.goto('transactions');
+test.beforeEach(async ({ page, baseURL }) => {
+  await page.goto(`${baseURL}/transactions`);
 });
 test.describe.configure({ mode: 'parallel' });
 

apps/golden-sample-app-e2e/utils/read-file.ts

@@ -0,0 +1,11 @@
+import fs from 'fs';
+
+export const readFile = <T>(path: string | undefined): T => {
+  if (!path) {
+    throw new Error(
+      'Failed to read config file, since path to the file provided was "undefined"'
+    );
+  }
+  const configContents = fs.readFileSync(path, 'utf-8');
+  return JSON.parse(configContents) as T;
+};