cypress: Server is running but 404s on visit to application during cypress run

Current behavior:

Circle config.yml:

frontend-test:
    <<: *defaults
    docker:
      - image: cypress/base:8
      - image: circleci/node:10
    working_directory: ~/repo
    steps:
      - checkout
      # Download and cache dependencies
      - restore_cache:
          keys:
            - v1-dependencies-{{ checksum "package.json" }}
            # fallback to using the latest cache if no exact match is found
            - v1-dependencies-
      - run: npm ci
      - save_cache:
          paths:
            - node_modules
          key: v1-dependencies-{{ checksum "package.json" }}
      - run: npm run test:cypress

Package.json:

{
    "cypress:run": "cypress run",
    "start": "webpack-dev-server --config ./webpack.config.js --mode development",
    "test:cypress": "start-server-and-test start http://localhost:8080 cypress",
    "cypress": "cypress run",
}

cypress:json:

{
    "baseUrl": "http://localhost:8080/",
    "fixturesFolder": "cypress/fixtures",
    "integrationFolder": "cypress/integration",
    "pluginsFile": "cypress/plugins",
    "screenshotsFolder": "cypress/screenshots",
    "supportFile": "cypress/support",
    "videosFolder": "cypress/videos"
}

webpack.config.js:

module.exports = {
    entry: "./public/js/app.js"
}

GETTING ERROR:

circlecieror

Desired behavior:

it says:

CypressError: cy.visit() failed trying to load:

http://localhost:8080/login

The response we received from your web server was:

  > 404: Not Found

I have been trying this past 4 days, I don’t know what is wrong, please help

The front-end is vuejs, hence the login page is login.vue which is loading vue-router

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Comments: 22 (5 by maintainers)

Commits related to this issue

Most upvoted comments

We’re experiencing a similar issue right now. It looks like cypress reloads the whole page with the baseUrl of the site we want to test instead of cypress’s baseUrl. In more detail:

When no baseUrl is set, we see the test page (where the tests are listed on the left side) at the url http://localhost:56113/__/#/tests/integration\myTestFolder\myTest.spec.js and once we go into the first test and call cy.visit(), the whole page reloads with the http://localhost:3000/__/#/tests/integration\myTestFolder\myTest.spec.js URL, which of course is a 404 on our website. The whole test run is then stuck. It pretty much looks like in the gif @TanvirAlam posted above, where the blank at the end is loading our website which then shows the 404 page.

When we have the baseURL set in the cypress.json, then the test window immediately loads the 404 page. The actual test window is not shown.

This only happens when running the tests in Chrome, but works when running in Electron. We have a dependency on Chrome because of our CI setup.

@jennifer-shehane Just give you little more information as to this is a Laravel vue SPA project run on Docker.

Do I need to install something? like composer? and do npm run dev

So far tried many things ended up with this:

frontend-test:
    <<: *defaults
    docker:
      - image: circleci/php:7.2-node-browsers
      - image: circleci/mysql:5.6

      - image: cypress/base:8
      - image: circleci/node:10
      #- image: cypress/base:8
      #- image: circleci/node:10
    working_directory: ~/repo
    steps:
      - checkout
      - run: sudo docker-php-ext-install pdo pdo_mysql
      - run: sudo pecl channel-update pecl.php.net
      #- run: sudo pecl install xdebug && sudo docker-php-ext-enable
      - run: sudo composer self-update
      - restore_cache: # special step to restore the dependency cache if `composer.lock` does not change
          keys:
            - composer-v1-{{ checksum "composer.lock" }}
            # fallback to using the latest cache if no exact match is found (See https://circleci.com/docs/2.0/caching/)
            - composer-v1-
      - run: composer install -n --prefer-dist
      - save_cache: # special step to save the dependency cache with the `composer.lock` cache key template
          key: composer-v1-{{ checksum "composer.lock" }}
          paths:
            - vendor
      - restore_cache: # special step to restore the dependency cache if `package.json` does not change
          keys:
            - node-v1-{{ checksum "package.json" }}
            # fallback to using the latest cache if no exact match is found (See https://circleci.com/docs/2.0/caching/)
            - node-v1-
      - run: npm install
      - save_cache: # special step to save the dependency cache with the `package.json` cache key template
          key: node-v1-{{ checksum "package.json" }}
          paths:
            - node_modules
      #- run: touch storage/testing.sqlite
      - run: php artisan migrate
      - run: npm run dev
      - run: npm run test:cypress

Still the same ERROR:

CypressError: cy.visit() failed trying to load:

http://localhost:8080/login

The response we received from your web server was:

  > 404: Not Found

I am so sorry, but I am little new to Cypress and I would really like it if CircleCI could take care of it

Locally, it works just fine

I don’t understand why this was working yesterday without the patch 😞

As far as I understood #1872 it has to do with a chromium update. So if your Chrome browser was updated between yesterday and today, this might be the reason.

@OussamaBaybay thanks, that fixes our issue!

@jennifer-shehane converted mp4 to gif ezgif com-video-to-gif

I’m also having an issue similar to this.

screen shot 2019-01-29 at 10 46 37 pm