Testing with Cypress and performing API and UI tests

Tests
1

Testing with Cypress and performing API and UI tests.

This is done by creating a cypress docker image and running against the target application.

This creates an allure report in the end.

version: '1.0'
steps:
  build_image:
    type: build
    title: Building image...
    working_directory: ${{main_clone}}
    dockerfile: docker/Dockerfile
    image_name: test/cypresspoc
    tag: '${{CF_BRANCH_TAG_NORMALIZED}}'
    no_cache: true
  run_tests:
    title: Running tests...
    image: ${{build_image}}
    working_directory: ${{main_clone}}
    fail_fast: false
    commands:
      - npm install
      - npm run api-test-web
 copy_reports:
   title: Copying Allure results...
   image: ${{build_image}}
   working_directory: ${{main_clone}}
   commands:
     - cp -r -f ./allure-results $CF_VOLUME_PATH/allure-results
  generate_reports:
    title: Generating reports...
    image: codefresh/cf-docker-test-reporting
    working_directory: /codefresh/volume
    environment:
      - BUCKET_NAME=cypress_poc
      - CF_STORAGE_INTEGRATION=google
  mark_status:
    title: Marking build based on test results...
    image: ${{build_image}}
    commands:
      - echo "Cypress tests failed, please see report."
      - exit 1
    when:
      condition:
        all:
          myCondition: run_tests.result == 'failure'

55
552542×1158 234 KB

2 Likes
2

This is awesome, great share. How do the tests look in the UI? Like what’s the output look like?

3

15
151081×558 79 KB

1 Like
4

@todaywasawesome

is quite powerful it can do off the bat HTTP requests plus all the browser actions like selenium but both have some differences.

I have also attached a copy of the cypress dashboard screenshot which you can use to see your test screenshots or videos when something fails.

1 Like