javascript - Electron.JS + devtoolsinstaller: 'BrowserWindow.addDevToolsExtension' is deprecated and will be rem

admin管理员组

文章数量:1356045

After updating my Electron app from Electron 8.2.5 to 9.0.0, the following errors start to appear in the terminal:

[1] (electron) 'BrowserWindow.addDevToolsExtension' is deprecated and will be removed. Please use 'session.loadExtension' instead.
[1] Added Extension:  [object Object]
[1] (electron) 'BrowserWindow.getDevToolsExtensions' is deprecated and will be removed. Please use 'session.getAllExtensions' instead.
[1] Added Extension:  [object Object]

My electron app uses electron-devtools-installer to install React Developer Tools and Redux DevTools after the Electron app has loaded.

How can we make use of session.loadExtension and session.getAllExtensions to install devtools properly in Electron 9?

---

const electron = require("electron");
const app = electron.app;
const path = require("path");
const isDev = require("electron-is-dev");
let mainWindow;
const BrowserWindow = electron.BrowserWindow;

const installExtensions = async () => {
  const { default: installExtension, REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS } = require('electron-devtools-installer');

  const extensions = [REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS];
  for (const extension of extensions) {
    try {
      const name = await installExtension(extension);
      console.log(`Added Extension:  ${name}`);
    } catch (e) {
      console.log('An error occurred: ', err);
    }
  }
}

...

app.on("ready", async () => {
  createWindow();

  if (isDev) {
    await installExtensions();
    mainWindow.webContents.on("did-frame-finish-load", () => {
      mainWindow.webContents.once("devtools-opened", () => {
        mainWindow.focus();
      });
      mainWindow.webContents.openDevTools({
        mode: 'undocked'
      });
    });
  }
});

After updating my Electron app from Electron 8.2.5 to 9.0.0, the following errors start to appear in the terminal:

[1] (electron) 'BrowserWindow.addDevToolsExtension' is deprecated and will be removed. Please use 'session.loadExtension' instead.
[1] Added Extension:  [object Object]
[1] (electron) 'BrowserWindow.getDevToolsExtensions' is deprecated and will be removed. Please use 'session.getAllExtensions' instead.
[1] Added Extension:  [object Object]

My electron app uses electron-devtools-installer to install React Developer Tools and Redux DevTools after the Electron app has loaded.

How can we make use of session.loadExtension and session.getAllExtensions to install devtools properly in Electron 9?

---

const electron = require("electron");
const app = electron.app;
const path = require("path");
const isDev = require("electron-is-dev");
let mainWindow;
const BrowserWindow = electron.BrowserWindow;

const installExtensions = async () => {
  const { default: installExtension, REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS } = require('electron-devtools-installer');

  const extensions = [REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS];
  for (const extension of extensions) {
    try {
      const name = await installExtension(extension);
      console.log(`Added Extension:  ${name}`);
    } catch (e) {
      console.log('An error occurred: ', err);
    }
  }
}

...

app.on("ready", async () => {
  createWindow();

  if (isDev) {
    await installExtensions();
    mainWindow.webContents.on("did-frame-finish-load", () => {
      mainWindow.webContents.once("devtools-opened", () => {
        mainWindow.focus();
      });
      mainWindow.webContents.openDevTools({
        mode: 'undocked'
      });
    });
  }
});

• javascript
• node.js
• reactjs
• electron
• google-chrome-devtools

Share Improve this question Follow asked May 19, 2020 at 15:00 NyxynyxNyxynyx 63.8k163163 gold badges507507 silver badges856856 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 8

Regarding the log error:

[1] Added Extension:  [object Object]

I ran into the same problem. installExtension actually returns the extension object and you can get the extension name with:

const installedExt = await installExtension(extension);
console.log(`Added Extension:  ${installedExt.name}`);

Regarding the deprecation warning:

[1] (electron) 'BrowserWindow.addDevToolsExtension' is deprecated and will be removed. Please use 'session.loadExtension' instead.

The package electron-devtools-installer should be updated to support the new way of registering the devtools as explained in: Electron API docs for devtools extension

Example:

const { app, BrowserWindow, session } = require('electron')
const mainWindow = new BrowserWindow({...})

const ext = await session.defaultSession.loadExtension('/path/to/unpacked/chrome-ext')

I will try to make a PR for this package to fix the deprecation warning.

Please let me know if this helps.

本文标签：