Skip to content

AWS Tutorial

Andrew Goldis edited this page Mar 15, 2020 · 6 revisions

This is a tutorial for deploying self-hosted, on-premise alternative to Cypress dashboard on your own AWS infrastructure.

TL;DR (5 minutes)

It takes just 5 minutes to deploy sorry-cypress on AWS using AWS CloudFormation template, you're getting a "full" version of the service with:

  • Parallelization
  • GraphQL API
  • Web Dashboard
  • S3 bucket preconfigured for storing screenshots and video recordings
  • MongoDB as a persistance layer
  • Secure network configuration via AWS VPC
  • Pre-configured log groups via AWS Cloudwatch
  • Convenient access via AWS Load Balancer

Launch Stack

  1. Click the button, follow on-screen instructions
  2. Wait for deployment to complete
  3. Go to "Output" section of CloudFormation task to see access URLs
  4. Reconfigure cypress to use DirectorURL from the previous step.
  5. That's it! 🎉 Don't forget to star this repo.

AWS Amazon sorry-cypress

Love CLI?

aws cloudformation create-stack --template-url https://s3.amazonaws.com/agoldis.dev/sorry-cypress/sorry-cypress-stack.yml --capabilities CAPABILITY_IAM --stack-name sorry-cypress-2

Details

Make sure you have access to your AWS account and aws-cli installed.

AWS resources pricing per month

You're only paying for AWS resources. Here's a rough estimator of price / month for using the resources used within the stack. The actual usage might be higher (or lower) based on actual usage

  • Fargate pricing based on calculator $35.546 USD (1 vCPU, 2GB RAM) or $17.773 USD (0.5 vCPU, 1GB RAM)
  • EC2 Application Load Balancer based on calculator $19.35 USD (0.5 GB / hour, 0.5 connections / second)
  • S3 + Cloudwatch = varies based on usage

Too expensive? Try free Heroku setup.

Overview

The CloudFormation stack uses AWS Elastic Container Service (ECS) to run the services above. The configurarion includes networks and Load Balancer for secure and convinient access to the service.

sorry-cypress project consists of 3 services. The services are:

  • director service takes care of paralellization, coordination of test runs and (optionally) saving the test results. That's the only essential service you need for run tests in parallel. If you want to persist your test results and access the dashboard on web, you'll need to 2 additionals services running.

  • api is a simple GraphQL server that returns persisted test run results

  • dashboard is a web dashboard implemented in ReactJS. It fetches results from api and allows to see test results, screenshots and videos (if configured).

Publicly available docker images of 3 services are available at:

The images are automatically updated on each release and tagged in accordance with GitHub releases.

In addition, sorry-cypress uses MongoDB as a persistance layer for storing and retreiving test results.

Architecture

The key artifacts created by the stack are:

  • Director URL - this is what you provide when configure cypress agent to use the alternative dashboard.
  • Dashboard URL - web dashboard access URL
  • API URL - GraphQL API access URL
  • S3 storage bucket - for storing tests video recordings and screenshots
  • Cloudwatch log groups for debugging and troubleshooting

Template Parameters

  • StackName (default: "sorry-cypress")

Defines the stack name, also serves a prefix name for all the entites created by the stack. Please keep it short and no special characters as AWS limits service names.

  • TaskCpu (default: 1024)

The amount of CPU units dedicated to running the services. Sorry-cypress uses AWS Fargate as compute platform, and runs all the services as a single task, i.e. those CPU units are shared among all the services. Read more about at AWS Documentation

  • TaskCpu (default: 2048)

The amount of memry units dedicated to running the services. This resource is also shared between the services and defined at task-level. Read more at AWS Documentation

  • DirectorPort (default: 8080)

The port number for accessing the director service. You'll need to use it as a destination for configure cypress agent to use the alternative dashboard.

The stack created AWS Application Load Balancer to provide access to the underlying services. By default, AWS LB URL points to the web dashboad (on port 80). The director service is available via the same URL but different port. For example, if the access URL created by the stack is http://sorry-cypress-1502240720.us-east-1.elb.amazonaws.com, and DirectorPort=8080 then director service will be available at http://sorry-cypress-1502240720.us-east-1.elb.amazonaws.com:8080

Questions, Suggestions

⭐️ Alternative configurations / contributions are welcome! ⭐️

The template is available at https://github.com/agoldis/sorry-cypress/blob/master/cloudfront/sorry-cypress.yml.

Additional resources

CodeBuild configuration for running multiple Cypress Agents on AWS