cypress-io / cypress-example-kitchensink

This is an example app used to showcase Cypress.io testing.

Home Page:https://example.cypress.io/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Unable to get cypress to launch tests against localhost from this example project.

eabusharkh77 opened this issue · comments

Hi,
I cloned this repo, installed all the proper extensions and cypress and node.js. When I run cypress and attempt to run any of the tests, I get an error message attached below. When I try to access the 8080 port along with the /todo page, I get the below error message as well. Anyone knows what a I missing? I'm using the latest version of cypress, 12.9.0. and vscode as my IDE. I'm running the local host on port 8080.

cypress-example-kitchensink
image
image
image

@eabusharkh77

Which operating system are you using?
Which version of Node.js?
Which browser are you using?

Did you start the server with npm start?
Can you access http://localhost:8080 manually in a browser?
Did you start the test with npm run cy:open?

I checked it locally on Windows 11 with Node.js 18 and it worked for me.

@MikeMcC399

Which operating system are you using? Which version of Node.js? Which browser are you using?

Did you start the server with npm start? Can you access http://localhost:8080 manually in a browser? Did you start the test with npm run cy:open?

I checked it locally on Windows 11 with Node.js 18 and it worked for me.

I'm using windows 11.
node version is 19.8.1
I tried both electron and chrome and now getting a 404 instead.
when I go to http://localhost:8080 it takes me to the below page.
image

when I try to launch the todo.cy.js now I get a 404 error below.
image

I added cy.visit('http://localhost:8080/todo', {failOnStatusCode: false}) inside the todo.cy.js and now it runs but it doesn't seem to be able to GET the api end point, screenshot below.
image

Here's my cypress config file as well:
image

commented

@eabusharkh77 Can you try running with node 18?

@eabusharkh77

It seems that you have modified the example and now it is not working. I suggest you make a fresh clone and then you only execute the commands:

npm install
npm run local:open

It should work then. Normally Node.js LTS (currently 18.15.0) is the better choice, but the example does also work with 19.8.1.

For comparison, the file you showed a screenshot of is looking like this in the repository:

module.exports = {
'projectId': '4b7344',
e2e: {},
}

@eabusharkh77

It seems that you have modified the example and now it is not working. I suggest you make a fresh clone and then you only execute the commands:

npm install
npm run local:open

It should work then. Normally Node.js LTS (currently 18.15.0) is the better choice, but the example does also work with 19.8.1.

For comparison, the file you showed a screenshot of is looking like this in the repository:

module.exports = {
'projectId': '4b7344',
e2e: {},
}

@MikeMcC399 thank you that worked for me now, I'm not sure why my modified cypress config file was causing the 404 issue though? do I have to run the above 2 commands each time I launch cypress or can I just type: npx cypress open?

@eabusharkh77

thank you that worked for me now.

It's good to hear that your issue is now solved.

I'm not sure why my modified cypress config file was causing the 404 issue though?

I don't say that your modified config file caused the issue. It was just a sign for me that you had modified the example repository. Perhaps you also installed other software which deleted the file app/todo.html?

do I have to run the above 2 commands each time I launch cypress or can I just type: npx cypress open?

npm install is necessary after the initial cloning and if you fetch an upstream update from this repository.

npx cypress open only starts cypress. It does not start the server. That is why there is a script defined which you can call through npm run local:open which starts the server and Cypress.

The README: Help and Testing says:

If you get stuck, here is more help:

You may also want to look at Cypress training courses to learn about more in-depth topics.

I suggest now to close this issue.

Thank you @MikeMcC399 for all your help. The todo.html file is intact inside the app folder, never touched. Will have to do more research as to why I was getting the 400 error.