Web 'Log in with device' fails silently

Steps To Reproduce

Be behind a proxy or firewall which blocks network connections to wss://notifications.bitwarden.com/
Have previously signed in to vault.bitwarden.com on a browser
Enter the appropriate email address and click on 'Log in with device'
Attempt to complete the login using a verified device

Expected Result

An error is returned by the User Interface to tell the user that the log in with device has failed and that another login method is required.

Actual Result

The web application silently fails when failing to connect to notifications.bitwarden.com and validating the login on another device will not work.

Screenshots or Videos

Bitwarden 'Login with device' silent failure

Additional Context

Edge / Chrome dev tools provides the following Websocket error:

Error: WebSocket failed to connect. The connection could not be found on the server, either the endpoint console-log.service.ts:51 may not be a SignalR endpoint, the connection ID is not present on the server, or there is a proxy blocking WebSockets. If you have multiple servers check that sticky sessions are enabled.
    at i.onclose [as __zone_symbol__ON_PROPERTYclose] (WebSocketTransport.ts:129:28)
    at WebSocket.R (zone.js:818:43)
    at t.invokeTask (zone.js:446:35)
    at Object.onInvokeTask (ng_zone.ts:408:29)
    at t.invokeTask (zone.js:445:64)
    at e.runTask (zone.js:214:51)
    at e.invokeTask [as invoke] (zone.js:528:38)
    at b (zone.js:1730:22)
    at w (zone.js:1761:31)
    at WebSocket.E (zone.js:1797:20)

Operating System

Windows

Operating System Version

Windows 10 Enterprise 22H2

Web Browser

Chrome, Microsoft Edge

Browser Version

Edge 120.0.2210.91 (Official build) (64-bit); Chrome 120.0.6099.130 (Official Build) (64-bit) (cohort: Stable)

Build Version

2023.12.0

Issue Tracking Info

[X] I understand that work is tracked outside of Github. A PR will be linked to this issue should one be opened to address it, but Bitwarden doesn't use fields like "assigned", "milestone", or "project" to track progress.

I did some further research into how websockets are opened and used by Bitwarden and I came across a few items that will hopefully help someone who knows TypeScript and has more ability than me to troubleshoot and provide suggestions for how this could be handled.

I found the notifications.service.ts where the websocket connection is inited using the start() function. It seems that the client is successfully catching this error that the websockets are unable to connect because the error shows up in my web browser console.

I am wondering / hoping if something can be done to pass this error through to the calling function in login-via-auth-request.component.ts to tell this function that the websocket connection has failed and that the user should use a different login method (rather than the current behavior of waiting a bit then showing "Resend notification").

I would love to contribute, but figuring this much out was about as far as my knowledge could take me without learning web development. Hoping this helps someone else!

bitwarden / clients