Common Issues | Notion

1. Using `functions` in script and invoking them from Html Elements on events

Html templates load HTML, CSS, and JavaScript separately, resulting in HTML elements being registered before the scripts. To address this issue, you can attach your functions to the window object

Below code snippet wont work

Html

<!-- HTML -->

<html>
  <body>
      <button onclick="generatePassword()">Generate Password</button>
  </body>
</html>

Javascript

function generatePassword(){
    alert('generated');
}

Resolution

Instead of:

function generatePassword(){
    alert('generated');
}

Replace it with:

window.generatePassword = function(){
    alert('generated');
};

Place this code in the JavaScript section.

2. I have enabled Content Security Policy (CSP) and now template stops rendering

It's because when Content Security Policy (CSP) is enabled, it restricts the loading of all external content on the templates by default. Therefore, if you are utilizing any external content and CSP is enabled, it is necessary to add the corresponding policy to allow its inclusion.

https://youtu.be/WhZe0a7iGIs

1. Using functions in script and invoking them from Html Elements on events

Below code snippet wont work

Resolution

2. I have enabled Content Security Policy (CSP) and now template stops rendering

1. Using `functions` in script and invoking them from Html Elements on events