diff --git a/src/orders-and-subscriptions/OrdersAndSubscriptionsPage.test.jsx b/src/orders-and-subscriptions/OrdersAndSubscriptionsPage.test.jsx index 232126d17..30e90ad24 100644 --- a/src/orders-and-subscriptions/OrdersAndSubscriptionsPage.test.jsx +++ b/src/orders-and-subscriptions/OrdersAndSubscriptionsPage.test.jsx @@ -14,24 +14,62 @@ const { queryByTestId, } = screen; -const testHeadings = (hasSections = true) => { - // Assert the main heading - expect(getByText('My orders and subscriptions')).toBeInTheDocument(); - expect( - getByText('Manage your program subscriptions and view your order history.'), - ).toBeInTheDocument(); - - if (hasSections) { +const testHeadings = (hasSections = true, hasSubscriptions = true) => { + if (hasSections && hasSubscriptions) { + // Assert the main heading is present + expect(getByText('My orders and subscriptions')).toBeInTheDocument(); + expect( + getByText('Manage your program subscriptions and view your order history.'), + ).toBeInTheDocument(); // Assert Subscription and Order History sections are rendered expect(getByText('Subscriptions')).toBeInTheDocument(); expect(getByText('Order History')).toBeInTheDocument(); - } else { - // Assert Subscription and Order History sections are not rendered + } else if (!hasSections && !hasSubscriptions) { + // Assert only Order History section is rendered + expect(queryByText('My orders and subscriptions')).toBeNull(); + expect( + queryByText('Manage your program subscriptions and view your order history.'), + ).toBeNull(); + expect(getByText('Order History')).toBeInTheDocument(); + expect(queryByText('Subscriptions')).toBeNull(); + } +}; + +const testHeadingsLoading = (hasSections = true, hasSubscriptions = true) => { + if (!hasSections && !hasSubscriptions) { + // Assert loading, nothing is rendered + expect(queryByText('My orders and subscriptions')).toBeNull(); + expect( + queryByText('Manage your program subscriptions and view your order history.'), + ).toBeNull(); expect(queryByText('Subscriptions')).toBeNull(); expect(queryByText('Order History')).toBeNull(); } }; +const testHeadingsError = (hasSections = true, hasSubscriptions = true) => { + if (!hasSections && !hasSubscriptions) { + // Error with no subscriptions + // Assert only Order History sections is rendered + expect(queryByText('My orders and subscriptions')).toBeNull(); + expect( + queryByText('Manage your program subscriptions and view your order history.'), + ).toBeNull(); + expect(queryByText('Subscriptions')).toBeNull(); + expect(getByText('Order History')).toBeInTheDocument(); + } else if (hasSections && hasSubscriptions) { + // Error but has subscriptions + // Assert the main heading is present + expect(getByText('My orders and subscriptions')).toBeInTheDocument(); + expect( + getByText('Manage your program subscriptions and view your order history.'), + ).toBeInTheDocument(); + // Assert Subscription and Order History sections are rendered + expect(getByText('Subscriptions')).toBeInTheDocument(); + expect(getByText('Order History')).toBeInTheDocument(); + } +}; + describe('', () => { describe('Renders correctly in various states', () => { it('renders with orders and subscriptions', () => { @@ -42,7 +80,23 @@ describe('', () => { expect(queryByTestId('basic-alert')).toBeNull(); }); - it('renders alerts on errors', () => { + it('renders with orders only', () => { + const ordersOnlyMocks = { + orderHistory: { + ...storeMocks.orderHistory, + }, + subscriptions: { + ...emptyStoreMocks.subscriptions, + }, + }; + render(, ordersOnlyMocks); + testHeadings(false, false); + + // Assert alerts are not rendered + expect(queryByTestId('basic-alert')).toBeNull(); + }); + + it('renders alerts on errors no subscriptions', () => { const storeMocksWithErrors = { orderHistory: { ...emptyStoreMocks.orderHistory, @@ -55,13 +109,34 @@ describe('', () => { }; render(, storeMocksWithErrors); - testHeadings(); + testHeadingsError(false, false); expect(getByTestId('basic-alert')).toBeInTheDocument(); // Assert Subscription section renders empty state expect(queryByTestId('section-subscription-cards')).toBeNull(); - expect(getByTestId('section-subscription-upsell')).toBeInTheDocument(); + expect(queryByTestId('section-subscription-upsell')).toBeNull(); + }); + + it('renders alerts on errors with subscriptions', () => { + const storeMocksWithErrors = { + orderHistory: { + ...emptyStoreMocks.orderHistory, + loadingError: true, + }, + subscriptions: { + ...storeMocks.subscriptions, + loadingError: false, + }, + }; + + render(, storeMocksWithErrors); + testHeadingsError(true, true); + + expect(getByTestId('basic-alert')).toBeInTheDocument(); + + expect(getByTestId('section-subscription-cards')).toBeInTheDocument(); + expect(queryByTestId('section-subscription-upsell')).toBeNull(); }); it('renders with loading', () => { @@ -77,10 +152,10 @@ describe('', () => { }; render(, storeMocksWithLoading); - testHeadings(false); + testHeadingsLoading(false, false); // Assert loading message is rendered - expect(getByText('Loading orders and subscriptions...')) + expect(getByText('Loading orders...')) .toBeInTheDocument(); // Assert alerts are not rendered