Use fixtures and useMocks option to set up mocks

Author: daiscog

eslint.config.mjs

@@ -13,7 +13,7 @@ export default [
       '@nx/enforce-module-boundaries': [
         'error',
         {
-          enforceBuildableLibDependency: true,
+          enforceBuildableLibDependency: false,
           allow: ['^.*/eslint(\\.base)?\\.config\\.[cm]?js$'],
           depConstraints: [
             {

libs/transactions-journey/e2e-tests/fixture/transaction.ts

@@ -1,39 +1,32 @@
 import { test as baseTest } from '@playwright/test';
-import {
-  TransactionFixture,
-  TransactionsListDataType,
-  TransactionDetailsDataType,
-} from '../model';
+import { TransactionFixture } from '../model';
 import { TransactionDetailsPage, TransactionsPage } from '../page-objects';
-import {
-  addTransactionsToMock,
-  defaultTransactionsMock,
-  setupPageMocks,
-} from '../mocks';
+import { defaultTransactionsMock, setupPageMocks } from '../mocks';
 import { MakeTransferPage } from '../page-objects/pages/make-transfer';
 
 export const test = baseTest.extend<TransactionFixture>({
-  // mocks data setup, can be overridden or bypassed via "useMocks"
-  transactionMockSetup: async ({ page }, use) =>
-    await use((transactions: Partial<TransactionDetailsDataType>[]) =>
-      setupPageMocks(page, addTransactionsToMock(transactions))
-    ),
-  transactionsMockSetup: async ({ page }, use) =>
-    use((transactions: TransactionsListDataType) =>
-      setupPageMocks(page, defaultTransactionsMock)
-    ),
+  // TODO: Is this being used? Delete if not
   makeTransferPage: async ({ page, baseURL }, use) => {
     await use(new MakeTransferPage(page, { baseURL, url: '/make-transfer' }));
   },
-  transactionDetailsPage: async ({ page, baseURL }, use) => {
+
+  transactionDetailsPage: async ({ page, baseURL, useMocks }, use) => {
+    if (useMocks) {
+      setupPageMocks(page, defaultTransactionsMock);
+    }
+
     await use(
       new TransactionDetailsPage(page, {
         baseURL,
         url: '/transactions/{id}',
       })
     );
   },
-  transactionsPage: async ({ page, baseURL }, use) => {
+
+  transactionsPage: async ({ page, baseURL, useMocks }, use) => {
+    if (useMocks) {
+      setupPageMocks(page, defaultTransactionsMock);
+    }
     await use(new TransactionsPage(page, { baseURL, url: '/transactions' }));
   },
 });

libs/transactions-journey/e2e-tests/mocks/index.ts

@@ -42,23 +42,3 @@ export function setupPageMocks(page: Page, mocks: Record<string, unknown>) {
     }
   });
 }
-
-export function addTransactionsToMock(
-  transactions: Partial<TransactionDetailsDataType>[]
-) {
-  for (const transaction of transactions) {
-    const transactionsList = loadMockFile<{ id: string }[]>(
-      './transactions-list.json'
-    );
-    const newTransaction = createTransactionDetailsForMock(transaction);
-    const existingIndex = transactionsList.findIndex(
-      (t) => t.id === newTransaction.id
-    );
-    const indexToUpdate =
-      existingIndex >= 0 ? existingIndex : transactionsList.length;
-    transactionsList[indexToUpdate] = newTransaction;
-    writeMockFile('./transactions-list.json', transactionsList);
-  }
-
-  return defaultTransactionsMock;
-}

libs/transactions-journey/e2e-tests/model/transaction.ts

@@ -35,15 +35,10 @@ export interface TransactionDetailsDataType {
 
 export interface TransactionFixture {
   visual: VisualValidator;
-  transactionMockSetup: (
-    transactions: Partial<TransactionDetailsDataType>[]
-  ) => void | Promise<void>;
-  transactionsMockSetup: (
-    transaction: TransactionsListDataType
-  ) => void | Promise<void>;
   makeTransferPage: MakeTransferPage;
   transactionDetailsPage: TransactionDetailsPage;
   transactionsPage: TransactionsPage;
+  useMocks: boolean;
 }
 
 export const getAmountValue = (

libs/transactions-journey/e2e-tests/specs/transaction-details.spec.ts

@@ -22,10 +22,6 @@ export function testTransactionDetails(
       ],
     },
     () => {
-      test.beforeEach(async ({ transactionMockSetup }) => {
-        await transactionMockSetup(testData.transactions);
-      });
-
       for (const transaction of testData.transactions) {
         test(`[getDetails] should display correct transaction details (id: ${transaction.id}; name: ${transaction.recipient})`, async ({
           transactionDetailsPage,

libs/transactions-journey/e2e-tests/specs/transactions-list.spec.ts

@@ -10,8 +10,7 @@ export function testTransactionsList(
     'Transactions list',
     { tag: ['@e2e', '@transactions', '@transactions-details', '@mocks'] },
     () => {
-      test.beforeEach(async ({ transactionsPage, transactionsMockSetup }) => {
-        await transactionsMockSetup(testData.transactionList);
+      test.beforeEach(async ({ transactionsPage }) => {
         await transactionsPage.open();
       });