merging most recent dev to test if test suite still passes fully

Author: Anshuman Sinha

README.md

@@ -1,5 +1,5 @@
 <h1 align="center" style="background-color: #5E17EB;">
-  <a href="https://lapce.dev" target="_blank">
+  <a href="https://jester.software" target="_blank">
     <img 
         style="display: block; 
               margin-left: auto;
@@ -15,7 +15,7 @@
 <h3 align="center">Code Generator for Integration Tests</h3>
 
 <div align="center">
-  <a href="https://jester-app.dev" target="_blank">
+  <a href="https://jester.software" target="_blank">
     <img src="https://img.shields.io/badge/website-jester-purple.svg" />
   </a>
   <img alt="license" src="https://img.shields.io/badge/License-MIT-green.svg">
@@ -24,13 +24,39 @@
 <br/>
 
 ## Introduction
+Welcome to **Jester**: An easy-to-use web application that helps you create and implement integration tests, to quickly build out a lightweight testing suite for your application.
 
-## Get Started
+## Getting Started
+Please visit https://jester.software to get started. 
 
 ## Licenses
+ISC
+
+## How it Works
+Jester will pass inputs from a Graphical User Interface to a server that will perform algorithmic logic to generate integration test code. From here, Jester can save your query into a database and feed back a functional test for your project if you want to take advantage of our account functionality, or it can simply return the functional test code without saving it to a database.
+
+## Features
+
+**Logging In**
+You can use the application with limited functionality without creating an account and logging in; however, reccomend creating an account through GitHub oAuth for a secure and full experience.
+
+**Creating a Test**
+To create a test, begin by selecting the type of HTTP method you would like to write test code for as well as the endpoint of your request. To begin adding assertions, click the purple '+' icon and add up to three assertions as needed for any Status Code, Content Type, or Response Body. Once all relevant information has been input, click on 'Generate Test code' and Jester will generate a functional integration test.
+
+**Creating a Project**
+Logged in users are able to create a project inside of which generated test code snippets can be saved. You can generate test code using Jester and save it into a specific project utilizing the 'append to project' button.
+
+<p align="center">
+  <img src="client/assets/append-clipboard.gif" width="600px" margin="auto"/>
+</p>
+
+This will help engineers stay organized while developing test suites for multiple projects.
+
+**Viewing Your Saved Projects**
+To view all of the projects you have created, please utilize our vertical tool bar on the left side of the page. When you select 'Projects', a pop-out menu will display all the projects on your account. From here, you can select any of your projects to view the saved code snippets inside. If you haven't created a project, please create one from here or generate test code and append it to a project in order to begin.
 
 ## Contributing
-As an open source project, we are always open to contributors wanting to improve the library. For more information, please visit our [contributing documentation](https://github.com/oslabs-beta/d3no-data/blob/main/CONTRIBUTING.md). 
+As an open source project, we are always open to contributors wanting to improve the library. 
 
 ## Contributors
 <ul>
@@ -53,7 +79,7 @@ As an open source project, we are always open to contributors wanting to improve
     </a>
   </li>
   <li>
-    Lilah September
+    Lilah October
     <a href="https://www.linkedin.com/in/lilah-august-28a857243" target="_blank">
       <img src="https://img.shields.io/badge/LinkedIn-0077B5?style=social&logo=linkedin" />
     </a>
@@ -79,4 +105,10 @@ As an open source project, we are always open to contributors wanting to improve
       <img src="https://img.shields.io/badge/Github-0077B5?style=social&logo=github" />
     </a>
   </li>
-</ul>
+</ul>
+
+## Documentation
+The Jester docs are available at https://jester.software/docs
+
+## Resources
+Built using React, Redux Toolkit, and Typescript

__tests__/React Unit Testing/react.tsx

@@ -7,22 +7,19 @@ import userEvent from '@testing-library/user-event';
 
 import { TestInputForm } from '../../client/components/TestInputForm';
 import { ProjectDropdown } from '../../client/components/ProjectDropdown';
-import { setRequestType } from '../../client/redux/reducers/testFormSlice';
-
 
 import { RequestBody } from '../../client/components/RequestBody';
 import { DEFAULT_PROJECT } from '../../client/constants';
 
-
 describe('Unit testing "TestInputForm" component', () => {
-  const initialState = { 
+  const initialState = {
     testForm: {
       requestType: 'Get',
       assertionList: {},
       i: 0,
       userInput: '',
     },
-    userInfo: { 
+    userInfo: {
       projectsInfo: [
         {
           project_id: 0,
@@ -31,7 +28,8 @@ describe('Unit testing "TestInputForm" component', () => {
           showAccessClipboard: false,
         },
       ],
-      currentProject: DEFAULT_PROJECT }
+      currentProject: DEFAULT_PROJECT,
+    },
   };
 
   const mockStore = configureStore();
@@ -56,24 +54,23 @@ describe('Unit testing "TestInputForm" component', () => {
   });
 
   xtest('Dropdown menu for request type renders successfully', async () => {
-    // const dropdown = screen.getByDisplayValue('Get');
-    // console.log(dropdown)
-    // expect(dropdown.type).toEqual('text');
-    // const dropdown = document.querySelector('#request-selector')
-
     userEvent.click(screen.getByRole('button', { name: 'Get' }));
     await (() => userEvent.click(screen.getByText(/Post/i)));
     expect(await screen.getByText('Post')).toBeInTheDocument();
   });
 
   test('Add assertion button renders successfully', () => {
     expect(screen.getByText('+')).toBeInTheDocument();
-    expect(screen.getByRole('button', { name : '+' })).toBeInTheDocument();
+    expect(screen.getByRole('button', { name: '+' })).toBeInTheDocument();
   });
 
   test('Endpoint textbox renders successfully', () => {
-    expect(screen.getByRole('textbox', { name: 'Endpoint' })).toBeInTheDocument();
-    expect(screen.getByRole('textbox', { name: 'Endpoint' }).id).toEqual('endpoint');
+    expect(
+      screen.getByRole('textbox', { name: 'Endpoint' })
+    ).toBeInTheDocument();
+    expect(screen.getByRole('textbox', { name: 'Endpoint' }).id).toEqual(
+      'endpoint'
+    );
   });
 
   xtest('Add button renders middle component', () => {
@@ -82,36 +79,34 @@ describe('Unit testing "TestInputForm" component', () => {
     expect(dropdown).toBeInTheDocument();
     const textbox = screen.getByLabelText('User Input');
     expect(textbox).toBeInTheDocument();
-    expect(screen.getByRole('textbox', { name: 'User Input' })).toBeInTheDocument();
+    expect(
+      screen.getByRole('textbox', { name: 'User Input' })
+    ).toBeInTheDocument();
     const button = screen.getByText('-');
     expect(button).toBeInTheDocument();
     expect(screen.getByRole('textbox', { name: '-' })).toBeInTheDocument();
   });
 
-  // add button renders middle component
-
   test('Dropdown menu for project renders successfully', async () => {
     render(
       <Provider store={store}>
         <ProjectDropdown />
       </Provider>
     );
-    const dropdown = screen.getByRole('button', { name: 'Project One' });
+    const dropdown = screen.getByRole('button', { name: 'Guest Project' });
     expect(dropdown).toBeInTheDocument();
   });
-
-  xtest('Generate Test Code button renders successfully', () => {
-    // Is that for Lilah?
-  });
 });
 
 describe('Unit testing "RequestBody" component', () => {
-  const initialState = { testForm: {
-    requestType: 'Post',
-    assertionList: {},
-    i: 0,
-    userInput: '',
-  } };
+  const initialState = {
+    testForm: {
+      requestType: 'Post',
+      assertionList: {},
+      i: 0,
+      userInput: '',
+    },
+  };
 
   const mockStore = configureStore();
   let store;
@@ -121,13 +116,14 @@ describe('Unit testing "RequestBody" component', () => {
     const state = store.getState();
     render(
       <Provider store={store}>
-        <RequestBody showField = {state.testForm.requestType === 'Get' ? false : true} />
+        <RequestBody
+          showField={state.testForm.requestType === 'Get' ? false : true}
+        />
       </Provider>
     );
   });
 
   test('Request body textbox renders successfully when requestType is Post, Patch, or Delete', () => {
     expect(screen.getByTestId('Request-Body')).toBeInTheDocument();
   });
-
 });

__tests__/React Unit Testing/testCodeContainer.tsx

@@ -4,85 +4,47 @@ import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
 import { fireEvent, render, screen } from '@testing-library/react';
 import AddBoxIcon from '@mui/icons-material/AddBox';
+import ContentCopyIcon from '@mui/icons-material/ContentCopy';
 import DoneAllIcon from '@mui/icons-material/DoneAll';
 
 import CodeContainer from '../../client/containers/CodeContainer';
 import ButtonContainer from '../../client/containers/ButtonContainer';
 import AppButton from '../../client/components/AppButton';
 
-
 const initialState = {
-  slice: {
+  code: {
     codeOutput: 'describe(\'Sample description\')',
   },
   userInfo: {
     currentProjectId: 0, 
   },
 };
 
-const clickedState = {
-  slice: {
-    doneIcon: true,
-  },
-  userInfo: {
-    currentProjectId: 0, 
-  },
-
-};
-
 const mockStore = configureStore();
 
 const code = () => {
   render(
-    <Provider store={ mockStore(initialState) }>
+    <Provider store={mockStore(initialState)}>
       <CodeContainer />
     </Provider>
   );
 };
 
 const button = () => {
   render(
-    <Provider store={ mockStore(initialState) }>
+    <Provider store={mockStore(initialState)}>
       <ButtonContainer />
     </Provider>
   );
 };
 
-const props = {
-  start: <AddBoxIcon/>,
-  end : <DoneAllIcon/>,
-  onClick: jest.fn(),
-  testId: 'bttn-append',
-};
-
-const appButton = () => {
-  render(
-    <AppButton 
-      { ...props }
-    />
-  );
-};
-
-const buttonDone = () => {
-  render(
-    <Provider store={ mockStore(clickedState) }>
-      <ButtonContainer/>
-    </Provider>,
-  );
-};
-
 describe('Unit testing output Code Container components', () => {
-  beforeAll(() => {
-    // button();
-    // const buttons = screen.getAllByRole('button');
-  });
-
   test('Renders placeholder code output in Code Container', () => {
     code();
     const codeOutput = screen.getByLabelText('Testing Code');
     expect(codeOutput.innerHTML).toEqual('describe(\'Sample description\')');
   });
-  
+
   test('Renders two buttons', () => {
     button();
     expect(screen.getAllByRole('button')).toHaveLength(2);
@@ -100,9 +62,18 @@ describe('Unit testing output Code Container components', () => {
     expect(icon).toBeTruthy();
   });
 
-  test('Renders DoneAllIcon on state change', () => {
-    buttonDone();
-    const bttn = screen.getByTestId('bttn-copy');
+  test('Renders DoneAllIcon on button click', () => {
+    const props = {
+      start: <ContentCopyIcon />,
+      end: <DoneAllIcon />,
+      onClick: jest.fn(),
+      testId: 'bttn-copy',
+    };
+    render(<AppButton {...props} />);
+
+    let bttn = screen.getByTestId('bttn-copy');
+    fireEvent.click(bttn);
+    bttn = screen.getByTestId('bttn-copy');
     const icon = bttn.innerHTML.includes('data-testid="DoneAllIcon"');
     expect(icon).toBeTruthy();
   });
@@ -118,14 +89,21 @@ describe('Unit testing output Code Container components', () => {
     const icon = bttn.innerHTML.includes('data-testid="AddBoxIcon"');
     expect(icon).toBeTruthy();
   });
-  
-  test('Append clipboard button OnClick renders DoneAllIcon and fires onClick function', () => {
-    appButton();
+
+  test('Append clipboard button onClick renders DoneAllIcon and fires onClick function', () => {
+    const props = {
+      start: <AddBoxIcon />,
+      end: <DoneAllIcon />,
+      onClick: jest.fn(),
+      testId: 'bttn-append',
+    };
+    render(<AppButton {...props} />);
+
     let bttn = screen.getByRole('button', { name: '' });
     fireEvent.click(bttn);
     bttn = screen.getByRole('button', { name: '' });
     const icon = bttn.innerHTML.includes('data-testid="DoneAllIcon"');
     expect(icon).toBeTruthy();
     expect(props.onClick).toHaveBeenCalled();
   });
-});
+});

__tests__/React Unit Testing/testLogin.tsx

@@ -1,25 +1,15 @@
 import React from 'React';
 import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
-import { fireEvent, render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+import { render, screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 
 import { Login } from '../../client/components/Login';
-import { AnyListenerPredicate } from '@reduxjs/toolkit';
 
 const initialState = {};
 
 const mockStore: any = configureStore();
 
-const login = () => {
-  render(
-    <Provider store={mockStore(initialState)}>
-      <Login open={true} />
-    </Provider>
-  );
-};
-
 describe('Unit testing Login component', () => {
   beforeEach(() => {
     render(