Handling connection handshake error

[JohnEmadNashed]

Note: If your issue/feature-request/question is regarding the AWS AppSync service, please log it in the official AWS AppSync forum

Current behavior steps to reproduce

1- Subscribe to Appsync with stable network connectivity 2- Disable network connectivity 3- App shows Error: "error":{"errors":[{"message":"Connection failed: Connection handshake error"}]}}, is it fatal: true undefined undefined. 4- Afterwards the app crashes on production level.

The JS code where it crashes:

subscribeToNewMessages = () => {
    this.newMessagesListener = API.graphql(
        graphqlOperation(onCreateChatMessageWithMapping, { recipient_id: this.props.loggedInUser.id }),
    ).subscribe({
        next: (newMessageData) => {
            if (newMessageData.value.data && newMessageData.value.data.onCreateChatMessageWithMapping) {
                let newMessage = newMessageData.value.data.onCreateChatMessageWithMapping;
                this.props.incUserChatMapping(newMessage.chat_id);
            }
        },
        error: e => {
            console.log('CHAT ERROR', e); //This is where the error comes from. 
        },
        complete: c => {
            console.log('CHAT COMPLETE', c);
        },
    });

    this.updatedMessagesListener = API.graphql(
        graphqlOperation(onUpdateChatMessage, { recipient_id: this.props.loggedInUser.id }),
    ).subscribe({
        next: (updatedMessageData) => {
            if (updatedMessageData.value.data && updatedMessageData.value.data.onUpdateChatMessage) {
                let updatedMessage = updatedMessageData.value.data.onUpdateChatMessage;
                this.props.decUserChatMapping(updatedMessage.chat_id);
            }
        },
    });
};

React Native version affected.

"react-native": "0.63.4",

[hmelenok]

Have the same in web:

apolloClient.subscribe({query: TaskSubscription}).subscribe({next: console.warn});

Occurred after update from v2 with this configuration:

const httpLink = createAppSyncLink({
  ...credentials,
  resultsFetcherLink: ApolloLink.from([
    setContext((_request, previousContext) => ({
      headers: {
        ...previousContext.headers,
        'x-api-key': AppSyncConfig.API_KEY as string,
      },
    })),
    createHttpLink({
      uri: AppSyncConfig.API_URL,
    }),
  ]),
  complexObjectsCredentials: (): null => null,
});

export const apolloClient = new AWSAppSyncClient(
  {
    ...credentials,
    disableOffline: true,
  },
  {
    link: httpLink,
    cache: new InMemoryCache({addTypename: false}) as any,
  }
);