Applications doesn't handle error during in browser subscription

[data-sync-user]

I am not sure how to manually reproduce this, but I recently wrote a functional test that mocked this scenario inside the testSubscriptionNeeded test suite:

it("subscription error", async () => {
  // Click the "Subscribe now" button
  await vpn.waitForQueryAndClick(queries.screenSubscriptionNeeded.SUBSCRIPTION_NEEDED_BUTTON.visible());

  // Override directly in the running guardian server for this test.
  // Note: this is mocking an internal server error, but we should mock other stuff.
  this.ctx.guardianServer.overrideEndpoints = {
    POSTs: {
      '/api/v2/vpn/login/verify': {
        status: 500,
      }
    }
  };

  // Subscription, for Guardian, is the same as in-browser auth.
  await vpn.mockInBrowserAuthentication();

  // Sleep for a minute, see what happens here. 
  // Spoiler: user is left hanging.
  await vpn.wait(60 * 1000);

  // Reset the Gaurdian overrides.
  this.ctx.guardianServer.overrideEndpoints = this.ctx.guardianOverrideEndpoints;
});

Expected behaviour:

• Application handles the error gracefully e.g. by showing the user a message and automatically cancelling the subscription flow.

Actual behaviour:

• Aplication does nothing and it is up to the user to manually cancel the subscription flow.

┆Issue is synchronized with this Jira Task
┆Reporter: Beatriz Rizental Machado

[data-sync-user]

➤ Valentina Virlics commented:

Beatriz Rizental Machado stating a subscription from the client, and having a different currency in the browser, should trigger a subscription error in the web, I think. Should this work to verify this?

[data-sync-user]

➤ Beatriz Rizental Machado commented:

Valentina Virlics It might work! The error returned by the browser will be different for sure. Would you mind checking and letting me know?

[data-sync-user]

➤ Valentina Virlics commented:

While disconnecting from the internet, nothing happens in the client, but I suppose, this is not yet fixed Seems like a good way to verify it after the fix.

!image-20240502-132115.png|width=1508,height=829,alt="image-20240502-132115.png"!

[data-sync-user]

➤ Beatriz Rizental Machado commented:

Awesome, thanks!

[data-sync-user]

➤ Santiago Andrigo commented:

{panel:bgColor=#deebff}
Moving to high as this can block a user from moving forward during the user journey of purchasing a VPN sub.
{panel}