sidePanel does not automatically open

[lucasjohnston]

Describe the bug As per both the description in the docs and on the README, the chrome extension cookbook.sidepanel-site-specific should automatically open the sidePanel when navigating to google.com. This does not happen, you have to click the icon.

To Reproduce

1. Install the extension as unpacked
2. Go to Google.com

Expected behavior SidePanel to open automatically

Notes The docs specifically point at this example for functionality: https://developer.chrome.com/docs/extensions/reference/sidePanel/#by-site And the README states "This example demonstrates how to display the side panel only on google.com using the Side Panel API" here

[mukunda-]

I was pretty excited by the side panel offering, but this caught me off-guard too.

The feature is not useful to me unless I can automatically show the panel without user interaction. The documentation states "Opens the side panel for the extension. This may only be called in response to a user action." https://developer.chrome.com/docs/extensions/reference/sidePanel/#method-open

So, currently the user is required to click something to open the panel. I'm not sure where is the best place to submit developer feedback, but we really need a way to open the panel automatically. I don't see a problem if the user consents to the behavior.

[patrickkettner]

Feedback like that is great for here, but sharing your use case would be greatly appreciated

On Mon, Jul 10, 2023 at 9:53 PM Mukunda Johnson @.***> wrote:

I was pretty excited by the side panel offering, but this caught me off-guard too.

The feature is not useful to me unless I can automatically show the panel without user interaction. The documentation states "Opens the side panel for the extension. This may only be called in response to a user action." https://developer.chrome.com/docs/extensions/reference/sidePanel/#method-open

So, currently the user is required to click something to open the panel. I'm not sure where is the best place to submit developer feedback, but we really need a way to open the panel automatically. I don't see a problem if the user consents to the behavior.

— Reply to this email directly, view it on GitHub https://github.com/GoogleChrome/chrome-extensions-samples/issues/982#issuecomment-1629982185, or unsubscribe https://github.com/notifications/unsubscribe-auth/AADRUBS3VKZAOMHUFPHYCGLXPSW3BANCNFSM6AAAAAA2EZJLUA . You are receiving this because you are subscribed to this thread.Message ID: @.*** com>

-- patrick

[mukunda-]

Hi Patrick, my use case is users commenting on sites' contents. If there are no comments, it doesn't show, which is most of the time. If there are comments, then it shows. It needs to be automatic because otherwise the comment visibility suffers. That is, the information needs to present itself, rather than the user expecting it and taking action first.

[AmySteam]

@lucasjohnston

I was looking at the instructions on the readme file:

1. Load this directory in Chrome as an unpacked extension.
2. Pin the extension.
3. Go to https://www.google.com/.
4. Click on the action icon to open the side panel.

💡 You can also open the side panel by pressing Ctrl+B (Windows) or Cmd+B (macOS).

So the way it works, is that you have to open it once via action icon. But then if you navigate back to google.com, the side panel should remain open.

[mukunda-]

Thank you @AmySteam

I reviewed the process again and unfortunately it's not quite as intuitive.

What happens when you navigate away is that the side panel closes. When they come back, they would have to open it again, via the click action or selecting it from the side panel dropdown.

Attached video for clarity https://github.com/GoogleChrome/chrome-extensions-samples/assets/7541831/49555049-9a1a-4f0e-a247-6b2990092bcd

When I see step 2 as "pinning the extension", I already sense it is counter-intuitive. I'd consider that as "training instructions" that should be unnecessary in an intuitive user experience.

My ideal intuitive user experience would be:

1. Install the extension, consenting to the extension behavior.
2. Visit a relevant website, and have the extension content presented automatically.
3. Manual activation beyond that is not needed.

I imagine there may be some conflict over other extensions doing the same on a page, since we need to share the side panel, and, not to get too offtrack here, but I would eventually want the ability to easily have a controllable, dedicated, docked panel, much like the developer tools window. Other extensions could do the same, displaying multiple panels on a page if the user desires, all configurable to be docked on a part of the screen. Honestly that would be amazing, and this isn't unheard of, for example, in a developer IDE where the visible text editor space is only 20% of the screen, surrounded by panels! I think it would be a great feature for many use cases.

In general, I think we need more presentation options. Outside of these new features, there is no way to safely adjust the viewport of a page, and we are left with ugly CSS hacks that do not work universally – I believe the corresponding blog post about side panels touches on the difficulties we face. Difficulties aside, intuitiveness is an important part of a software's success, and for now, I'm stuck with dangerous CSS hacks since it does get closer to providing the behavior that I need.

The "dangerous" part is a real concern to me because I predict many support tickets complaining about the 10% of sites that will not present properly, where my extension covers text, breaks the layout, etc. Not good! Hence I was very excited to see the new sidepanel API, but it doesn't fit my requirements currently.

[AmySteam]

@mukunda- That video was super helpful! Thanks for sharing 💯 😃

The test I was performing was:

• navigate to google.com
• open a separate tab on example.com
• switch back to the google.com and the side panel would remain open.

There will be other user interactions that will open the side panel, but this still doesn't quite solve for the "open-panel-if-element-exists-on-the-page" use case you described earlier 🧐:

Hi Patrick, my use case is users commenting on sites' contents. If there are no comments, it doesn't show, which is most of the time. If there are comments, then it shows. It needs to be automatic because otherwise the comment visibility suffers. That is, the information needs to present itself, rather than the user expecting it and taking action first.

@patrickkettner I'm gonna hand this use case over to you to add to side panel developer feedback.

[mukunda-]

Thanks Amy. Looking forward to the fun features ahead.

[lucasjohnston]

Hey Amy - whilst I understand the idea, it feels misleading that "Enable a side panel on a specific site" doesn't actually enable the side panel, it persists it. It'd be great if Chrome could offer this functionality and/or change the wording :)

[AmySteam]

@lucasjohnston *sigh*. You have discovered one of my daily struggles 🫢... picking the right term to best describe functionality!

I truly appreciate your feedback. It helps us write our docs in a way that makes more sense for developers :)

It'd be great if Chrome could offer this functionality

Do you mean programmatically open the side panel? Because 116 launched this feature. But it does require a use gesture :)

[lucasjohnston]

@AmySteam Thank you! I do indeed – though given 116 isn't stable yet we've moved away from sidePanel until it's stable and the API is widely available

[zakariaelh]

@AmySteam Somewhat of a similar issue to lucas, but I'm trying to open the sidebar only in a specific tab. I don't understand why it's designed such that it will open in that tab only if there's a tab-specific side panel. Otherwise it will open in all tabs. That seems against the point of providing a tabId. I want all my tabs to share the same html template, but I want to populate that template based on information in each tab separately.

See quote from documentation

The tab in which to open the side panel. If the corresponding tab has a tab-specific side panel, the panel will only be open for that tab. If there is not a tab-specific panel, the global panel will be open in the specified tab and any other tabs without a currently-open tab- specific panel.

[AmySteam]

@zakariaelh Good question! I'm curious, have you declared a global side panel in the manifest? Like in the example below? This will set a global side panel in all tabs. If so, can you remove this code and try again?

{
  "name": "My side panel extension",
  ...
  "side_panel": {
    "default_path": "sidepanel.html"
  }
  ...
}

Let me know if this works for you 😄

[zakariaelh]

It works, thank you so much!

[kudos112]

Hi @patrickkettner @AmySteam @lucasjohnston, I've read your discussion above which was quite helpful. @patrickkettner I am also building up a Chrome extension I think my client can also face this issue. Yet I've not discussed with him but I think he'll say something on this issue.

I am also facing an issue. I want to make sidePanel more wider than its default size. Is there any possibility of doing this? Because I've searched a lot but you also have to do it manually. There is no way to handle its size via CSS or any other way or I'm unable to find it yet.

Any suggestions or help will be so much appreciated. Thanks

Warm Regards Abdul Quddous