electronjs - howtos

[Costas]

npm install -g yarn
npm uninstall -g yarn
npm list -g --depth=0

use of yarn

//add libraries according to package.json
yarn install

//build project
yarn dist

//test local the application
yarn start

//add library to project
yarn add electron-alert

//remove library by project
yarn remove electron-alert

inject custom property to BrowserWindow (workaround to get partition name by BrowserWindow)

//https://github.com/electron/electron/issues/40572#issuecomment-1872605088
//when creating the BrowserWindow
var win = new BrowserWindow({
  width: 1181,
  height: 670,
  webPreferences: {
    partition: "persist:test",
  },
});

//store new property to BrowserWindow
win.partitionName = "persist:test";

//access by another context
const focusedWindow = BrowserWindow.getFocusedWindow().partitionName;

show inputbox with electron-alert (without reactivity framework)

# source - https://www.npmjs.com/package/electron-alert
# https://web.archive.org/web/20200929150113/https://electron.guide/electron-alert/
# npm install electron-alert
# ref - https://sweetalert2.github.io/#input-types

let alert = new Alert();

let swalOptions = {
    input: "text",
    text: "default text",
    inputLabel: "user-agent",
    inputPlaceholder: "Enter the user-agent"
};

let url = alert.fireWithFrame(swalOptions, "", null, false);

url.then((result) => {
        if (result.isConfirmed) {
            setUserAgent(result.value);
        }
    });

electron-webpack -- error:0308010C:digital envelope routines::unsupported
at cmd set this environment variable

#https://www.datainfinities.com/49/error-0308010C-digital-envelope-routines-unsupported
set NODE_OPTIONS=--openssl-legacy-provider

electron-forge -- The AutoUnpackNatives plugin requires asar to be truthy or an object

//delete from forge.config.js
  plugins: [
    {
      name: '@electron-forge/plugin-auto-unpack-natives',
      config: {},
    },
  ],

transitive dependencies

npm ls package_name
yarn list package_name

electron - which build-lib to choose ?

(2015) https://github.com/electron/packager - the native solution by ElectronJS (debug start with 'npx electron .' | build 'npx electron-packager .')
--> We recommend using Electron Forge
(2015) by electron-userland https://www.electron.build | https://github.com/electron-userland/electron-builder
(2018) by electron-userland https://www.npmjs.com/package/@electron-forge/cli | https://github.com/electron-userland/electron-forge

npx electron-forge start
npx electron-forge package

all inherit by node_modules\electron\dist\electron.exe, depend on project flow choose the needed. For minimal is electron/packager.

electron-builder - disable packing into asar

  "build": {
    "asar": false,

electron-builder - stop generating the installer exe
modify package.json as

#source - https://www.electron.build/configuration/win
    },
    "win": {
      "target": [
        "dir"
      ],
      "icon": "./icon.ico"
    },

---

npm package.json reference
electron package.json reference
electron Security & General guidelines (CSP)
electron BrowserWindow.webPreferences
electron Sandbox
electron Permissions
electron dark mode
electron ASAR | github [2]
coderJee - Electron BrowserWindow & WebContents Objects (video)
ref - electron source code
trend micro - Abusing Electron based applications in targeted attacks

electron-context-menu
electron-dl
better-sqlite3


electron-cheatsheet
awesome-electron
awesome-electron-alternatives
electronegativity [electronNG] ( npm install -g @doyensec/electronegativity |---| electronegativity -i . )
asar-explorer
wikipedia

---

Generate PDF by BrowserWindow

//source - https://github.com/electron/electron/blob/main/docs/api/web-contents.md#contentsprinttopdfoptions
//https://stackoverflow.com/a/53966845
//https://ishwar-rimal.medium.com/generating-pdf-with-electron-js-31b59ac93249
function SavePDF() {
    // const pdfPath = path.join(os.homedir(), 'Desktop', new Date().toISOString().replace(/[-T:.]/g, '').slice(0, -5).replace('T', '_') + ".pdf");
    const pdfPath = path.join('./', new Date().toLocaleString('el-EL', { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false }).replace(/[\/.,\s:]/g, '') + ".pdf");
    BrowserWindow.getFocusedWindow().webContents.printToPDF({ landscape: false, marginsType: 0, printBackground: false, printSelectionOnly: false, pageSize: "A4" }).then(data => {
    fs.writeFile(pdfPath, data, (error) => {
        if (error) throw error
        console.log(`Wrote PDF successfully to ${pdfPath}`)
      })
    }).catch(error => {
      console.log(`Failed to write PDF to ${pdfPath}: `, error)
    });
}