Websocket $connect successful response doesn't result in any client-side/browser success

I have a websocket connection handler that passes through a custom authoriser (successfully) and returns an object as such in both a callback and return statement just to be sure:

const result: APIGatewayProxyResult = {
    statusCode: OK,
    headers: {
      'Sec-WebSocket-Protocol': 'graphql-ws',
      'Content-Type': 'application/json',
      'Access-Control-Allow-Origin': '*'
    },
    body: 'Connected'
};

The logs say it all goes smoothly, but for some reason, the browser websocket gets no response (tested in both Google Chrome or Safari) and errors with no message. It then disconnects (which triggers the $disconnect handler it seems). There seems to be 3 x 101 websocket movements from localhost, which is not the remote wss:// url I’m hitting.

For the client websocket connection, I’m using subscriptions-transport-ws@0.9.16 from apollo (standard options).

Every 4th or 5th time I see the error error during WebSocket handshake: Sent non-empty 'Sec-WebSocket-Protocol' header but no response was received in the browser.

I’m sending some request headers as such, not sure if I’m meant to do anything with them on the server:

Sec-WebSocket-Extensions: permessage-deflate; client_max_window_bits
Sec-WebSocket-Key: xxx
Sec-WebSocket-Protocol: graphql-ws
Sec-WebSocket-Version: 13
Upgrade: websocket

Any help would be fantastic! Thanks in advance.