cypress-io / cypress

Fast, easy and reliable testing for anything that runs in a browser.
https://cypress.io
MIT License
46.78k stars 3.17k forks source link

localhost server created with node js is not accessible in the cypress enviroment in a novice cypress course #26741

Closed Pet4rdo closed 1 year ago

Pet4rdo commented 1 year ago

Current behavior

First of all sorry about my english because I am not a native speaker. I am trying to learn Cypress automation from the beginning and I just trying to follow this initial course (https://learn.cypress.io/testing-your-first-application/app-install-and-overview). I install everything but when I run the server in my local machine at "http://localhost:3000/" I am able to reach it and see it properly,but when I run a simple test with cypress, the "cypress browser" do not load,reach or see it at "http://localhost:3000/". It happens the same with the rest of the browsers. "Normal" browsers reach it, but not the ones that cypress launch. I tried also insted of localhost, using the name of my machine, 127.0.0.1 and do not work as well.

Desired behavior

Cypress chrome browser should be able to reach the "http://localhost:3000/" as well as an external Chrome does.

Test code to reproduce

Follow all the instructions in the "https://learn.cypress.io/testing-your-first-application/app-install-and-overview" course. Whe you reach the "https://learn.cypress.io/testing-your-first-application/installing-cypress-and-writing-your-first-test" page, and exactly the "Debugging our first error" section,after running the "npm run dev" command, it works for them but not for me.

Cypress Version

Cypress package version: 12.12.0 Cypress binary version: 12.12.0

Node version

v16.16.0

Operating System

Windows 22H2 (19045_2846 compilation)

Debug Logs

No response

Other

No response

nagash77 commented 1 year ago

Hi @Pet4rdo , I am sorry to hear you are having issues running Cypress. One of our developers will verify that our examples are working. In the meantime please check out our community chat, it can be helpful for debugging or answering questions on how to use Cypress. This is the best place for real time feedback from the community and helping new folks get ramped up on Cypress.

MikeMcC399 commented 1 year ago

@Pet4rdo

I'm not the developer that @nagash77 is referring to, but I took a look at the course and it was working for me on Windows 11.

Some other people who have had trouble starting up with the Cypress course found that if they started with another repo https://github.com/cypress-io/cypress-example-kitchensink and saw that running it was easier as a first step.

If you fork the repo first, the instructions are:

## clone this repo to a local directory
git clone https://github.com/<your-username>/cypress-example-kitchensink.git

## cd into the cloned repo
cd cypress-example-kitchensink

## install the node_modules
npm install

## start the local webserver
npm start

You can ask in the community chat as well.

Pet4rdo commented 1 year ago

@Pet4rdo

I'm not the developer that @nagash77 is referring to, but I took a look at the course and it was working for me on Windows 11.

Some other people who have had trouble starting up with the Cypress course found that if they started with another repo https://github.com/cypress-io/cypress-example-kitchensink and saw that running it was easier as a first step.

If you fork the repo first, the instructions are:

## clone this repo to a local directory
git clone https://github.com/<your-username>/cypress-example-kitchensink.git

## cd into the cloned repo
cd cypress-example-kitchensink

## install the node_modules
npm install

## start the local webserver
npm start

You can ask in the community chat as well.

Thanks for your help and for the extra repo to practise! I will try it. The more frustrating thing to me is that is an ultra basic course for begginners and are elemental things and It doesn´t work....but anyway I will try with yours! Thanks!

MikeMcC399 commented 1 year ago

@Pet4rdo

Please let us know if it works for you!

Also if you want to revisit the course and you still run into problems, we can take another look. Getting the course to work requires the course materials to be correct on the Cypress side and it requires the environment and steps you take to be correct on your side, so we can't say where the problem comes from unless we know more.

Pet4rdo commented 1 year ago

@Pet4rdo

Please let us know if it works for you!

Also if you want to revisit the course and you still run into problems, we can take another look. Getting the course to work requires the course materials to be correct on the Cypress side and it requires the environment and steps you take to be correct on your side, so we can't say where the problem comes from unless we know more.

@MikeMcC399 From my side, It would be nice to explain to you all the details that you could need and if you want, we can meet and I can show it to you directly online. So, more than happy to provide you all the maximum details and fix it, because I tried this morning again and the error is still there.

MikeMcC399 commented 1 year ago

@Pet4rdo

From my side, It would be nice to explain to you all the details that you could need and if you want, we can meet and I can show it to you directly online. So, more than happy to provide you all the maximum details and fix it, because I tried this morning again and the error is still there.

Thank you for following up and for your offer to explain!

Were you successful using the cypress-example-kitchensink repository or did you decide not to try this?

I suggest that you open a new issue in the repository https://github.com/cypress-io/cypress-realworld-testing-course-app which provides the training material for https://learn.cypress.io/testing-your-first-application/installing-cypress-and-writing-your-first-test.

I noticed that the developers have updated and replaced the material in https://github.com/cypress-io/cypress-realworld-testing-course-app, so to make sure that you are using the latest course material it may be best if you delete your copy and clone it again using:

git clone https://github.com/cypress-io/cypress-realworld-testing-course-app.git

If you do decide to open a new issue, it would be helpful to have screenshots and logs of where it is not working for you.

Pet4rdo commented 1 year ago

@Pet4rdo

From my side, It would be nice to explain to you all the details that you could need and if you want, we can meet and I can show it to you directly online. So, more than happy to provide you all the maximum details and fix it, because I tried this morning again and the error is still there.

Thank you for following up and for your offer to explain!

Were you successful using the cypress-example-kitchensink repository or did you decide not to try this?

I suggest that you open a new issue in the repository https://github.com/cypress-io/cypress-realworld-testing-course-app which provides the training material for https://learn.cypress.io/testing-your-first-application/installing-cypress-and-writing-your-first-test.

I noticed that the developers have updated and replaced the material in https://github.com/cypress-io/cypress-realworld-testing-course-app, so to make sure that you are using the latest course material it may be best if you delete your copy and clone it again using:

git clone https://github.com/cypress-io/cypress-realworld-testing-course-app.git

If you do decide to open a new issue, it would be helpful to have screenshots and logs of where it is not working for you.

Hi @MikeMcC399. First of all,really thanks and appreciate your effort with my case.

Trying to be as clean as possible, I will try to reply as best as I can:

-New issue: Yes, I delete the entire folder that I already have, and cloning everything again. I just tested but with the same result. In my "local Chrome" I am able to reach and see the localhost:3000 page, but not with the "cypress controlled" one (You can see both in the attached picture in the issue). So I report this issue (https://github.com/cypress-io/cypress-realworld-testing-course-app/issues/27), following your instructions. -"Kitchen course": Yes, it works perfectly fine for me and meanwhile that it´s the course I am practicing with.

MikeMcC399 commented 1 year ago

@Pet4rdo

mike-plummer commented 1 year ago

@Pet4rdo From what I can tell your problems here have either been resolved or migrated to new issues in other repos, so it appears there's nothing left for the Cypress team to investigate. If you have further need for help I recommend reaching out on Discord where the Cypress community can help you with any questions.

Pet4rdo commented 1 year ago

@Pet4rdo From what I can tell your problems here have either been resolved or migrated to new issues in other repos, so it appears there's nothing left for the Cypress team to investigate. If you have further need for help I recommend reaching out on Discord where the Cypress community can help you with any questions.

Hi @mike-plummer sorry but I disagree. I open another issue (https://github.com/cypress-io/cypress-realworld-testing-course-app/issues/27) but there is no one assigned or reviewing it, so, in that case, if you close this one and no one is looking the other one, who is gonna try to help me with the error I report? Thanks in advance.