search

cypress-io / cypress

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

Websocket server not connecting #22556

Open hassannaseem opened 2 years ago

hassannaseem commented 2 years ago

Current behavior

Hello,

I have two application

I have configured the cypress with my Javascript application via npm and tried to open my web server page with a simple test. I run my Javascript application on a NodeJs server.

The page loads fine but after the page loads, my Javascript application tries to connect to the Websocket server which fails in the cypress environment.

Web server runs on URL e.g. 127.0.0.1:8080 Websocket server runs on URL e.g. 127.0.0.1:80

In Electron I see a failed handshake message in the console:- Cypress_SS_01

In chrome, it simply says failed:- Cypress_SS_02

Desired behavior

After my page has loaded in the cypress test environment it should connect to the WebSocket server.

Taken in a normal chrome mode and it works fine outside the cypress environment Cypress_SS_03

Test code to reproduce

I have a C# backend application that uses the SuperSocket WebSocket library v1.6.6.1 to host a WebSocket server on a specific port.

On the other hand, I have a NodeJs web server that serves the static JS/CSS/Images files and after the page loads, the website should connect with the c# websocket server in the cypress environment.

Cypress Version

10.2.0

Other

Everything works fine when I am not in the cypress testing environment. I was reading the cypress documents and it says cypress may have trouble with different ports but I am not sure about it and need a solution. Please help me to run my application in the cypress environment

lmiller1990 commented 2 years ago

Hi! I've got some basic apps working fine w/ web sockets (using Node). Are you able to create a minimal repo with your setup? I am not familar enough w/ C# to re-create it, but I don't know of any generic reason web sockets wouldn't be working w/ Cypress.

hassannaseem commented 2 years ago

Hi! I've got some basic apps working fine w/ web sockets (using Node). Are you able to create a minimal repo with your setup? I am not familar enough w/ C# to re-create it, but I don't know of any generic reason web sockets wouldn't be working w/ Cypress.

Okay, I have set up a small code so that you can test it on your machine. You can access the code from the following link.

https://drive.google.com/drive/folders/18mnc-4WwJqsS9PA3SF__IPQOjdEvBfem?usp=sharing

  1. wpf_websocket_test.zip is a wpf .Net 4.8 framework project which uses the super sockets. Just compile and run the project in Visual Studio.
  2. websocket_client.zip is a client-side JS code. You can directly run the index.html file or start from a web server. It will show a socket open message.

If you run the client project inside the cypress environment the connection fails.

Please let me know if you need help to setup this.

lmiller1990 commented 2 years ago

I'll need to get a windows setup, please wait a bit. This repro is very useful - it means either myself or someone else can grab it and take a look. Thanks!

marktnoonan commented 2 years ago

Just updating with a note that I was able to reproduce this problem with the code provided, here is the page happy in Chrome, and angry in Cypress on Windows:

Screen Shot 2022-07-26 at 11 08 47 AM

Not sure I have a way forward yet, going to poke around a bit.

marktnoonan commented 2 years ago

We found the error is present in the Cypress browser even with the Cypress extension disabled and in a new tab outside the iframe. This may point to something we set when opening Chrome (and Firefox, which has this issue as well).

@hassannaseem the way we launch browsers is documented here: https://docs.cypress.io/guides/guides/launching-browsers#Disabled-Barriers

And the specific flags we set are here: https://github.com/cypress-io/cypress/blob/develop/packages/server/lib/browsers/chrome.ts#L50

I would be curious if anything sticks out to you about these that might explain the handshake problem. It's possible something can be adjusted from your server side to work in this context, or that Cypress could be made to optionally unset a certain flag if it can be pinned down as the problem.

That said, generally speaking websockets are fine in Cypress and we don't see this 400 error in pages that communicate with them.

albertocorrales commented 1 year ago

I'm having the same issue when I run my e2e tests with cypress and I'm using WebSockets. Are there any workarounds to make it work?

In my case, I'm working with AWS API Gateway WebSockets

lmiller1990 commented 1 year ago

@albertocorrales do you get the same error as shown above (400 could not connect)?

albertocorrales commented 1 year ago

@albertocorrales do you get the same error as shown above (400 could not connect)?

In my case I'm seeing the error Error during WebSocket handshake: Sent non-empty 'Sec-WebSocket-Protocol' header but no response was received In the protocol header I'm sending the access token, and it works fine when I use chrome without cypress.

I suspect it is related to this issue: https://github.com/cypress-io/cypress/issues/7664

Edit:

Yep, I confirm it must be related to the issue in https://github.com/cypress-io/cypress/issues/7664, as I managed to workaround the issue with the by adding my websocket domain in the parameter --proxy-bypass-list

lmiller1990 commented 1 year ago

Hm is it a bug or is --proxy-bypass-list the correct fix here :thinking:

albertocorrales commented 1 year ago

Hm is it a bug or is --proxy-bypass-list the correct fix here 🤔

From my point of view, the --proxy-bypass-list option is a workaround. Ideally, cypress should wait for the WebSocket connection handshake and work fine, as it works in normal chrome or other browsers.

cwbusacker commented 3 months ago

I'm on the latest version of cypress 13.9.0 and it is still happening. Are there any updates? I can't seem to get the --proxy-bypass-list to work. I've tried: --proxy-bypass-list=<-loopback>;ws://*/api/*, --proxy-bypass-list=<-loopback>,ws://*/api/*, --proxy-bypass-list=<-loopback>;ws://*, and --proxy-bypass-list=<-loopback>,ws://*

Sangrampatil commented 3 weeks ago

I am also facing the same issue, I am on Cypress 12.5.1. Websocket connects and works well in normal Chrome and electron, but when it is running for testing under Cypress, in electron browser, web socket connection fails. Even tried with multiple options to set --proxy-bypass-list, but still not able to get it through.

senpl commented 3 weeks ago

I am also facing the same issue, I am on Cypress 12.5.1. Websocket connects and works well in normal Chrome and electron, but when it is running for testing under Cypress, in electron browser, web socket connection fails. Even tried with multiple options to set --proxy-bypass-list, but still not able to get it through.

Does it works in latest version? Can You provide repeatable simplified example?

Sangrampatil commented 3 weeks ago

I can not test in latest version, as getting latest cypress executable in corporate is a different challenge :-)

Assuming the websocket string is 'ws://abcd123.efg.hik.com:8277/test/next' what should I set for environment variable so as to by pass the proxy.

--proxy-bypass-list

$Env:ELECTRON_EXTRA_LAUNCH_ARGS='--proxy-bypass-list=""'