title: Debugging electron application
body: <p>Coming from web development background, I am learning application development with Electron.</p>
  
  <p>With the basic code I made a honest mistake of using <code>submenu</code> instead of <code>subMenu</code>, I would have expected an error somewhere but the file menu was not clickable at all.</p>
  
  <p>As this is my side/hobby project didn't spend a lot of time to fix it. Next day noticed and fixed this.</p>
  
  <p>I would like to understand on how to debug these kind of issues properly, my code was:</p>
  
  <pre><code>// mainWindow.loadURL('URL');
  // also tried opening chrome dev tools
  mainWindow.webContents.openDevTools();
  
  // create menu template
  const mainMenuTemplate = [
      {
          label: "File",
          subMenu: [
              {
                  label: "Add Item"
              }
          ]
      }
  ];
  
  // Build menu from template
  const mainMenu = Menu.buildFromTemplate(mainMenuTemplate);
  // insert menu
  Menu.setApplicationMenu(mainMenu);
  </code></pre>
  
  <p>What I had tried is to open dev tools <code>mainWindow.webContents.openDevTools();</code>, even with this there was no error on console.</p>
  
  <p>Please share some thoughts.</p>
  
  <hr>
  
  <p>Added: Source code of my <a href="https://github.com/forcetrekker/electronshoppinglist/blob/master/main.js" rel="nofollow noreferrer"><code>main.js</code></a> from github repo.</p>