How to make chrome extension 'optional permissions' dialog pop up locally?

Question

I'm trying to get this optional permission dialog to pop up locally while testing

I've been following this official tutorial: https://developer.chrome.com/docs/extensions/reference/permissions/

In my case, the optional permission dialog should ideally activate when the button of class '.cbtn' is clicked on my website.

Here is chrome.permission.request part of my background.js file

document.addEventListener("DOMContentLoaded", function(event) {
  document.querySelector('.cbtn').addEventListener('click', function(event) {
      console.log('now activating prompt!!');
      chrome.permissions.request({
        permissions: ["bookmarks"]
      }, function(granted){
        // The callback argument will be true if the user granted the permissions.
        if (granted) {
          // doSomething();
          console.log('Access granted');
        } else {
          // doSomethingElse();
          console.log('Access denied');
        }
      });
  });
});

Note: My manifest.json doesn't contain permission for bookmarks.

In the chrome://extensions/?errors for my unpacked extension, i see an error message- "Uncaught TypeError: Cannot read property 'addEventListener' of null"

I don't know if that is because it's trying to find .cbtn on the chrome://extensions/ page itself instead of on my particular website where a button with class .cbtn actually exists,

Will appreciate any help, pointers on this