Aller au contenu principal

Evolution de notre écosystème vers le Node 22

· 3 mins de lecture

Au début de l'année 2025, le repos de l'écosystème npm d'Electron (sous les espaces de noms @electron/ et @electron-forge/) passera à Node.js 22 pour la version minimale supportée.


Qu’est-ce que ça signifie ?

Dans le passé, les paquets dans l'écosystème npm d'Electron (Forge, Packager, etc) ont pris en charge les versions de Node aussi longtemps que possible, même une fois qu'une version a atteint sa date de fin de vie (EOL) . Ceci pour s'assurer que nous ne fragmentons pas l'écosystème - nous comprenons bien que de nombreux projets dépendent des anciennes versions de Node, et nous ne voulons pas risquer de bloquer ces projets à moins qu’il y ait une raison pressante de les améliorer.

Avec le temps, l'utilisation de Node.js 14 comme notre version minimale est devenue de plus en plus difficile pour quelques raisons :

  • Le manque de versions officielles de Node.js 14 pour macOS ARM64 nous oblige à maintenir des solutions d'infrastructure de CI pour fournir une couverture de test complète.
  • engines requirements for upstream package dependencies have moved forward, making it increasingly difficult to resolve supply chain security issues with dependency bumps.

Additionally, newer versions of Node.js have included many improvements that we would like to leverage, such as runtime-native common utilities (e.g. fs.glob and util.parseArgs) and entire new batteries-included modules (e.g. node:test, node:sqlite).

Pourquoi mettre à niveau maintenant ?

In July 2024, Electron’s Ecosystem Working Group decided to upgrade all packages to the earliest Node version where require()of synchronous ESM graphs will be supported (see nodejs/node#51977 and nodejs/node#53500) at a future point after that version reaches its LTS date.

Nous avons décidé d'effectuer cette de mise à jour en Janvier/Février 2025. Après cette mise à jour, Node 22 sera la version minimale supportée dans les paquets écosystèmes existants.

Quelles mesures devrais-je prendre ?

Nous nous efforcerons de maintenir la compatibilité autant que possible. Cependant, pour assurer le meilleur support possible, nous vous encourageons à mettre à jour vos applications vers Node 22 ou plus.

Notez que la version de Node exécutée dans votre projet n'est pas liée à la version de Node embarquée dans votre version actuelle d'Electron.

Et pour la suite

N'hésitez pas à nous joindre sur info@electronjs.org](mailto:info@electronjs.org si vous avez des questions ou des préoccupations. Vous pouvez également obtenir le support de la communauté sur notre Discord Electron.

Mois du silence de décembre (déc. 24)

· 2 mins de lecture

Le projet Electron fera une pause pour le mois de décembre 2024 et reviendra gonflé à bloc en janvier 2025.

via GIPHY


Ce qui ne changera pas en Décembre

  1. Les versions zero-day et autres versions majeures liées à la sécurité seront publiées si nécessaire. Les incidents de sécurité doivent être signalés via SECURITY.md.
  2. Les rapports du Code de conduite et la modération se poursuivront normalement.

Ce qui sera différent en Décembre

  1. Les dernières versions de la branche stable de l'année 2024, dont Electron 31, 32 et 33, auront lieu la semaine du 1er décembre. Il n'y aura pas de nouvelles sorties prévues en décembre.
  2. Pas de sorties Nightly et Alpha pour les deux dernières semaines de décembre.
  3. À quelques exceptions près, il n'y aura pas de ré-éxamen de pull request ni de merge.
  4. Aucune mise à jour de suivi de tickets sur aucun dépôt.
  5. Aucune aide de débogage de la part des mainteneurs sur Discord.
  6. Aucune mise à jour du contenu des réseaux sociaux.

On se revoit en 2025!

Migrating from BrowserView to WebContentsView

· 4 mins de lecture

BrowserView has been deprecated since Electron 30 and is replaced by WebContentView. Thankfully, migrating is fairly painless.


Electron is moving from BrowserView to WebContentsView to align with Chromium’s UI framework, the Views API. WebContentsView offers a reusable view directly tied to Chromium’s rendering pipeline, simplifying future upgrades and opening up the possibility for developers to integrate non-web UI elements to their Electron apps. By adopting WebContentsView, applications are not only prepared for upcoming updates but also benefit from reduced code complexity and fewer potential bugs in the long run.

Developers familiar with BrowserWindows and BrowserViews should note that BrowserWindow and WebContentsView are subclasses inheriting from the BaseWindow and View base classes, respectively. To fully understand the available instance variables and methods, be sure to consult the documentation for these base classes.

Migration steps

1. Upgrade Electron to 30.0.0 or higher

avertissement

Electron releases may contain breaking changes that affect your application. It’s a good idea to test and land the Electron upgrade on your app first before proceeding with the rest of this migration. A list of breaking changes for each Electron major version can be found here as well as in the release notes for each major version on the Electron Blog.

2. Familiarize yourself with where your application uses BrowserViews

One way to do this is to search your codebase for new BrowserView(. This should give you a sense for how your application is using BrowserViews and how many call sites need to be migrated.

astuce

For the most part, each instance where your app instantiates new BrowserViews can be migrated in isolation from the others.

3. Migrate each usage of BrowserView

  1. Migrate the instantiation. This should be fairly straightforward because WebContentsView and BrowserView’s constructors have essentially the same shape. Both accept WebPreferences via the webPreferences param.

    - this.tabBar = new BrowserView({
    + this.tabBar = new WebContentsView({
    info

    By default, WebContentsView instantiates with a white background, while BrowserView instantiates with a transparent background. To get a transparent background in WebContentsView, set its background color to an RGBA hex value with an alpha (opaqueness) channel set to 00:

    + this.webContentsView.setBackgroundColor("#00000000");
  2. Migrate where the BrowserView gets added to its parent window.

    - this.browserWindow.addBrowserView(this.tabBar)
    + this.browserWindow.contentView.addChildView(this.tabBar);
  3. Migrate BrowserView instance method calls on the parent window.

    Old MethodNew MethodRemarques
    win.setBrowserViewwin.contentView.removeChildView + win.contentView.addChildView
    win.getBrowserViewwin.contentView.children
    win.removeBrowserViewwin.contentView.removeChildView
    win.setTopBrowserViewwin.contentView.addChildViewCalling addChildView on an existing view reorders it to the top.
    win.getBrowserViewswin.contentView.children
  4. Migrate the setAutoResize instance method to a resize listener.

    - this.browserView.setAutoResize({
    - vertical: true,
    - })

    + this.browserWindow.on('resize', () => {
    + if (!this.browserWindow || !this.webContentsView) {
    + return;
    + }
    + const bounds = this.browserWindow.getBounds();
    + this.webContentsView.setBounds({
    + x: 0,
    + y: 0,
    + width: bounds.width,
    + height: bounds.height,
    + });
    + });
    astuce

    All existing usage of browserView.webContents and instance methods browserView.setBounds, browserView.getBounds , and browserView.setBackgroundColor do not need to be migrated and should work with a WebContentsView instance out of the box!

4) Test and commit your changes

Running into issues? Check the WebContentsView tag on Electron's issue tracker to see if the issue you're encountering has been reported. If you don't see your issue there, feel free to add a new bug report. Including testcase gists will help us better triage your issue!

Congrats, you’ve migrated onto WebContentsViews! 🎉

Electron 33.0.0

· 5 mins de lecture

Electron 33.0.0 est disponible ! It includes upgrades to Chromium 130.0.6723.44, V8 13.0, and Node 20.18.0.


L’équipe Electron est heureuse d’annoncer la sortie d’Electron 33.0.0 ! Vous pouvez l'installer avec npm via npm install electron@latest ou le télécharger sur notre site web de téléchargement de version. Vous obtiendrez plus de détails sur cette version en lisant ce qui suit.

Si vous avez des commentaires, veuillez les partager avec nous sur [Twitter] (https://twitter.com/electronjs) ou Mastodon, ou joignez-vous à notre communauté [Discord] (https://discord.com/invite/electronjs)! Les bogues et les demandes de fonctionnalités peuvent être signalés dans l'[outil de suivi des problèmes] d’Electron (https://github.com/electron/electron/issues).

Changements notables

  • Ajout d'un gestionnaire, app.setClientCertRequestPasswordHandler(handler), pour faciliter le déverrouillage des périphériques cryptographiques quand un code PIN est nécessaire. #41205
  • Extended navigationHistory API with 2 new functions for better history management. #42014
  • Improved native theme transparency checking. #42862

Introduction à l'historique de l'API (GSoC 2024)

· 8 mins de lecture

L'historique des changements des différentes API Electron sera maintenant détaillé dans la documentation.


Bonjour 👋, je suis Peter, le contributeur Electron pour le Google Summer of Code (GSoC).

Over the course of the GSoC program, I implemented an API history feature for the Electron documentation and its functions, classes, etc. in a similar fashion to the Node.js documentation: by allowing the use of a simple but powerful YAML schema in the API documentation Markdown files and displaying it nicely on the Electron documentation website.

Electron 32.0.0

· 5 mins de lecture

Electron 32.0.0 est disponible ! Il inclut une mise à niveau vers Chromium 128.0.6613.36, V8 12.8, et Node 20.16.0.


L’équipe d'Electron est heureuse d’annoncer la sortie d’Electron 32.0.0 ! Vous pouvez l'installer avec npm via npm install electron@latest ou le télécharger sur notre site web de téléchargement de version. Vous obtiendrez plus de détails sur cette version en lisant ce qui suit.

Si vous avez des commentaires, veuillez les partager avec nous sur [Twitter] (https://twitter.com/electronjs) ou Mastodon, ou joignez-vous à notre communauté [Discord] (https://discord.com/invite/electronjs)! Les bogues et les demandes de fonctionnalités peuvent être signalés dans l'[outil de suivi des problèmes] d’Electron (https://github.com/electron/electron/issues).

Changements notables

  • Ajout d'un nouvel historique de version de l'API dans notre documentation, une fonctionnalité créée par @piotrpdev dans le cadre de Google Summer of Code. Vous pouvez en savoir plus à ce sujet dans cet article de blog. #42982
  • Suppression de l'extension File.\path non standard de l'API Web File. #42053
  • #42993
  • Ajout des API existantes suivantes liées à la navigation à webcontents.navigationHistory: canGoBack, goBack, canGoForward, goForward, canGoToOffset, goToOffset, clear. Les API de navigation précédentes est désormais obsolète. #41752

Electron 31.0.0

· 4 mins de lecture

Electron 31.0.0 est disponible ! It includes upgrades to Chromium 126.0.6478.36, V8 12.6, and Node 20.14.0.


L’équipe Electron est heureuse d’annoncer la sortie d’Electron 31.0.0 ! Vous pouvez l'installer avec npm via npm install electron@latest ou le télécharger sur notre site web de téléchargement de version. Vous obtiendrez plus de détails sur cette version en lisant ce qui suit.

Si vous avez des commentaires, veuillez les partager avec nous sur [Twitter] (https://twitter.com/electronjs) ou Mastodon, ou joignez-vous à notre communauté [Discord] (https://discord.com/invite/electronjs)! Les bogues et les demandes de fonctionnalités peuvent être signalés dans l'[outil de suivi des problèmes] d’Electron (https://github.com/electron/electron/issues).

Changements notables

  • Extended WebContentsView to accept pre-existing webContents object. #42319
  • Added support for NODE_EXTRA_CA_CERTS. #41689
  • Updated window.flashFrame(bool) to flash continuously on macOS. #41391
  • Removed WebSQL support #41868
  • nativeImage.toDataURL will preserve PNG colorspace #41610
  • Extended webContents.setWindowOpenHandler to support manual creation of BrowserWindow. #41432

Electron 30.0.0

· 5 mins de lecture

Electron 30.0.0 est disponible ! It includes upgrades to Chromium 124.0.6367.49, V8 12.4, and Node.js 20.11.1.


L’équipe Electron est heureuse d’annoncer la sortie d’Electron 30.0.0 ! Vous pouvez l'installer avec npm via npm install electron@latest ou le télécharger sur notre site web de téléchargement de version. Vous obtiendrez plus de détails sur cette version en lisant ce qui suit.

Si vous avez des commentaires, veuillez les partager avec nous sur [Twitter] (https://twitter.com/electronjs) ou Mastodon, ou joignez-vous à notre communauté [Discord] (https://discord.com/invite/electronjs)! Les bogues et les demandes de fonctionnalités peuvent être signalés dans l'[outil de suivi des problèmes] d’Electron (https://github.com/electron/electron/issues).

Changements notables

  • ASAR Integrity fuse now supported on Windows (#40504)
    • Existing apps with ASAR Integrity enabled may not work on Windows if not configured correctly. Apps using Electron packaging tools should upgrade to @electron/packager@18.3.1 or @electron/forge@7.4.0.
    • Take a look at our ASAR Integrity tutorial for more information.
  • Added WebContentsView and BaseWindow main process modules, deprecating & replacing BrowserView (#35658). Learn more about how to migrate from BrowserView to WebContentsView in this blog post.
    • BrowserView is now a shim over WebContentsView and the old implementation has been removed.
    • See our Web Embeds documentation for a comparison of the new WebContentsView API to other similar APIs.
  • Implemented support for the File System API (#41827)

Le Google Summer of Code 2024

· 5 mins de lecture

Nous sommes heureux d'annoncer qu'Electron a été accepté en tant qu'organisation de mentorat pour la 20e édition du Google Summer of Code (GSoC) 2024 ! Le Google Summer of Code est un programme mondial visant à amener de nouveaux contributeurs à participer au développement de logiciels libres.

Pour plus de détails sur le programme, consultez la page d'accueil de Google Summer of Code.

À propos de nous

Electron est un framework JavaScript pour la construction d'applications de bureau multi-plateformes en utilisant les technologies web. Le framework cœur d'Electron est un exécutable binaire compilé avec Chromium et Node.js, et est principalement écrit en C++.

En dehors du cœur d'Electron, nous travaillons également sur une variété de projets pour aider à soutenir l'organisation Electron, comme :

En tant que contributeur du Summer of Code, vous seriez en train de collaborer avec certains des principaux contributeurs d'Electron sur l'un des nombreux projets sous github.com/electron parapluie.

Avant la demande

Si vous n'êtes pas très familier avec Electron, nous vous recommandons de commencer par lire la documentation et d'essayer des exemples dans Electron Fiddle.

Pour en savoir plus sur la distribution des applications Electron, vous pouvez également jouer avec Electron Forge en créant un exemple d'application :

npm init electron-app@latest my-app

Après vous être familiarisé un peu avec le code, venez rejoindre la conversation sur le serveur Discord Electron.

info

Si c'est la première fois que vous participez au Google Summer of Code ou si vous êtes novice en matière d'open source en général, nous vous recommandons de lire le Guide du contributeur de Google dans un premier temps avant de vous engager dans la communauté.

Ébauche de votre proposition

Êtes-vous intéressé à collaborer avec Electron? Premièrement, prenez le temps de regarder les sept idées de projets brouillons que nous avons préparé. Toutes les idées listées sont actuellement ouvertes aux propositions.

Vous avez une idée différente que vous aimeriez que nous prenions en considération ? Nous sommes également ouverts à l'acceptation de nouvelles idées que ne sont pas sur la liste de projet proposée, mais assurez-vous que votre approche est détaillée et détaillée. En cas de doute, nous vous recommandons de vous en tenir à nos idées énumérées.

Votre candidature devra inclure :

  • Votre proposition, avec un document écrit qui décrit en détail votre plan de ce que vous comptez achever au cours de cet été.
  • Votre expérience en tant que développeur. Si vous avez un curriculum vitae, veuillez en inclure une copie. Sinon, parlez nous de votre expérience technique passée.
    • Le manque d'expérience dans certains domaines ne vous disqualifiera pas, mais cela aidera nos mentors à élaborer un plan pour vous soutenir au mieux et s'assurer que votre projet d'été est couronné de succès.

Un guide détaillé de ce qu'il faut soumettre dans le cadre de votre demande Electron est ici. Soumettez des propositions directement sur le portail Google Summer of Code. Notez que les propositions envoyées à l'équipe Electron plutôt que soumises via le portail de candidature ne seront pas considérées comme une soumission finale.

Si vous voulez plus de conseils sur votre proposition ou si vous n'êtes pas certain de ce qu'il faut inclure, nous vous recommandons également de suivre le conseil officiel de Google Summer of Code en écrivant des propositions.

Les demandes sont ouvertes le 18 mars 2024 et fermées le 2 avril 2024.

info

Notre stagiaire Google Summer of Code 2022, @aryanshridhar, a fait un travail incroyable ! Si vous voulez savoir sur quoi Aryan a travaillé pendant son été avec Electron, , vous pouvez lire son rapport dans les archives du programme GSoC 2022.

Questions?

Si vous avez des questions que nous n'avons pas traitées dans le blog ou des demandes de renseignements pour votre projet de proposition, veuillez nous envoyer un email à summer-of-code@electronjs. rg ou vérifiez GSoC FAQ!

Ressources

Electron 29.0.0

· 5 mins de lecture

Electron 29.0.0 est disponible ! Comprend des mises à niveaux vers et Node.js.


L’équipe Electron est heureuse d’annoncer la sortie d’Electron 29.0.0 ! Vous pouvez l'installer avec npm via npm install electron@latest ou le télécharger sur notre site web de téléchargement de version. Vous obtiendrez plus de détails sur cette version en lisant ce qui suit.

Si vous avez des commentaires, veuillez les partager avec nous sur [Twitter] (https://twitter.com/electronjs) ou Mastodon, ou joignez-vous à notre communauté [Discord] (https://discord.com/invite/electronjs)! Les bogues et les demandes de fonctionnalités peuvent être signalés dans l'[outil de suivi des problèmes] d’Electron (https://github.com/electron/electron/issues).

Changements notables

  • Added a new top-level webUtils module, a renderer process module that provides a utility layer to interact with Web API objects. The first available API in the module is webUtils.getPathForFile. Electron's previous File.path augmentation was a deviation from web standards; this new API is more in line with current web standards behavior.

Changements de la Stack

Electron 29 upgrades Chromium from 120.0.6099.56 to 122.0.6261.39, Node from 18.18.2 to 20.9.0, and V8 from 12.0 to 12.2.

Nouvelles fonctionnalités

  • Added new webUtils module, a utility layer to interact with Web API objects, to replace File.path augmentation. #38776
  • Added net module to utility process. #40890
  • Added a new Electron Fuse, grantFileProtocolExtraPrivileges, that opts the file:// protocol into more secure and restrictive behaviour that matches Chromium. #40372
  • Added an option in protocol.registerSchemesAsPrivileged to allow V8 code cache in custom schemes. #40544
  • Migrated app.{set|get}LoginItemSettings(settings) to use Apple's new recommended underlying framework on macOS 13.0+. #37244

Changements majeurs avec rupture de compatibilité

Comportement changement : ipcRenderer ne peut plus être envoyée vers contextBridge

Attempting to send the entire ipcRenderer module as an object over the contextBridge will now result in an empty object on the receiving side of the bridge. This change was made to remove / mitigate a security footgun. You should not directly expose ipcRenderer or its methods over the bridge. Instead, provide a safe wrapper like below:

contextBridge.exposeInMainWorld('app', {
onEvent: (cb) => ipcRenderer.on('foo', (e, ...args) => cb(args)),
});

Removed: renderer-process-crashed event on app

The renderer-process-crashed event on app has been removed. Use the new render-process-gone event instead.

// Removed
app.on('renderer-process-crashed', (event, webContents, killed) => {
/* ... */
});

// Replace with
app.on('render-process-gone', (event, webContents, details) => {
/* ... */
});

Removed: crashed event on WebContents and <webview>

The crashed events on WebContents and <webview> have been removed. Use the new render-process-gone event instead.

// Removed
win.webContents.on('crashed', (event, killed) => {
/* ... */
});
webview.addEventListener('crashed', (event) => {
/* ... */
});

// Replace with
win.webContents.on('render-process-gone', (event, details) => {
/* ... */
});
webview.addEventListener('render-process-gone', (event) => {
/* ... */
});

Removed: gpu-process-crashed event on app

The gpu-process-crashed event on app has been removed. Use the new child-process-gone event instead.

// Removed
app.on('gpu-process-crashed', (event, killed) => {
/* ... */
});

// Replace with
app.on('child-process-gone', (event, details) => {
/* ... */
});

Fin du support pour 26.x.y

Electron 26.x.y a atteint la limite pour le support conformément à la politique d'assistance du projet. Nous encourageons les développeurs à mettre à jour vers une version plus récente d'Electron et de faire de même avec leurs applications.

E29 (Fev'24)E24 (Avr'24)E31 (Jun'24)
29.x.y30.x.y31.x.y
28.x.y29.x.y30.x.y
27.x.y28.x.y29.x.y

Et maintenant ?

Did you know that Electron recently added a community Request for Comments (RFC) process? Si vous voulez ajouter une fonctionnalité à la structure, RFCs cela peut être un outil utile. Vous pouvez aussi voir les prochains changement en cours de discussion dans demande d'extraction. Pour en apprendre plus, vérifier notre [Introduction electron/rfc] (https://www.electronjs.org/blog/rfcs) article de blog, ou vérifier le README du [electron/rfcs] (https://www.github.com/electron/rfcs) dépôt directement.

À court terme, vous pouvez compter sur l’équipe pour continuer a se concentrer sur le développement des principaux composants qui composent Electron, notamment Chromium, Node et V8.

You can find Electron's public timeline here.

More information about future changes can be found on the Planned Breaking Changes page.