Question: Configure create-react-app w/ Travis-CI

[caseybaggz]

Hello! I'm trying to configure our create-react-app setup with Travis (I'm a new user to cypress) and am failing to figure out the right combo? I'm currently serving up the app before using the cypress command in my .travis.yml, but the browser keeps "failing to load localhost:3000" thus all the tests fail. I'm wondering if there is something I'm missing here?

package.json scripts:

"cypress:ci": "cypress run --record --key {ourUniqueKey}",
"start:ci": "http-server build -p 3000 --proxy https://{ourUniqueURL}.com"

travis.yml

language: node_js
node_js:
  - 6
  - 7

cache: yarn

before_install:
  - npm install -g codecov

before_script:
  - yarn build
  - yarn start:ci --silent &

script:
  - yarn cypress:ci

travis output:

0.01s$ yarn start:ci --silent &


88.00s$ yarn cypress:ci

yarn run v1.3.2

yarn run v1.3.2

$ cypress run --record --key 1c015553-b9c7-4c2f-9c72-b4c1b162c154

$ http-server build -p 3000 --proxy https://dev1031.hellobestow.com --silent

It looks like this is your first time using Cypress: 1.1.4


[20:23:05]  Verifying Cypress can run /home/travis/build/Bestowinc/bestow-app/node_modules/cypress/dist/Cypress [started]

[20:23:07]  Verifying Cypress can run /home/travis/build/Bestowinc/bestow-app/node_modules/cypress/dist/Cypress [completed]


Opening Cypress...


Started video recording: /home/travis/build/Bestowinc/bestow-app/cypress/videos/stnjy.mp4


  (Tests Starting)



  Enroll 2T

    1) should allow you to enter the enroll flow

    2) should allow you to enter your first name

    3) should allow you to enter your middle name

    4) should allow you to enter your last name

    5) should allow you to enter your email

    6) should allow you to enter your DOB

    7) should allow you to choose your gender

    8) should allow you to choose where you were born

    9) should allow you to select your state born in

    10) should allow you to select your height, inches, and weight



  0 passing (48s)

  10 failing


  1) Enroll 2T should allow you to enter the enroll flow:

     CypressError: Timed out retrying: Expected to find content: 'Your full legal name is:' but never did.

      at Object.cypressErr (http://localhost:3000/__cypress/runner/cypress_runner.js:65873:11)

      at Object.throwErr (http://localhost:3000/__cypress/runner/cypress_runner.js:65838:18)

      at Object.throwErrByPath (http://localhost:3000/__cypress/runner/cypress_runner.js:65865:17)

      at retry (http://localhost:3000/__cypress/runner/cypress_runner.js:59972:16)

      at http://localhost:3000/__cypress/runner/cypress_runner.js:52456:18

      at tryCatcher (http://localhost:3000/__cypress/runner/cypress_runner.js:6268:23)

      at Promise._settlePromiseFromHandler (http://localhost:3000/__cypress/runner/cypress_runner.js:4290:31)

      at Promise._settlePromise (http://localhost:3000/__cypress/runner/cypress_runner.js:4347:18)

      at Promise._settlePromise0 (http://localhost:3000/__cypress/runner/cypress_runner.js:4392:10)

      at Promise._settlePromises (http://localhost:3000/__cypress/runner/cypress_runner.js:4467:18)

      at Async._drainQueue (http://localhost:3000/__cypress/runner/cypress_runner.js:1200:16)

      at Async._drainQueues (http://localhost:3000/__cypress/runner/cypress_runner.js:1210:10)

      at Async.drainQueues (http://localhost:3000/__cypress/runner/cypress_runner.js:1084:14)

     ...SAME TEST RESULTS HERE...


  (Tests Finished)


  - Tests:           10

  - Passes:          0

  - Failures:        10

  - Pending:         0

  - Duration:        31m47 seconds

  - Screenshots:     10

  - Video Recorded:  true

  - Cypress Version: 1.1.4



  (Screenshots)


  - /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter the enroll flow.png (1280x720)

  - /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter your first name.png (1280x720)

  - /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter your middle name.png (1280x720)

  - /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter your last name.png (1280x720)

  - /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter your email.png (1280x720)

  - /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter your DOB.png (1280x720)

  - /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to choose your gender.png (1280x720)

  - /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to choose where you were born.png (1280x720)

  - /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to select your state born in.png (1280x720)

  - /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to select your height inches and weight.png (1280x720)



  (Video)


  - Started processing:   Compressing to 32 CRF

  - Finished processing:  /home/travis/build/Bestowinc/bestow-app/cypress/videos/stnjy.mp4 (15 seconds)



  (Uploading Assets)


  - Done Uploading (1/11) /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter the enroll flow.png

  - Done Uploading (2/11) /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter your middle name.png

  - Done Uploading (3/11) /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter your last name.png

  - Done Uploading (4/11) /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to choose where you were born.png

  - Done Uploading (5/11) /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to select your height inches and weight.png

  - Done Uploading (6/11) /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter your DOB.png

  - Done Uploading (7/11) /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to choose your gender.png

  - Done Uploading (8/11) /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter your first name.png

  - Done Uploading (9/11) /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to select your state born in.png

  - Done Uploading (10/11) /home/travis/build/Bestowinc/bestow-app/cypress/screenshots/Enroll 2T -- should allow you to enter your email.png

  - Done Uploading (11/11) /home/travis/build/Bestowinc/bestow-app/cypress/videos/stnjy.mp4



  (All Done)


error Command failed with exit code 10.

info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

The command "yarn cypress:ci" exited with 1.

cache.2
store build cache

0.01s

6.28snothing changed, not updating cache

Done. Your build exited with 1.

Sorry if this is annoying and looking forward to your input!

[brian-mann]

From your output I don't see you doing anything wrong. What do the screenshots and videos look like? It the application rendering at all? Makes me think you forgot the build step for your frontend app.

[caseybaggz]

@brian-mann thanks for the quick response. The yarn build is the build process and from the video it looks like I'm getting a CORS issue for localhost:3000.

[brian-mann]

Gotcha, so I'm going to close this as something on your end that's not related to Cypress.