title: Electron on click of a button can it execute node?
body: <p>So I have a start button, and once the button is clicked I want it to execute a function.</p>
  <p>I know I can execute the function on start of the electron app but is there anyway to say have a start button, and it execute the code on click of the button?</p>
  <p>Also I know you can't use node in the browser, and I know Electron uses chromium, but there is still access to node right ?</p>
  <p>This is the error I get :</p>
  <pre><code>Uncaught Exception:
  ReferenceError: document is not defined
  </code></pre>
  <p>index.js</p>
  <pre><code>    const { app, BrowserWindow, ipcMain } = require('electron');
  const path = require('path');
  const Bot = require('./bot')
  // Handle creating/removing shortcuts on Windows when installing/uninstalling.
  if (require('electron-squirrel-startup')) { // eslint-disable-line global-require
    app.quit();
  }
  
  const createWindow = () =&gt; {
  
    const mainWindow = new BrowserWindow({
      width: 800,
      height: 600,
      webPreferences: {
        nodeIntegration: true,
        preload: &quot;./bot.js&quot;
      }
    });
  
    // and load the index.html of the app.
    mainWindow.loadFile(path.join(__dirname, 'index.html'));
  
    // Open the DevTools.
    mainWindow.webContents.openDevTools();
  };
  
  // This method will be called when Electron has finished
  // initialization and is ready to create browser windows.
  // Some APIs can only be used after this event occurs.
  app.on('ready', createWindow);
  
  // Quit when all windows are closed, except on macOS. There, it's common
  // for applications and their menu bar to stay active until the user quits
  // explicitly with Cmd + Q.
  app.on('window-all-closed', () =&gt; {
    if (process.platform !== 'darwin') {
      app.quit();
    }
  });
  
  app.on('activate', () =&gt; {
    // On OS X it's common to re-create a window in the app when the
    // dock icon is clicked and there are no other windows open.
    if (BrowserWindow.getAllWindows().length === 0) {
      createWindow();
    }
  });
  
  // In this file you can include the rest of your app's specific main process
  // code. You can also put them in separate files and import them here.
  </code></pre>
  <p>Here is the bot.js file:</p>
  <pre><code>    const robot = require('robotjs')
  const electron = require('electron')
  const ipc = electron.ipcRenderer
  
  const Bot = () =&gt; {
  
      const button = document.getElementById('start');
      button.addEventListener('click', () =&gt; console.log('Click'))
      // button.addEventListener('click', function (e) {
      //     // Get mouse position.
      //     var mouse = robot.getMousePos();
  
      //     // Get pixel color in hex format.
      //     var hex = robot.getPixelColor(mouse.x, mouse.y);
      //     console.log(&quot;#&quot; + hex + &quot; at x:&quot; + mouse.x + &quot; y:&quot; + mouse.y);
      // });
  
  }
  
  
  module.exports = Bot;
  </code></pre>
  <p>The index.html file :</p>
  <pre><code>    &lt;!DOCTYPE html&gt;
  &lt;html&gt;
   &lt;head&gt;
    &lt;meta charset=&quot;UTF-8&quot; /&gt;
    &lt;title&gt;Hello World!&lt;/title&gt;
    &lt;link rel=&quot;stylesheet&quot; href=&quot;index.css&quot; /&gt;
   &lt;/head&gt;
   &lt;body&gt;
    &lt;div class=&quot;App&quot;&gt;
     &lt;div class=&quot;Header&quot;&gt;
      &lt;h1&gt;Checkout-Bot&lt;/h1&gt;
     &lt;/div&gt;
     &lt;div class=&quot;Wrapper&quot;&gt;
      &lt;p&gt;Click Start&lt;/p&gt;
      &lt;button id=&quot;start&quot;&gt;Start&lt;/button&gt;
     &lt;/div&gt;
    &lt;/div&gt;
   &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>