Skip to content

pixiebrix/ms-edge-sidepanel-state

Β 
Β 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

5 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

MS Edge Sidepanel Behavior Inconsistencies

Summary

This repository demonstrates two behavioral inconsistencies between the Microsoft Edge and Google Chrome sidepanel implementations:


Video Demonstration

Watch a walkthrough of the test cases demonstrating both inconsistencies:

πŸŽ₯ Loom Video: MS Edge Sidepanel Inconsistencies


Inconsistency #1: Stale Sidepanel Path on First Open

Chrome Behavior: When the sidepanel is opened on a tab and then opened on a subsequent tab with an updated path option, the sidepanel immediately displays the correct path for the current tab.

Edge Behavior: When opening the sidepanel on subsequent tabs with an updated path, Edge displays the stale path from the first tab where the sidepanel was opened. The path only updates correctly after closing and reopening the sidepanel

Evidence: The controlling frame tab ID shows the mismatch - it references the first tab's ID instead of the current tab's ID.


Inconsistency #2: Sidepanel State Behavior When Switching Tabs

Chrome Behavior: When a sidepanel is opened on specific tabs, it remains open on those tabs even when navigating to/from tabs where the sidepanel was never opened.

Edge Behavior: When navigating to a tab where the sidepanel was never opened, Edge closes the sidepanel on other tabs as well, including tabs where it was previously opened.


Test Environment

  • Chrome Version: 142.0.7444.162
  • Edge Version: 142.0.3595.94

Setup Instructions

  1. Load the dist folder into a clean browser as an unpacked extension
  2. Pin the extension in the toolbar

Legend

  • βœ… Behavior is consistent between browsers
  • ❌ Behavior differs between browsers

Test Cases

Setup for All Tests

  • Close all tabs except the extensions page
  • Reload the extension (unless otherwise specified)

Baseline Test: New Tab with Extension Reload

Steps:

  1. Open a new tab
  2. Click the extension icon in the toolbar

Results:

  • Chrome: Sidepanel opens, displays "Current URL: chrome://newtab/", tab ID matches controlling frame ID
  • Edge: Sidepanel opens, displays "Current URL: edge://newtab/", tab ID matches controlling frame ID

βœ… Browsers behave consistently


Baseline Test: Navigate to External Site

Steps:

  1. Open a new tab
  2. Navigate to https://news.ycombinator.com/
  3. Click the extension icon in the toolbar

Results:

βœ… Browsers behave consistently


Inconsistency #1 Test Cases: Stale Sidepanel Path

Test 1.1: Stale Path Without Extension Reload

Demonstrates: Sidepanel displays stale path when opened without reloading the extension

Steps:

  1. Open a new tab
  2. Click the extension icon in the toolbar
  3. Close all tabs except extensions page
  4. Do NOT reload the extension (critical for reproducing this difference)
  5. Open a new tab
  6. Click the extension icon in the toolbar

Results:

  • Chrome: Tab ID matches controlling frame ID βœ…
  • Edge: Tab ID differs from controlling frame ID ❌

Observation: Edge retains the path/context from a previous tab rather than updating to the current tab. The controlling frame tab ID mismatch is evidence of this stale path issue.


Test 1.2: Stale Path When Opening on Second Tab

Demonstrates: Sidepanel path is not updated when opening on a second tab

Steps:

  1. Open a new tab, navigate to https://news.ycombinator.com/
  2. Click the extension icon to open the sidepanel
  3. Open a second tab, navigate to https://en.wikipedia.org/wiki/Main_Page
  4. Click the extension icon to open the sidepanel

Results:

  • Chrome: Wikipedia tab ID matches controlling frame ID βœ…
  • Edge: Wikipedia tab ID differs from controlling frame ID (shows Hacker News tab ID instead) ❌

Observation: The sidepanel on Wikipedia displays the path/context from Hacker News instead of Wikipedia's path. The controlling frame tab ID points to Hacker News, confirming the path was not updated.

Note: Tab navigation or toggling the sidepanel closed and open again causes the path to update correctly and the IDs to match in Edge


Inconsistency #2 Test Cases: Sidepanel State Persistence

Test 2.1: Sidepanel State After Opening Second Tab

Demonstrates: Different sidepanel state persistence behavior between browsers

Steps:

  1. Open a new tab, navigate to https://news.ycombinator.com/
  2. Click the extension icon to open the sidepanel
  3. Open a second new tab (don't open sidepanel on this tab)

Results:

  • Chrome:
    • New tab: sidepanel is closed βœ…
    • Hacker News tab: sidepanel remains open βœ…
  • Edge:
    • New tab: sidepanel is closed βœ…
    • Hacker News tab: sidepanel is closed ❌

Test 2.2: Sidepanel State When Navigating Between Tabs

Demonstrates: Sidepanel state behavior differs when navigating to a tab without sidepanel

Steps:

  1. Open tab 1, navigate to https://news.ycombinator.com/ (leave sidepanel closed)
  2. Open tab 2, navigate to https://en.wikipedia.org/wiki/Main_Page
  3. Click the extension icon to open the sidepanel on Wikipedia tab
  4. Click on the Hacker News tab
  5. Click back on the Wikipedia tab

Results:

  • Chrome:
    • Hacker News: sidepanel closed βœ…
    • Wikipedia: sidepanel remains open βœ…
  • Edge:
    • Hacker News: sidepanel closed βœ…
    • Wikipedia: sidepanel closed ❌

Test 2.3: New Tab Navigation and Sidepanel State

Demonstrates: Behavior persists with new tab pages

Steps:

  1. Open a new tab (leave as new tab page)
  2. Open a second new tab, navigate to https://news.ycombinator.com/
  3. Click the extension icon to open the sidepanel
  4. Click back to the first (new) tab
  5. Click back to the Hacker News tab

Results:

  • Chrome:
    • First (new) tab: sidepanel closed βœ…
    • Hacker News: sidepanel remains open βœ…
  • Edge:
    • First (new) tab: sidepanel closed βœ…
    • Hacker News: sidepanel closed ❌

Test 1.3 + 2.4: Combined - Two Tabs with Sidepanel Open

Demonstrates: Both inconsistencies observable in the same scenario

Steps:

  1. Open tab 1, navigate to https://news.ycombinator.com/
  2. Click the extension icon to open the sidepanel
  3. Open tab 2, navigate to https://en.wikipedia.org/wiki/Main_Page
  4. Click the extension icon to open the sidepanel
  5. Navigate between the two tabs

Results - On Opening Wikipedia Sidepanel (Step 4):

  • Chrome: Tab ID matches controlling frame ID βœ…
  • Edge: Tab ID differs from controlling frame ID (shows Hacker News tab ID) ❌ (Inconsistency #1)

Results - After Navigating Between Tabs (Step 5):

  • Chrome:
    • Both tabs: sidepanel remains open, IDs match βœ…
  • Edge:
    • Both tabs: sidepanel remains open, IDs eventually match (after navigating away and back) ⚠️

Test 2.5: Three Tabs - Sidepanel on First Two

Demonstrates: State persistence differs when navigating through multiple tabs

Steps:

  1. Open tab 1 (Hacker News), open sidepanel
  2. Open tab 2 (Wikipedia), open sidepanel (Edge shows stale path/tab ID mismatch here)
  3. Open tab 3 (Reddit), leave sidepanel closed
  4. Navigate: Hacker News β†’ Wikipedia β†’ Reddit

Results:

  • Chrome:
    • Hacker News: sidepanel open βœ…
    • Wikipedia: sidepanel open βœ…
    • Reddit: sidepanel closed βœ…
  • Edge:
    • Hacker News: sidepanel closed ❌
    • Wikipedia: sidepanel closed ❌
    • Reddit: sidepanel closed βœ…

Test 2.6: Three Tabs - Sidepanel on Last Two

Demonstrates: Behavior differs regardless of which tabs have sidepanel open

Steps:

  1. Open tab 1 (Hacker News), leave sidepanel closed
  2. Open tab 2 (Wikipedia), open sidepanel
  3. Open tab 3 (Reddit), open sidepanel (Edge shows stale path/tab ID mismatch here)
  4. Navigate: Hacker News β†’ Wikipedia β†’ Reddit

Results:

  • Chrome:
    • Hacker News: sidepanel closed βœ…
    • Wikipedia: sidepanel open βœ…
    • Reddit: sidepanel open βœ…
  • Edge:
    • Hacker News: sidepanel closed βœ…
    • Wikipedia: sidepanel closed ❌
    • Reddit: sidepanel closed ❌

Test 2.7: Three Tabs - Sidepanel on First and Third

Demonstrates: Non-adjacent tabs exhibit the same behavior difference

Steps:

  1. Open tab 1 (Hacker News), open sidepanel
  2. Open tab 2 (Wikipedia), leave sidepanel closed
  3. Open tab 3 (Reddit), open sidepanel (Edge shows stale path/tab ID mismatch here)
  4. Navigate: Hacker News β†’ Wikipedia β†’ Reddit

Results:

  • Chrome:
    • Hacker News: sidepanel open βœ…
    • Wikipedia: sidepanel closed βœ…
    • Reddit: sidepanel open βœ…
  • Edge:
    • Hacker News: sidepanel open ⚠️
    • Wikipedia: sidepanel closed βœ…
    • Reddit: sidepanel closed ❌

Note: Different navigation orders produce different behaviors in Edge


Test 2.8: Three Tabs - Different Navigation Order

Demonstrates: Navigation order affects the state persistence behavior

Steps:

  1. Open tab 1 (Hacker News), open sidepanel
  2. Open tab 2 (Wikipedia), leave sidepanel closed
  3. Open tab 3 (Reddit), open sidepanel (Edge shows stale path/tab ID mismatch here)
  4. Navigate: Wikipedia β†’ Hacker News β†’ Reddit

Results:

  • Chrome:
    • Wikipedia: sidepanel closed βœ…
    • Hacker News: sidepanel open βœ…
    • Reddit: sidepanel open βœ…
  • Edge:
    • Wikipedia: sidepanel closed βœ…
    • Hacker News: sidepanel closed ❌
    • Reddit: sidepanel closed ❌

Test 2.9: Three Tabs - Workaround Scenario

Demonstrates: Avoiding the tab without sidepanel avoids the inconsistency

Steps:

  1. Open tab 1 (Hacker News), open sidepanel
  2. Open tab 2 (Wikipedia), leave sidepanel closed
  3. Open tab 3 (Reddit), open sidepanel
  4. Navigate: Hacker News β†’ Reddit (skip Wikipedia)

Results:

  • Chrome: Hacker News: OPEN, Reddit: OPEN, Wikipedia: closed βœ…
  • Edge: Hacker News: OPEN, Reddit: OPEN, Wikipedia: closed βœ…

βœ… Browsers behave consistently when the tab without sidepanel is never visited


Summary of Findings

Inconsistency #1: Stale Sidepanel Path on First Open

Pattern: When opening the sidepanel on subsequent tabs with updated path values, the two browsers differ in how they apply the new path.

Chrome Behavior:

  • The sidepanel immediately displays the correct path for the current tab
  • Each call to chrome.sidePanel.setOptions() with a new path is applied immediately
  • The controlling frame tab ID matches the current tab ID

Edge Behavior:

  • On first open of a subsequent tab, the sidepanel displays a stale path from the first tab
  • The updated path is not applied until the user navigates away from the tab and back
  • The controlling frame tab ID references the first tab instead of the current tab (evidence of stale path)

Affected Test Cases: 1.1, 1.2, 1.3 + 2.4 (combined with Inconsistency #2), and noted in tests 2.5-2.8

Note: The stale path issue in Edge resolves itself after tab navigation or toggling the sidepanel closed and open again.


Inconsistency #2: Sidepanel State Persistence During Tab Navigation

Pattern: The two browsers handle sidepanel state differently when navigating to a tab where the sidepanel was never opened.

Chrome Behavior:

  • Each tab maintains its own sidepanel state independently
  • Opening/closing sidepanel on one tab doesn't affect other tabs
  • Navigating between tabs preserves per-tab sidepanel state

Edge Behavior:

  • Navigating to a tab without sidepanel closes the sidepanel on other tabs as well
  • Sidepanel state is not preserved on tabs where it was previously opened
  • Tab switching results in sidepanel closure across multiple tabs

Affected Test Cases: 2.1, 2.2, 2.3, 2.5, 2.6, 2.7, 2.8


Reproduction Rate

  • Inconsistency #1: 100% reproducible on first sidepanel open for subsequent tabs, resolves after tab navigation or toggling the sidepanel closed then open again
  • Inconsistency #2: 100% reproducible - occurs consistently when navigating to a tab without sidepanel

Questions for Browser Maintainers

  1. Inconsistency #1: When chrome.sidePanel.setOptions() is called with an updated path for a new tab, should the path be applied immediately, or is it intended for the path to remain stale until tab navigation occurs?

  2. Inconsistency #2: Is the difference in tab-level sidepanel state persistence intentional? Should sidepanel state be maintained independently per tab, or is a global closing behavior the intended design?

  3. Are these implementation differences part of a deliberate design choice, or should alignment between browsers be expected for the sidepanel API?

About

Reproduction of unexpected sidepanel behavior

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published