chrome.sidePanel.open user gesture error

[Kyle Michel]

Hi,

I've been waiting for Chrome 116 to implement a programmatic opening of my sidebar extension (made with React) from my extension's content script.

Now that it's out, I've added an event handler to a <button> in my content script that sends a message to my service worker to open the sidePanel.

However, I continue to get this error:

Error: `sidePanel.open()` may only be called in response to a user gesture.

even though the call is directly in response to a user gesture. I have tried implementing via an onClick event as well as an event listener (again, directly on a <button> element). The error persists. Hoping that someone from Google can weigh on how to make it clear that the function is being called from a user gesture, or alternatively, someone who has successfully implemented could point me in the right direction. Thanks! 

[Jackie Han]

Below is my simple example. It works.

// content-script.js

function init() {
  let button = document.createElement('button');
  button.textContent = "test";
  button.addEventListener('click', e => {
    chrome.runtime.sendMessage('open');
  });
  document.body.appendChild(button);
}

init(); // you can run init function manually

// service-worker.js

chrome.runtime.onMessage.addListener(message => {

  // open a global side panel
  chrome.windows.getCurrent(window => chrome.sidePanel.open({windowId: window.id}))
});

--
You received this message because you are subscribed to the Google Groups "Chromium Extensions" group.
To unsubscribe from this group and stop receiving emails from it, send an email to chromium-extens...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-extensions/4c1aab47-6710-4fa3-b4ea-02d51e9992ddn%40chromium.org.

[thdoan]

You would think a context menu click counts as a user gesture, but that doesn't appear to be the case. Minimal example:

chrome.contextMenus.onClicked.addListener((info, tab) => {

    chrome.sidePanel.open({
        tabId: tab.id,
    });

});

Error: Uncaught (in promise) Error: `sidePanel.open()` may only be called in response to a user gesture.

[Jackie Han]

I just tested, "contextMenus" can open the sidepanel.

[thdoan]

Thanks Jackie, you helped me identify the root cause: promises. Please see test extension:

https://file.io/dK15r7xHxRcz

For now I will try a way around using promises, but I think it's a common enough scenario where it should work with promises (in my particular case, I have a Layout setting that can be either "overlay" or "side panel", so when the user selects from the context menu it reads the Layout setting and only opens the side panel if the user set the Layout option to "side panel").

[thdoan]

Confirmed, using callback works (*relief*):

function onMenuClick(info, tab) {
  chrome.storage.local.get('date', (items) => {

    chrome.sidePanel.open({
      tabId: tab.id,
    });
  });
}

[Zak El hjouji]

did you figure out a solution for using it with promises?

[thdoan]

No, but you can +1 this thread so hopefully it gets more exposure: https://bugs.chromium.org/p/chromium/issues/detail?id=1478648