#8206: playwright tests for MS Edge sidebar links

[twschiller]

What does this PR do?

• Part of MS Edge: clicking a link in a sidebar mod crashes MS Edge #8206
• Adds playwright tests for verifying sidebar links don't crash the browser
• Adds a title the "Open Extension Console" button
• I wrote a mod @pixies/test/sidebar-links for testing

Remaining Work

• @fregante on main and 1.8.13-alpha.1 build the gear icon isn't doing anything for me in MS Edge. It doesn't change style on hover and isn't responding to clicks when I test manually (but seems like it might be working on CI?, but closing the sidepanel): seems to be fine for me on local builds on MS Edge. Seems like my extension got into a bad state
• @fregante On MV3 it looks like clicking a link causes the sidebar to be closed on the current tab. So the tests I originally wrote aren't passing. Was that the intended behavior in your PR? 3e1a159#r140843795
  • Hmm, testing manually on Chrome MV3, it doesn't look like the sidebar closes
  • Looking at the MS Edge behavior, it looks like visiting a new tab that doesn't have the sidebar open closes it on the other tab. Can replicate that by opening the sidebar, opening a new tab, and then clicking back to the original tab. It looks like other people have noticed this too: Sidebar API for extensions is now live! microsoft/MicrosoftEdge-Extensions#95 (comment)
  • I also opened a w3c ticket for the vendors to clarify expected behavior: Tab-specific sidePanel inconsistencies when opening new tabs/switching tabs w3c/webextensions#588
• Fix MV3 tests on Chrome/Edge

Discussion

• Given that MS Edge has a different sidepanel behavior, we'll need to adjust the test to ensure the sidepanel is open for each step. @fungairino @mnholtz - do we have a best practice for writing browser-specific tests or checks?
• event.composedPath has different behavior for open/closed Shadow DOM. Is this a problem? I think it would be a source of seeing different results on CI vs. manual testing: cc @grahamlangford @fregante

Potential Improvements

• Assert that a new page is opened when clicking the links

Future Work

• @fregante MS Edge crashes if the user clicks a link in an iframe. This might be hard for us to address because we'd need to use a content script to rewrite the clicks. Do we have a response from the MS Edge team yet on the crashing? The fix for iframes might have to be a follow-up
  • I opened a ticket here: MS Edge crashes when user clicks a target="_blank" link in the sidepanel microsoft/MicrosoftEdge-Extensions#145

Checklist

• Add jest or playwright tests and/or storybook stories
• Designate a primary reviewer: @fungairino

[fungairino]

You can also assert that the expected page was opened. See: https://playwright.dev/docs/pages#handling-popups

[twschiller]

During manual testing in MS Edge on Mac the browser crashes when clicking link in the iframe. (Because our interception logic does not intercept it)

[github-actions]

No loom links were found in the first post. Please add one there if you'd like to it to appear on Slack.

Do not edit this comment manually.