React dev tools unavailable

[platinumitpl]

Prerequisites

• Using yarn
• Using an up-to-date master branch
• Using latest version of devtools. Check the docs for how to update
• Tried solutions mentioned in #400
• For issue in production release, add devtools output of DEBUG_PROD=true yarn build && yarn start

Expected Behavior

The React tab should be available under the Chrome Developer Tool window.

Current Behavior

React tab is not available. I can see Redux dev tools only.

Steps to Reproduce

I have a standard configuration:

const installExtensions = async () => {
  const installer = require('electron-devtools-installer');
  const forceDownload = !!process.env.UPGRADE_EXTENSIONS;
  const extensions = ['REACT_DEVELOPER_TOOLS', 'REDUX_DEVTOOLS'];

  return Promise.all(
    extensions.map((name) => installer.default(installer[name], forceDownload))
  ).catch(console.log);
};

Possible Solution (Not obligatory)

Context

I would like to investigate a component state.

Your Environment

• Node version : v12.14.0
• electron-react-boilerplate version or branch : 1.3.0
• Operating System and version : macOS Catalina 10.15.5 (19F101)
• Link to your project :

[RafaelFontes]

In production release it is using the preload script parameter, therefore disabling some features.

If you need to make it work on production for now, don't use preload option on webPreferences.

[platinumitpl]

The issue occurs in the dev env. yarn dev.
Perhaps I shouldn't have checked the last checkbox in the issue description.

[amilajack]

This issue isn't reproducible with a fresh clone. Please provide more details

[platinumitpl]

I get the same results on a fresh clone - missing React dev tools.
What kind of details may help to track the bug?
I already posted software versions, so I don't see what else may help.

[amilajack]

Try running UPGRADE_EXTENSIONS=1 yarn run dev

[platinumitpl]

I read the docs and tried that already, didn't help.

[shutterkurt]

I have the same issue on Windows 10 with a clean clone - unzip was throwing an exception. looked into it and appears that the extension .crx file was empty due to a change on Google's end. same issue as described by MarshallOfSound/electron-devtools-installer#140. This was fixed in 3.1.1 - I bumped up the version and 'seems' like it fixed the issue (didn't run any tests other than it doesn't throw the exception anymore and extension tabs show up now)

[jooohhn]

Thanks @shutterkurt 🥳