How to test web-socket requests in Cypress.

[sreenarayan]

I need to intercept a web-socket connection, For this particular functionality(If I click download file button , web-socket request will trigger) this will generate auth_token cookie also. I need to establish web socket connection with auth_token cookie. And validate the web-socket messages as a success.

My script : The error I'm receiving is handshake. couldn't able to establish the connection.

it("Verify Zone geom file download functionality", () => {
// Click the download file button
cy.get('.dwnld-files-section-geom-img').click();
cy.get('.dwnld-geom-files-section > :nth-child(1) > p').click();

    cy.wait(5000); 
  
    // Get the authentication token
    cy.getCookie("auth_token_demo").then((cookie) => {
      const auth_token_demo = cookie.value;
      console.log(`Auth token: ${auth_token_demo}`);
  
      // Establish WebSocket connection
      cy.window().then(win => {
        const WebSocket = win.WebSocket;
        const wsConnection = new WebSocket("wss://URL/v1");
  
        wsConnection.onopen = () => {
          console.log('WebSocket connection established');
          
          // Send authentication token
          const message = {
            service: "zonegeomfile",
            action: "url",
            data: {
              requestId: "ZONEGEOMFILES#" + Math.random().toString(36).substring(7),
              authToken: auth_token_demo
            }
          };
          console.log('Sending message:', message);
          wsConnection.send(JSON.stringify(message));
        };
  
        wsConnection.onmessage = (event) => {
          try {
            const eventData = JSON.parse(event.data);
            console.log('Received message:', eventData);
  
            // Validate the received message
            expect(eventData.service).to.equal('zonegeomfile');
            expect(eventData.action).to.equal('url');
            expect(eventData.data.requestId).to.exist;
            expect(eventData.data.s3Url).to.be.a('string').and.match(/^https:\/\/zonehaven-geom-files-demo\.s3\.amazonaws\.com\//);
  
            // Download the file
            cy.request(eventData.s3Url).then(response => {
              expect(response.status).to.equal(200);
            });
  
            // Close the WebSocket connection
            wsConnection.close();
          } catch (err) {
            console.error('Error parsing message:', err);
          }
        };
  
        wsWebSocket.onclose = (event) => {
          console.log('WebSocket connection closed. Code:', event.code, 'Reason:', event.reason);
        };
      });
    });
  });