[graphiql] For subscriptions "execute" button reverts back to "start" icon on receiving first update

[rootkea]

Is there an existing issue for this?

• I have searched the existing issues

Current Behavior

Hello!

When a subscription is set the "execute" button changes its icon to "stop" icon which is expected and shows that the subscription is in progress.

When a first data update is received the update is shown in output pane as expected but the "execute" button reverts back to the "start" icon indicating visually that the subscription is not in progress but in fact it is. The websocket connection is still intact and one can verify the same by generating another update for subscription or by taking look at network manager.

This is how it looks now:

And this is how it used to look previously (1.8.2):

Expected Behavior

The execute button should not revert back to "start" icon until subscription has closed. If the subscription is in progress then the "execute" button should have "stop" icon.

Steps To Reproduce

1. Execute subscription endpoint
2. Send update to subscription
3. Notice how "execute" button has reverted its icon to "start" icon indicating subscription is not in progress/has stopped.

Module pattern

• graphiql-umd
• graphiql-esm
• graphiql-commonjs

Environment

- GraphiQL Version: 2.0.7
- OS: Ubuntu 22.04.1 LTS
- Browser: Firefox 107.0.1 (64-bit)
- `react` Version: 17.0.2

Anything else?

No response

[thomasheyenbrock]

Hey @rootkea 👋 this has already been fixed in [email protected], see also #2907 and #2774