Git Product home page Git Product logo

agamim-example-app's Introduction

Example App for Agamim E2E Testing Workshop

This app is a simple todo app. Once logged in, users can add new todos, mark todos as complete or ongoing and delete todos.

Once dependencies are installed, the app can be launched in production mode using the serve script, or in dev mode using the dev script. For writing tests, it's recommended to launch the app in production mode.

Logging in

To access the app, the user needs to log in. The appropriate credentials are:

  • Username: agamim-user
  • Password: shir-ganon

To log in programmatically, the user needs to set a valid token in localstorage, with the token key. This token can be acquired from the credentials using the login() method in auth.ts.

Before writing tests, launch the app and take a moment to get a feel for it.

Tests to write

This workshop consists of setting up a Cypress environment for testing this app, then writing tests for it. The tests you'll be writing are:

  • (1) Log in
  • (2) Main view smoke test - check that the header is present and contains the right text
  • (3) Check that the Empty view is present
  • (4) Add three todos - and check that they're all viewed
  • (5) Mark a todo as completed - and check that it's in the completed list
  • (7) Mark a todo as ongoing - and check that it's back in the ongoing list
  • (8) Delete a todo - and check that it's no longer there
  • (9) Clear all todos - and check that the empty view is shown
  • (10) Log Out - and check that you're redirected back to the login page

Testing the tests

In addition to the default main branch, this repo contains two branches - broken-auth and broken-tests. If written properly, authentication should not work on the first branch (either programmatic or through the UI), breaking all tests, and all tests except for the login one should be fail on the second.

Use these branches to test your tests:

After all tests are implemented successfully, switch over to those branches (if you're in serve mode, don't forget to restart the app!), and make sure the tests fail there.

agamim-example-app's People

Contributors

nitzanhen avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.