margaritahumanitarian / helpafamily

Impactful ways to help families in need through donated meals, hygiene kits, and more. By Margarita Humanitarian Foundation.
https://helpafamily.margaritahumanitarian.org/
GNU Affero General Public License v3.0
67 stars 111 forks source link

Integration of E2E tests to accomplish 80% test coverage 🚀 #373

Open FranciscoBastos opened 2 years ago

FranciscoBastos commented 2 years ago

This PR:

Self-Review Checklist

vercel[bot] commented 2 years ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
helpafamily ✅ Ready (Inspect) Visit Preview May 25, 2022 at 9:13PM (UTC)
LowLifeArcade commented 2 years ago

Hi @FranciscoBastos ! Thanks for all the hard work you guys did. I'm going to just leave this build error for you guys to work with. I'll try to help later when I can.

warning package.json: "dependencies" has dependency "cucumber" with range "^1.3.0" that collides with a dependency in "devDependencies" of the same name with version "^6.0.7"
$ yarn jest --coverage
warning package.json: "dependencies" has dependency "cucumber" with range "^1.3.0" that collides with a dependency in "devDependencies" of the same name with version "^6.0.7"
$ /home/runner/work/helpafamily/helpafamily/node_modules/.bin/jest --coverage
FAIL __tests__/E2E/makeadonation.spec.js
  ● Make a donation › Make a donation

    WebDriverError: unknown error: Chrome failed to start: exited abnormally.
      (unknown error: DevToolsActivePort file doesn't exist)
      (The process started from chrome location /usr/bin/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)

      at Object.throwDecodedError (node_modules/selenium-webdriver/lib/error.js:[5](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:6)22:15)
      at parseHttpResponse (node_modules/selenium-webdriver/lib/http.js:549:13)
      at Executor.execute (node_modules/selenium-webdriver/lib/http.js:475:28)

  ● Make a donation › Make a donation

    TypeError: Cannot read property 'quit' of undefined

      18 |   });
      19 |   afterEach(async function () {
    > 20 |     await driver.quit();
         |                  ^
      21 |   });
      22 |   it('Make a donation', async function () {
      23 |     // Test name: Make a donation

      at Object.quit (__tests__/E2E/makeadonation.spec.js:20:18)

FAIL __tests__/E2E/hotmealdonate.spec.js
  ● Hot meal donate › Hot meal donate

    WebDriverError: unknown error: Chrome failed to start: exited abnormally.
      (unknown error: DevToolsActivePort file doesn't exist)
      (The process started from chrome location /usr/bin/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)

      at Object.throwDecodedError (node_modules/selenium-webdriver/lib/error.js:522:15)
      at parseHttpResponse (node_modules/selenium-webdriver/lib/http.js:549:13)
      at Executor.execute (node_modules/selenium-webdriver/lib/http.js:475:28)

  ● Hot meal donate › Hot meal donate

    WebDriverError: unknown error: Chrome failed to start: exited abnormally.
      (unknown error: DevToolsActivePort file doesn't exist)
      (The process started from chrome location /usr/bin/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)

      at Object.throwDecodedError (node_modules/selenium-webdriver/lib/error.js:522:15)
      at parseHttpResponse (node_modules/selenium-webdriver/lib/http.js:549:13)
      at Executor.execute (node_modules/selenium-webdriver/lib/http.js:475:28)

  ● Hot meal donate › Hot meal donate

    WebDriverError: unknown error: Chrome failed to start: exited abnormally.
      (unknown error: DevToolsActivePort file doesn't exist)
      (The process started from chrome location /usr/bin/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)

      at Object.throwDecodedError (node_modules/selenium-webdriver/lib/error.js:522:15)
      at parseHttpResponse (node_modules/selenium-webdriver/lib/http.js:549:13)
      at Executor.execute (node_modules/selenium-webdriver/lib/http.js:475:28)

PASS __tests__/components/MainDonationForm.spec.js
PASS components/Card/card.spec.js
(node:1741) UnhandledPromiseRejectionWarning: WebDriverError: unknown error: Chrome failed to start: exited abnormally.
  (unknown error: DevToolsActivePort file doesn't exist)
  (The process started from chrome location /usr/bin/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:1741) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 4)
(node:1741) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
FAIL __tests__/E2E/makesanemptydonation2.spec.js
  ● Makes an empty donation 2 › Makes an empty donation 2

    WebDriverError: unknown error: Chrome failed to start: exited abnormally.
      (unknown error: DevToolsActivePort file doesn't exist)
      (The process started from chrome location /usr/bin/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)

      at Object.throwDecodedError (node_modules/selenium-webdriver/lib/error.js:522:15)
      at parseHttpResponse (node_modules/selenium-webdriver/lib/http.js:549:13)
      at Executor.execute (node_modules/selenium-webdriver/lib/http.js:475:28)

  ● Makes an empty donation 2 › Makes an empty donation 2

    WebDriverError: unknown error: Chrome failed to start: exited abnormally.
      (unknown error: DevToolsActivePort file doesn't exist)
      (The process started from chrome location /usr/bin/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)

      at Object.throwDecodedError (node_modules/selenium-webdriver/lib/error.js:522:15)
      at parseHttpResponse (node_modules/selenium-webdriver/lib/http.js:549:13)
      at Executor.execute (node_modules/selenium-webdriver/lib/http.js:475:28)

FAIL __tests__/E2E/hotmeallearnmore.spec.js
  ● Hot meal learn more › Hot meal learn more

    WebDriverError: unknown error: Chrome failed to start: exited abnormally.
      (unknown error: DevToolsActivePort file doesn't exist)
      (The process started from chrome location /usr/bin/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)

      at Object.throwDecodedError (node_modules/selenium-webdriver/lib/error.js:522:15)
      at parseHttpResponse (node_modules/selenium-webdriver/lib/http.js:549:13)
      at Executor.execute (node_modules/selenium-webdriver/lib/http.js:475:28)

  ● Hot meal learn more › Hot meal learn more

    TypeError: Cannot read property 'quit' of undefined

      18 |   });
      19 |   afterEach(async function () {
    > 20 |     await driver.quit();
         |                  ^
      21 |   });
      22 |   it('Hot meal learn more', async function () {
      23 |     // Test name: Hot meal learn more

      at Object.quit (__tests__/E2E/hotmeallearnmore.spec.js:20:18)

FAIL __tests__/E2E/email.spec.js
  ● email › email

    WebDriverError: unknown error: Chrome failed to start: exited abnormally.
      (unknown error: DevToolsActivePort file doesn't exist)
      (The process started from chrome location /usr/bin/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)

      at Object.throwDecodedError (node_modules/selenium-webdriver/lib/error.js:522:15)
      at parseHttpResponse (node_modules/selenium-webdriver/lib/http.js:549:13)
      at Executor.execute (node_modules/selenium-webdriver/lib/http.js:475:28)

  ● email › email

    TypeError: Cannot read property 'quit' of undefined

      18 |   });
      19 |   afterEach(async function () {
    > 20 |     await driver.quit();
         |                  ^
      21 |   });
      22 |   it('email', async function () {
      23 |     // Test name: email

      at Object.quit (__tests__/E2E/email.spec.js:20:18)

FAIL __tests__/E2E/makesanemptydonation.spec.js
  ● Makes an empty donation › Makes an empty donation

    WebDriverError: unknown error: Chrome failed to start: exited abnormally.
      (unknown error: DevToolsActivePort file doesn't exist)
      (The process started from chrome location /usr/bin/google-chrome is no longer running, so ChromeDriver is assuming that Chrome has crashed.)

      at Object.throwDecodedError (node_modules/selenium-webdriver/lib/error.js:522:15)
      at parseHttpResponse (node_modules/selenium-webdriver/lib/http.js:549:13)
      at Executor.execute (node_modules/selenium-webdriver/lib/http.js:475:28)

  ● Makes an empty donation › Makes an empty donation

    TypeError: Cannot read property 'quit' of undefined

      17 |   });
      18 |   afterEach(async function () {
    > 19 |     await driver.quit();
         |                  ^
      20 |   });
      21 |   it('Makes an empty donation', async function () {
      22 |     // Test name: Makes an empty donation

      at Object.quit (__tests__/E2E/makesanemptydonation.spec.js:19:18)

PASS __tests__/components/MainDonationFormInNeed.spec.js
PASS __tests__/E2E/setup.js
PASS components/Astronaut/astronaut.spec.js
  ● Console

    console.warn
      Warning: componentWillUpdate has been renamed, and is not recommended for use. See https://reactjs.org/link/unsafe-component-lifecycles for details.

      * Move data fetching code or side effects to componentDidUpdate.
      * Rename componentWillUpdate to UNSAFE_componentWillUpdate to suppress this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run `npx react-codemod rename-unsafe-lifecycles` in your project source folder.

      Please update the following components: Lottie

      at printWarning (node_modules/react-dom/cjs/react-dom.development.js:[6](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:7)[7](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:8):30)
      at warn (node_modules/react-dom/cjs/react-dom.development.js:34:5)
      at Object.<anonymous>.ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings (node_modules/react-dom/cjs/react-dom.development.js:11536:7)
      at flushRenderPhaseStrictModeWarningsInDEV (node_modules/react-dom/cjs/react-dom.development.js:23[8](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:9)22:31)
      at commitRootImpl (node_modules/react-dom/cjs/react-dom.development.js:23005:3)
      at unstable_runWithPriority (node_modules/scheduler/cjs/scheduler.development.js:468:12)
      at runWithPriority$1 (node_modules/react-dom/cjs/react-dom.development.js:11276:10)
      at commitRoot (node_modules/react-dom/cjs/react-dom.development.js:22[9](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:10)90:3)

---------------------------------|---------|----------|---------|---------|-------------------
File                             | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s 
---------------------------------|---------|----------|---------|---------|-------------------
All files                        |   23.37 |    26.77 |   18.78 |   23.26 |                   
 components                      |   36.61 |    22.91 |   23.88 |   36.31 |                   
  CardsLayout.js                 |       0 |        0 |       0 |       0 | 7-[10](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:11)              
  DoctorsAsVolunteersCard.js     |       0 |      100 |       0 |       0 | 6                 
  ElectronicsDropOffCard.js      |       0 |      100 |       0 |       0 | 6                 
  FallPreventionForEldersCard.js |       0 |      100 |       0 |       0 | 6-17              
  FoodDistributionSupportCard.js |       0 |      100 |       0 |       0 | 6-17              
  Footer.js                      |       0 |        0 |       0 |       0 | 6-23              
  HealthWorkshopCard.js          |       0 |      100 |       0 |       0 | 6-17              
  HeroSection.js                 |       0 |        0 |       0 |       0 | 7                 
  HotMealDayCard.js              |       0 |      100 |       0 |       0 | 6-17              
  HotMealDaySection.js           |       0 |        0 |       0 |       0 | 9-18              
  HumanitarianClinicCard.js      |       0 |      100 |       0 |       0 | 6-17              
  HygieneKitsCard.js             |       0 |      100 |       0 |       0 | 6                 
  LandingPageNav.js              |       0 |        0 |       0 |       0 | 17-22             
  LaptopForFamiliesCard.js       |       0 |      100 |       0 |       0 | 6                 
  LargeHeroContent.js            |       0 |        0 |       0 |       0 | 22-45             
  LargeHeroSection.js            |       0 |        0 |       0 |       0 | 19-31             
  LargeInfoSection.js            |       0 |        0 |       0 |       0 | 8-31              
  MainDonationForm.js            |   86.36 |    93.33 |   83.33 |    87.8 | 73-74,86-88       
  Modal.js                       |     100 |      100 |     100 |     100 |                   
  Navbar.js                      |       0 |        0 |       0 |       0 | 14-32             
  PrimaryLayout.js               |       0 |        0 |       0 |       0 | 15-30             
  SVGBackgrounds.js              |       0 |        0 |       0 |       0 | 5-92              
  SideNavbar.js                  |       0 |        0 |       0 |       0 | 7-69              
  TestimonialCard.js             |       0 |      100 |       0 |       0 | 4-5               
  ThemeContext.js                |   71.87 |       50 |      80 |   71.87 | 19-22,27-32       
 components/Astronaut            |   93.33 |      100 |      80 |   93.33 |                   
  constants.js                   |     100 |      100 |     100 |     100 |                   
  index.js                       |   92.85 |      100 |      80 |   92.85 | 33                
 components/Card                 |    92.3 |      100 |   88.88 |    92.3 |                   
  index.js                       |    92.3 |      100 |   88.88 |    92.3 | 151               
 components/email                |       0 |        0 |       0 |       0 |                   
  EmailCapture.js                |       0 |      100 |       0 |       0 | 8-53              
  EmailCaptureHelper.js          |       0 |      100 |       0 |       0 | 4                 
  InteractiveSection.js          |       0 |        0 |       0 |       0 | 5-47              
  Questions.js                   |       0 |      100 |       0 |       0 | 9-10              
  SurveyContainer.js             |       0 |        0 |       0 |       0 | 5-6               
  SurveySections.js              |       0 |        0 |       0 |       0 | 7-69              
  Thankyou.js                    |       0 |      100 |       0 |       0 | 5-20              
  ThankyouEmail.js               |       0 |        0 |       0 |       0 | 6-16              
 components/form                 |   52.94 |    29.41 |   55.55 |   53.84 |                   
  CheckboxFormControl.js         |     100 |      100 |     100 |     100 |                   
  InputFormControl.js            |       0 |        0 |       0 |       0 | 17-48             
  SelectFormControl.js           |     100 |       50 |     100 |     100 | 9                 
  TextareaFormControl.js         |       0 |        0 |       0 |       0 | 5-26              
 hooks                           |    8.82 |        0 |    5.26 |    9.09 |                   
  useIntersectionObserver.js     |       0 |        0 |       0 |       0 | 3-51              
  usePosition.js                 |       0 |        0 |       0 |       0 | 4-73              
  useStripeSession.js            |   54.54 |      100 |      50 |   54.54 | [11](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:12)-27             
 pages                           |       0 |        0 |       0 |       0 |                   
  404.js                         |       0 |      100 |       0 |       0 | 7                 
  _app.js                        |       0 |      100 |       0 |       0 | 9-31              
  _document.js                   |       0 |      100 |       0 |       0 | 8-13              
  electronics-gifting-cities.js  |       0 |        0 |       0 |       0 | 13-58             
  fund.js                        |       0 |      100 |       0 |       0 | 13-1[12](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:13)            
  give-devices.js                |       0 |        0 |       0 |       0 | 12-91             
  give-your-time.js              |       0 |      100 |       0 |       0 | 9-[13](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:14)              
  in-kind.js                     |       0 |      100 |       0 |       0 | 9-13              
  index.js                       |       0 |      100 |       0 |       0 | [16](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:17)-38             
  landing-page.js                |       0 |      100 |       0 |       0 | 26-95             
  partner-with-us.js             |       0 |      100 |       0 |       0 | 13-102            
  thank-you.js                   |       0 |      100 |       0 |       0 | 7                 
---------------------------------|---------|----------|---------|---------|-------------------

Test Suites: 6 failed, 5 passed, 11 total
Tests:       6 failed, 16 passed, [22](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:23) total
Snapshots:   1 passed, 1 total
Time:        10.[30](https://github.com/margaritahumanitarian/helpafamily/runs/6532494686?check_suite_focus=true#step:5:31)4 s
Ran all test suites.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
Error: Process completed with exit code 1.
FranciscoBastos commented 2 years ago

Hi @LowLifeArcade, thank you for your support regarding the pull request. These are E2E tests, so you need to have the application running somewhere for them to execute. I usually open a terminal session in one window, and the other does the yarn jest --coverage. Another thing is that we need to align the Chrome version with the version on your computer when running the tests. I used the command npm install chromedriver --detect_chromedriver_versionto detect the current version of your Chrome browser and assert the necessary drivers. Also, I think that these tests do not enter the coverage of Jest; however, they test every component of your application because they interact without the front end, and the front end needs to call the back-end. So if I try to donate if anything fails (the controllers, the model, ...), then well, I could not donate the front end of the application, and therefore something somewhere is not working. We can make a Discord call, and I can explain what I've done there. Also, I think I've been editing the README for my College assignment. If you want, you can discard the changes on the README. I'm going to make a copy of the report. I'm sorry for that. I hope this helps! Anything fell free to call me (I'm already on your discord server).

LowLifeArcade commented 2 years ago

Hi @LowLifeArcade, thank you for your support regarding the pull request. These are E2E tests, so you need to have the application running somewhere for them to execute. I usually open a terminal session in one window, and the other does the yarn jest --coverage. Another thing is that we need to align the Chrome version with the version on your computer when running the tests. I used the command npm install chromedriver --detect_chromedriver_versionto detect the current version of your Chrome browser and assert the necessary drivers. Also, I think that these tests do not enter the coverage of Jest; however, they test every component of your application because they interact without the front end, and the front end needs to call the back-end. So if I try to donate if anything fails (the controllers, the model, ...), then well, I could not donate the front end of the application, and therefore something somewhere is not working. We can make a Discord call, and I can explain what I've done there. Also, I think I've been editing the README for my College assignment. If you want, you can discard the changes on the README. I'm going to make a copy of the report. I'm sorry for that. I hope this helps! Anything fell free to call me (I'm already on your discord server).

Hey, sorry for the late response. I'm not actively working on this at the moment as I've been pretty busy with work. I'll try to catch you in the Discord if you mention me there.