fix /open-debugger failing after relaunching Metro/target app

[EdmondChuiHW]

Summary:
Changelog:
[iOS][Fixed] - "Reconnect DevTools" button not working sometimes

Hotfix for "Reconnect DevTools" button not working:

• T206141946 / WP: Reconnecting dev tools does not work after restarting the app
• T206754760 / WP: Can't launch DevTools from Metro sometimes

Basically, this dialog will keep reappearing like a bad dream:

{F1960030622}

Repro

Part 1 (Fixed in base stack D65973309)

1. Do NOT have Metro ready.
2. Build and run RNTester/FB Wilde
3. They should be using the local bundled version. App may prompt you to start Metro.
4. Start Metro
5. Go to the device Dev Menu (rage shake) and select Reload
6. Press r or d in Metro

Expected: Reload and Dev Menu work accordingly
Actual: Metro fails with No apps connected:

{F1960039703}

Part 2 (Fixed in this diff)

1. Open React Native DevTools via Metro j key or Dev Menu (rage shake)
2. Kill Metro
3. The RN DevTools should show the "disconnected" dialog
4. Start Metro
5. Click "Reconnect DevTools" in RN DevTools

Expected: reconnects
Actual: dialog reappears with an error in Metro:
{F1960043097}

Interestingly, the r and d keys from Metro works.

Root cause(s)

Part 1: See D65973309
Part 2:
The error indicates the target/device failed to call /inspector/device to register itself. The subsequent calls to /json/list returns empty and /open-debugger throws.

1. But because r & d (heh) works, we can observe that there is some kind of auto-reconnect mechanism:

https://www.internalfb.com/code/fbsource/[cfe1706a60b2]/xplat/js/react-native-github/packages/react-native/Libraries/WebSocket/RCTReconnectingWebSocket.m?lines=77-82

1. We do have auto-reconnect for j too:

https://www.internalfb.com/code/fbsource/[cfe1706a60b2]/xplat/js/react-native-github/packages/react-native/ReactCommon/jsinspector-modern/InspectorPackagerConnection.cpp?lines=246-254

But unfortunately it only tries once. A long-term fix would be calling reconnect recursively like the Objective-C impl above, e.g.

  delegate_->scheduleCallback(
      [weakSelf = weak_from_this()] {
        auto strongSelf = weakSelf.lock();
        if (strongSelf && !strongSelf->closed_) {
          strongSelf->reconnectPending_ = false;
          strongSelf->connect();

          // Keep trying. Never. Give. Up.
          if (!strongSelf->isConnected()) {
            strongSelf->reconnect();
          }
        }
      },
      RECONNECT_DELAY);

It appears that the current impl of isConnected() is not a true reflection of the web socket state. My time box for this task ran out, so we'll do a hot fix for the short-term: since we know r & d reliably reconnects, we'll piggy-back on its lifecycle to attempt reconnection. This works.

PS

If you start the app with Metro running in step 1, this bug is not present. This is the reason why FB Wilde/Marketplace/Quantum engineers run into this more often (because its custom menu changes the JS URL after start up)

Differential Revision: D65952134

[facebook-github-bot]

This pull request was exported from Phabricator. Differential Revision: D65952134

[facebook-github-bot]

This pull request was exported from Phabricator. Differential Revision: D65952134