Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Testing JavaScript

Testing JavaScript

Intro to JavaScript testing

Irfan Maulana

May 24, 2022
Tweet

More Decks by Irfan Maulana

Other Decks in Programming

Transcript

  1. Hi, I am Irfan Working at Tokopedia as Principal Engineer

    for Web Platform Team. mazipan.space @Maz_Ipan
  2. A process to verifying the correctness & validating the functional

    features of the app being developed APPLICATION TESTING
  3. JAVASCRIPT APPLICATION Frontend Backend Handling UI functionality: web, apps, desktop

    Handling business logic, data store connection A B We will focus on the Frontend for this session.
  4. WHY DO WE NEED? Bugs are bad, and who gets

    blamed? The developer. You know humans are bad at complex, repetitive tasks. Computers are very, very good at complex, repetitive tasks. A professional ships working code. Code that works. Code that is well tested.
  5. Focused on input & output. Not interested about the things

    happening inside. Involve testing of the internal structure, code, design & implementation. METHODOLOGIES BLACKBOX WHITEBOX
  6. STATIC TEST To catch typos, errors, possible bugs as you

    write the code. Tools: • ESLint + Prettier • CodeQL, Snyk, SonarQube
  7. Very fast feedback Can not reproduce functional bugs faced by

    users STATIC TEST: PRO & CONS We can mark it as mandatory Very beneficial in the development phase
  8. UNIT TEST To verify that individual, isolated and smallest part

    works as expected. Tools: • TestingLibrary.com
  9. Fast feedback Need an extra effort to write UT UNIT

    TEST: PRO & CONS Verify the correctness of the function Can not represent the bug when the unit integrated Can not represent real user interaction
  10. Verify most of user interactions Slower feedback than UT More

    effort than UT INTEGRATION TEST: PRO & CONS Can not represent device variant Can not replicate using the real data
  11. END-TO-END TEST A robot that behaves like a user to

    click around the app and verify that it functions correctly. Tools: • Cypress • Nightwatch • TestCafe
  12. Can use multiple device Very slow to executed Need the

    biggest effort E2E TEST: PRO & CONS Can use real data Replicate real user
  13. COMPARISON Static Test Unit Test Integration E2E Test 🚀 Speed

    🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 ⏰ Development time 🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 💰 Cost 🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 😎 Confidence 🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 🟢 Read more on https://kentcdodds.com/blog/static-vs-unit-vs-integration-vs-e2e-tests
  14. CREDITS: This presentation template was created by Slidesgo, including icons

    by Flaticon, and infographics & images by Freepik and illustrations by Stories. THANK YOU Please keep this slide for attribution.