Added unit tests for cart component

final/client/src/containers/__tests__/cart-item.tsx

@@ -1,15 +1,9 @@
 import React from 'react';
 import { MockedProvider } from '@apollo/client/testing';
 import TestRenderer from 'react-test-renderer';
-import { shallow, mount } from '../../enzyme';
-const {act} = TestRenderer;
-import { render, wait, screen } from "@testing-library/react";
-
-import {
-  renderApollo,
-  cleanup,
-  waitForElement,
-} from '../../test-utils';
+import { mount } from '../../enzyme';
+import {act} from 'react-dom/test-utils';
+import { cleanup } from '../../test-utils';
 import CartItem, { GET_LAUNCH } from '../cart-item';
 
 const updateWrapper = async (wrapper, time = 0) => {
@@ -73,16 +67,13 @@ describe('cart item', () => {
 
     await updateWrapper(wrapper);
     expect(wrapper.html()).toContain('test mission');
-
-    // const p = wrapper.root.findByType('p');
-    // expect(p.children.join('')).toContain('test mission');
   });
 
-  it('should renders with error state', async() => {
+  it('should renders with error state and message', async() => {
     let mocks = [
       {
         request: { query: GET_LAUNCH, variables: { launchId: 1 } },
-        error: new Error(),
+        error: new Error("aww shucks"),
       },
     ];
 

final/client/src/pages/__tests__/cart.tsx

@@ -6,8 +6,11 @@ import {
   waitForElement,
 } from '../../test-utils';
 import Cart from '../cart';
+import {act} from 'react-dom/test-utils';
+import { MockedProvider } from '@apollo/client/testing';
 import { GET_LAUNCH } from '../../containers/cart-item';
 import { cache, cartItemsVar } from '../../cache';
+import { shallow, mount, render } from '../../enzyme';
 
 const mockLaunch = {
   __typename: 'Launch',
@@ -23,25 +26,63 @@ const mockLaunch = {
   },
 };
 
+const updateWrapper = async (wrapper, time = 0) => {
+  await act(async () => {
+    await new Promise((res) => setTimeout(res, time));
+    await wrapper.update();
+  });
+};
+
+
 describe('Cart Page', () => {
   // automatically unmount and cleanup DOM after the test is finished.
   afterEach(cleanup);
 
-  it('renders with message for empty carts', () => {
-    const { getByTestId } = renderApollo(<Cart />, { cache });
-    return waitForElement(() => getByTestId('empty-message'));
+  it('should renders with message for empty carts', async() => {
+    const wrapper = mount(
+      <MockedProvider cache={cache} addTypename={false}>
+       <Cart />
+      </MockedProvider>,
+    );
+
+    await updateWrapper(wrapper);
+    expect(wrapper.html()).toContain('No items in your cart');
+  });
+
+  it('should renders cart with Book All button', async() => {
+    let mocks = [
+      {
+        request: { query: GET_LAUNCH, variables: { launchId: '1' } },
+        result: { data: { launch: mockLaunch } },
+      },
+    ];
+
+    const wrapper = mount(
+      <MockedProvider cache={cache} mocks={mocks} addTypename={false}>
+       <Cart  />
+      </MockedProvider>,
+    );
+    cartItemsVar(['1']);
+    await updateWrapper(wrapper);
+    expect(wrapper.html()).toContain('Book All');
   });
 
-  it('renders cart', () => {
+  it('should renders cart with My Cart heading label', async() => {
     let mocks = [
       {
         request: { query: GET_LAUNCH, variables: { launchId: '1' } },
         result: { data: { launch: mockLaunch } },
       },
     ];
 
-    const { getByTestId } = renderApollo(<Cart />, { cache, mocks });
+    const wrapper = mount(
+      <MockedProvider cache={cache} mocks={mocks} addTypename={false}>
+       <Cart  />
+      </MockedProvider>,
+    );
     cartItemsVar(['1']);
-    return waitForElement(() => getByTestId('book-button'));
+    await updateWrapper(wrapper);
+    console.log(wrapper.html());
+    expect(wrapper.html()).toContain("<h2>My Cart</h2>");
   });
 });