Manejo de errores en ElectronJS

ElectronJS es un marco de código abierto que se utiliza para crear aplicaciones de escritorio nativas multiplataforma utilizando tecnologías web como HTML, CSS y JavaScript que pueden ejecutarse en los sistemas operativos Windows, macOS y Linux. Combina el motor Chromium y NodeJS en un solo tiempo de ejecución. En cualquier aplicación, el manejo de errores y excepciones es una parte fundamental del desarrollo. Para el manejo de errores y excepciones en NodeJS, consulte el artículo: Manejo de excepciones en Node . Para el manejo de errores y excepciones usando JavaScript, consulte los artículos: 

• JavaScript | Error y manejo excepcional con ejemplos
• JavaScript | Errores: lanzar e intentar atrapar

La mayoría de los lenguajes y plataformas brindan soporte integrado para el manejo de errores y excepciones. Los desarrolladores, al desarrollar una aplicación, independientemente del lenguaje o la plataforma, deben tener cuidado con algunas de las excepciones comunes que pueden ocurrir en el código, como el manejo de NULL ., dividir un número por 0, etc. Los desarrolladores suelen manejar excepciones y errores de forma genérica, aparte de algunos casos de uso específicos que están relacionados con su funcionalidad. La lista de excepciones que se pueden generar no es exhaustiva. Ya hemos cubierto el manejo de errores y excepciones en NodeJS y JavaScript. Las mismas técnicas también se pueden utilizar al desarrollar una aplicación de Electron. Sin embargo, muchas veces surge una situación en la que un código de trabajo puede fallar por razones desconocidas o un error en la aplicación puede provocar que se produzca una excepción o un error que puede interrumpir el flujo de ejecución. También pueden tener un problema de seguridad para la aplicación. En tales casos, necesitamos una forma genérica de manejar estas Excepciones de forma segura sin romper la aplicación y también debería ser compatible con el sistema nativo. En este tutorial,Paquete npm externo no controlado por electrones . Suponemos que está familiarizado con los requisitos previos que se describen en el enlace mencionado anteriormente. Para que Electron funcione, node y npm deben estar preinstalados en el sistema.

• Estructura del proyecto: 
   

Ejemplo: Siga los pasos dados en Estilo dinámico en ElectronJS para configurar la aplicación electrónica básica. Copie el código estándar para el archivo main.js y el archivo index.html como se indica en el artículo. Continuaremos construyendo nuestra aplicación usando la misma base de código. Además, instale el paquete no controlado por electrones mediante npm . Al usar este paquete externo, podemos detectar errores no manejados y rechazos de promesas en nuestras aplicaciones electrónicas y manejarlos de manera segura. 

npm install electron-unhandled --save

Además, realice los cambios necesarios mencionados para el archivo package.json para iniciar la aplicación Electron. Continuaremos construyendo nuestra aplicación usando la misma base de código. Los pasos básicos necesarios para configurar la aplicación Electron siguen siendo los mismos. 
paquete.json: 

{
  "name": "electron-catch",
  "version": "1.0.0",
  "description": "Catch Unhandled Errors and Promise Rejections in Electron",
  "main": "main.js",
  "scripts": {
    "start": "electron ."
  },
  "keywords": [
    "electron"
  ],
  "author": "Radhesh Khanna",
  "license": "ISC",
  "dependencies": {
    "electron": "^8.3.0",
    "electron-unhandled": "^3.0.2"
  }
}

Producción: 

Manejo de errores en electrones: el paquete npm sin manejar de electrones se puede usar directamente en el proceso principal y los procesos de representación de la aplicación para detectar errores no manejados. Este paquete requiere Electron 5+ para funcionar sin problemas. Este paquete es compatible y funciona sin errores a partir de Electron v8.3.0 y se actualiza periódicamente. Para obtener información más detallada sobre este paquete, actualizaciones de versión y registros de cambios, consulte el enlace: https://www.npmjs.com/package/electron-unhandled . Este paquete ha sido adoptado y es utilizado por Electron para fines de demostración.

• index.html: agregue el siguiente fragmento en ese archivo. 

<h3>Catch Unhandled Errors and Promise Rejections in Electron</h3>
    <button id="generate">
         Generate Errors
    </button>
<!-- Adding Individual Renderer Process file -->

• index.js: el botón Generar errores aún no tiene ninguna funcionalidad asociada. En este tutorial, arrojaremos un error genérico desde la interfaz de error y le pasaremos un mensaje personalizado. Para cambiar esto, agregue el siguiente fragmento de código en el archivo index.js .

const electron = require('electron')
const electron = require('electron');
// Importing unhandled.
const unhandled = require('electron-unhandled');
  
unhandled({
    logger: () => {
        console.error();
    },
    showDialog: true,
    reportButton: (error) => {
        console.log('Report Button Initialized');
    }
});
  
unhandled.logError(Error, {
    title: 'Title of the Box'
});
  
var generate = document.getElementById('generate');
// Throwing a Generic Error from the Error Interface
generate.addEventListener('click', () => {
    throw new Error('THIS IS AN ERROR');
});

Explicación: en la aplicación anterior, al hacer clic en el elemento del botón HTML DOM , lanzamos un nuevo error con un mensaje. Como no hemos usado el bloque try-catch , este es un error no controlado y lo manejaremos usando el paquete npm no controlado por electrones. El método de instancia no manejado (opciones) no tiene un tipo de retorno y toma los siguientes parámetros. 

• opciones: objeto Podemos pasar configuraciones personalizadas que definen la forma en que queremos que se manejen, impriman y notifiquen los errores capturados. Consta de los siguientes parámetros.
  • registrador: función (opcional) Esta función es un parámetro opcional. Este parámetro define una función personalizada que se puede utilizar para registrar/imprimir los errores detectados. El valor predeterminado es console.error del objeto de consola global en JavaScript . Este parámetro es extremadamente útil si estamos usando una herramienta externa para rastrear los errores como centinela o registrarlos en un archivo externo en el directorio del sistema nativo del usuario. Sentry es una herramienta de control de rendimiento y seguimiento de errores para aplicaciones de JavaScript.
  • showDialog: booleano (opcional) Este parámetro es un parámetro opcional. Este parámetro se establece en verdadero , presentará un cuadro de diálogo de error del sistema nativo con el título Error no controlado en caso de errores o Rechazo de promesa no controlada en caso de promesas . Los botones predeterminados presentes en el cuadro de diálogo son Aceptar , que es compatible con todas las plataformas y un botón Copiar error adicional en la plataforma Windows . Además de esto, podemos agregar otro botón Informe… que se trata a continuación. Para obtener información más detallada sobre los cuadros de diálogo en Electron, consulte el artículo: Mensajes personalizados en ElectronJS. De forma predeterminada, este cuadro de diálogo solo se muestra en un entorno de ensayo de producción , es decir, cuando la aplicación Electron se ejecuta en modo de producción . 
  • reportButton: Función (Opcional) Este parámetro es un parámetro opcional. Este parámetro, cuando se define, mostrará un botón Informe… en el cuadro de diálogo Error, como se explica en el parámetro showDialog . De forma predeterminada, este parámetro no está definido , es decir, no se incluirá en el cuadro de diálogo de error. Esta función recibe un error: String como argumento que representa el objeto de error detectado . El comportamiento predeterminado de esta función es ejecutar otra función bajo el capó que redirige al usuario a la página de problemas de GitHub del no controlado de electrones.paquete e informa el error detectado al autor de este paquete. Esta función interna utiliza el paquete externo electron-util para redirigir a la página de problemas de Github. El paquete externo electron-util agrega útiles funciones de utilidad y depuración a la aplicación Electron, que se tratarán en un artículo separado. El comportamiento predeterminado de esta función se puede anular como lo hemos hecho en el ejemplo de código anterior. En nuestro código, simplemente estamos imprimiendo una declaración de Consola con el mensaje personalizado y el objeto de error cada vez que se hace clic en este botón Informe… . Consulte la salida para una mejor comprensión.

El paquete electrónico no manejado también nos proporciona el método de instancia unhandled.logError(error, options) que se puede usar para registrar/imprimir/mostrar errores detectados en el manejo de errores, como en el bloque catch de la instrucción try-catch . Este método de instancia usa las mismas configuraciones definidas en el método de instancia unhandled() o llama a las configuraciones predeterminadas. Por lo tanto, en nuestro caso, hemos optado por mostrar un cuadro de diálogo de error en el método de instancia unhandled() y se hará lo mismo para este método también. Toma los siguientes parámetros. 

• error: Objeto Este parámetro representa el objeto de error del error detectado que debe registrarse.
• opciones: Objeto Este parámetro simplemente toma un título: Parámetro de string que representa el título del cuadro de diálogo de error que se mostrará en caso de que el parámetro showDialog se establezca en las configuraciones del método de instancia unhandled() . De manera predeterminada, el título del cuadro de diálogo de error se mostrará como: ${appName} encontró un error , donde appName es el nombre de su aplicación Electron como se define en el archivo package.json . En nuestro caso, simplemente detectamos una interfaz de error genérica que debería mostrarse al inicio de la aplicación Electron.

En este punto, al iniciar la aplicación Electron, deberíamos poder ver que el paquete no controlado por electrones produce dos cuadros de diálogo de error personalizados, uno al iniciar la aplicación y el otro al hacer clic en el botón  Generar errores .
Producción: