How to react to button click in Electron app-CodePudding

Please could I ask for help with the following:

I have cloned the Electron starter app like so:

git clone https://github.com/electron/electron-quick-start

And have it running.

I have added one line:

<button id="doitButton" onclick="alert('t')">DoIt</button>

Here it is in the context of the main.js file:

    <!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'">
    <link href="./styles.css" rel="stylesheet">
    <title>Hello World!</title>
  </head>
  <body>
    <h1>Hello World!</h1>
    <button id="doitButton" onclick="alert('t')">DoIt</button>
    We are using Node.js <span id="node-version"></span>,
    Chromium <span id="chrome-version"></span>,
    and Electron <span id="electron-version"></span>.

    <!-- You can also require other files to run in this process -->
    <script src="./renderer.js"></script>
  </body>
</html>

I am working in VSCode. I am sure to save the file and then I run "npm start".

I see the button, but no alert when I click it. What have I done wrong?

Thanks for any help.

CodePudding user response：

Take a look at electron dialogs here: https://www.electronjs.org/docs/v14-x-y/api/dialog

CodePudding user response：

I have found a solution.

If I comment out the line:

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'">

Then I see the alert appearing.