V6- Hub is not handling "No Internet" case

[rkvirajgupta]

Before opening, please confirm:

• I have searched for duplicate or closed issues and discussions.
• I have read the guide for submitting bug reports.
• I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

React

Amplify APIs

GraphQL API

Amplify Version

v6

Amplify Categories

api

Backend

None

Environment information

# Put output below this line

Describe the bug

V6- Hub is not handling "No Internet" case.

Expected behavior

It should give an event that the connection is interrupted.

Reproduction steps

setup hub connection with graphql subscription. after that Just connect with the mobile wifi and disable the mobile Internet connection(see attached image). you will not get any events for this that connection is established but there is no data transfer in it.

Code Snippet

Hub.listen('api', data => {
    const {payload} = data;
    if (payload.event === CONNECTION_STATE_CHANGE) {
      const connectionState = payload.data.connectionState;
      console.log(connectionState )
      if (connectionState === 'Connected' && isNetworkAvailable === false) {
        setIsNetworkAvailable(true);
      }
      if (
        connectionState == 'ConnectedPendingNetwork' ||
        connectionState == 'ConnectionDisrupted' ||
        connectionState == 'ConnectionDisruptedPendingNetwork'
      ) {
        setIsNetworkAvailable(false);
      }
    }
  });

Log output

// Put your logs below this line

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

[rkvirajgupta]

None of the below events are triggered in No-Internet case

Connected - Connected and working with no issues.
ConnectedPendingDisconnect - The connection has no active subscriptions and is disconnecting.
ConnectedPendingKeepAlive - The connection is open, but has missed expected keep-alive messages.
ConnectedPendingNetwork - The connection is open, but the network connection has been disrupted. When the network recovers, the connection will continue serving traffic.
Connecting - Attempting to connect.
ConnectionDisrupted - The connection is disrupted and the network is available.
ConnectionDisruptedPendingNetwork - The connection is disrupted and the network connection is unavailable.
Disconnected - Connection has no active subscriptions and is disconnecting.

[chrisbonifacio]

Hi @rkvirajgupta can you let us know what operating system + browser you are using to reproduce this issue?
Can you also confirm that your subscription is working before the connection is disabled?

If you have any code that we can use to reproduce the issue, please share that as well.

Lastly, by "No internet" case, are you referring to the Windows OS wifi task bar's description of "No internet"? Judging from the screenshot that seems to be the case but I wonder if you are able to reproduce this on a different device with no connection such as a mobile or macOS device.

[rkvirajgupta]

@chrisbonifacio The OS is windows 10 & broswer is chrome.

Can you also confirm that your subscription is working before the connection is disabled?
Yes, the subscription restarts when the network is available in every case but the event is not coming in HUB

If you have any code that we can use to reproduce the issue, please share that as well.
I already shared a code snippet where it should send me an event that the connection is interrupted similar to other internet connection issues(already shared refer to my 2nd comment).

Lastly, I generated this issue using a mobile hotspot connected to my laptop and then I switch off my mobile data (Internet connection), and only the hotspot was still active on my mobile. after that, you will see the attached screenshot type, No-Internet case.

Let me know if you have any other questions.