question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Android] Device plugin 'Hermes Debugger (RN)' is not supported by the selected device

See original GitHub issue

🐛 Bug Report

I can’t get Hermes debugger working - it is unavailable. Got "Device plugin ‘Hermes Debugger (RN)’ is not supported by the selected device". Created multiple emulators - nothing.

Other plugins like Databases and Layout work.

How can device not support the plugin?

To Reproduce

custom metro port: 8082 enableHermes: true FLIPPER_VERSION=0.156.0

Initialization:

public class ReactNativeFlipper {
    public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
        if (!FlipperUtils.shouldEnableFlipper(context)) return;

        final FlipperClient client = AndroidFlipperClient.getInstance(context);

        client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
        client.addPlugin(new ReactFlipperPlugin());
        client.addPlugin(new DatabasesFlipperPlugin(context));
        client.addPlugin(new SharedPreferencesFlipperPlugin(context));
        client.addPlugin(CrashReporterPlugin.getInstance());

        NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
        NetworkingModule.setCustomClientBuilder(
                new NetworkingModule.CustomClientBuilder() {
                    @Override
                    public void apply(OkHttpClient.Builder builder) {
                        builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
                    }
                });
        client.addPlugin(networkFlipperPlugin);

        client.start();
    }
}

app/build.gradle

    // INIT https://github.com/react-native-community/react-native-template-typescript/blob/main/template/android/app/build.gradle
    debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
        exclude group:'com.facebook.fbjni'
    }
    debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
        exclude group:'com.facebook.flipper'
        exclude group:'com.squareup.okhttp3', module:'okhttp'
    }

Environment

  1. Emulators with api 31 and 33, arm64-v8a
  2. Flipper 0.157.0
  3. deps:
"react-native": "0.67.2",

devDeps:

"react-native-flipper": "0.157.0",
"react-native-performance": "3.1.1",
"react-native-performance-flipper-reporter": "3.0.0",

Using custom port for metro 8082.

Issue Analytics

  • State:open
  • Created a year ago
  • Reactions:3
  • Comments:15

github_iconTop GitHub Comments

2reactions
gentleecommented, Aug 19, 2022

And also there should be a proper message why plugin is not available, but not device not supported !!!

Flipper is a pure pain 💩

1reaction
zhangstar666commented, Nov 7, 2022

Same here. I just want to start the sample project of Reanimted and debug it. But Flipper tell me: "Device plugin ‘Hermes Debugger (RN)’ is not supported by the selected device ‘sdk_gphone_x86_64_arm64’ (Android)." image

The strange thing is that Flipper’s log outputs. 4 plugin(s) were loaded in legacy mode. Hermes Debugger (RN) (id: Hermesdebuggerrn)

It looks like Flipper has loaded Hermes Debugger plugin correctly. image

Read more comments on GitHub >

github_iconTop Results From Across the Web

Flipper Hermes debugger does not show - Stack Overflow
Open a React Native screen with Hermes enabled to connect. Note: you may need to reload the app in order to reconnect the...
Read more >
Debugging in React Native with Flipper - Medium
Flipper is a platform for debugging iOS, Android, and React Native apps. It is an open-source debugging tool developed by Facebook.
Read more >
Using Hermes - React Native
Debugging JS on Hermes using Google Chrome's DevTools​. Hermes supports the Chrome debugger by implementing the Chrome inspector protocol. This ...
Read more >
React Native | WebStorm Documentation - JetBrains
If you are using an Android device, you need to prepare it every time you start working with an application. An iOS simulator...
Read more >
React Native Support - Flipper
The 'React Native' device feature two plugins out of the box: 'Logs' and 'React ... the plugin eco-system that exists for native Android...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found