electron-devtools-installer
electron-devtools-installer copied to clipboard
REDUX_DEV_TOOLS Failed to fetch extension
electron-devtools-installer is working properly for React Development Tools but not for Redux DevTools.
Given: "electron-devtools-installer": "^3.2.0" "electron": "^9.4.4"
in electron.js: `const { default: installExtension, REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS } = require ( 'electron-devtools-installer' );
app.whenReady ().then ( () => {
installExtension( REDUX_DEVTOOLS, {forceDownload: true, loadExtensionOptions: { allowFileAccess: true } } )
.then( ( name ) => console.log( `Added Extension: ${ name }` ) )
.catch( ( err ) => console.error( 'An error occurred "redux_devtools": ', err ) );
installExtension( REACT_DEVELOPER_TOOLS )
.then( ( name ) => console.log( `Added Extension: ${ name }` ) )
.catch( ( err ) => console.error( 'An error occurred "react_devtools": ', err ) );
} )
`
Output shows:
Failed to fetch extension, trying 3 more times ... Failed to fetch extension, trying 2 more times Failed to fetch extension, trying 1 more times Failed to fetch extension, trying 0 more times An error occurred "redux_devtools": Error: net::ERR_BLOCKED_BY_RESPONSE at SimpleURLLoaderWrapper.
(electron/js2c/browser_init.js:93:6395) at SimpleURLLoaderWrapper.emit (events.js:223:5)
Observed behavior: Redux devtools isn't downloaded.
I've the same issue but it affects all extensions not just REDUX_DEVTOOLS.
Here's what I know so far:
- electron-devtools-installer makes a request to: https://clients2.google.com/service/update2/crx?response=redirect&acceptformat=crx2,crx3&x=id%3Dfmkadmapgofadopljbjfkapdkoienihi%26uc&prodversion=32
- it gets redirected to a URL such as: https://clients2.googleusercontent.com/crx/blobs/Acy1k0YPCCw7_6kyVvR3KPdqEXPd5F3KNJJeK035UMnlLHI6yzEjofXyx-PZKe5JR8Wqtxaw5ZGKZQgLCVO6XvblG2ERSHWWAAn7LKerrPN69tVXnOM3AMZSmuXTTAOgKDAvhdTSbraRZcSHsS1sEw/extension_4_24_0_0.crx
- on the second response, Cross-Origin-Resource-Policy is set to 'same-site'. When I intercept the response using a proxy and remove that response header before the response is set to electron, everything works fine.
So the culprit is CORS. I tried removing the response header by listening to onBeforeSendHeaders, onHeadersReceived and onBeforeRedirect; and modifying requests/responses. But (and this might be a bug in electron) onHeadersReceived doesn't get called for the second request, maybe because it's the result of a redirection?
electron-devtools-installer is working properly for React Development Tools but not for Redux DevTools.
Given: "electron-devtools-installer": "^3.2.0" "electron": "^9.4.4"
in electron.js: `const { default: installExtension, REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS } = require ( 'electron-devtools-installer' );
app.whenReady ().then ( () => { installExtension( REDUX_DEVTOOLS, {forceDownload: true, loadExtensionOptions: { allowFileAccess: true } } ) .then( ( name ) => console.log( `Added Extension: ${ name }` ) ) .catch( ( err ) => console.error( 'An error occurred "redux_devtools": ', err ) ); installExtension( REACT_DEVELOPER_TOOLS ) .then( ( name ) => console.log( `Added Extension: ${ name }` ) ) .catch( ( err ) => console.error( 'An error occurred "react_devtools": ', err ) ); } )
`
Output shows:
Failed to fetch extension, trying 3 more times ... Failed to fetch extension, trying 2 more times Failed to fetch extension, trying 1 more times Failed to fetch extension, trying 0 more times An error occurred "redux_devtools": Error: net::ERR_BLOCKED_BY_RESPONSE at SimpleURLLoaderWrapper. (electron/js2c/browser_init.js:93:6395) at SimpleURLLoaderWrapper.emit (events.js:223:5)
Observed behavior: Redux devtools isn't downloaded.
We're also experiencing this in VueJS Devtools as well. What's the workaround solution for this?
@dialqueza I have created a workaround patch you can try this
"electron-devtools-installer": "git+https://github.com/mduclehcm/electron-devtools-installer#mduclehcm-patch-1",