The close button in the notification centre panel does not close the popover on desktop. The panel stays open and the button appears dead.
Reproduce on https://design.alberta.ca/components/work-side-notification-panel/ — open the notification menu item in the live preview, then click the X in the panel header. Verified in headless Chromium at 1400x1000.
The event chain fires correctly: WorkSideNotificationPanel dispatches goa:work-side-notification-panel:closePopover, WorkSideMenuItem.handleCloseNotificationPanel receives it and dispatches goa:closePopover on document.body. The popover ignores it.
WorkSideMenuItem.svelte:217 dispatches without a target in the detail:
dispatch(document.body, "goa:closePopover", {});
Popover.svelte:274 only closes when target is truthy:
const { target } = (e as CustomEvent).detail;
if (target !== _targetEl) {
// Don't close if the target is a child popover (descendant of this popover's content)
if (target && !isInPopoverComposedTree(target)) {
closePopover();
}
}
With target undefined the guard short-circuits and closePopover() never runs. Confirmed by A/B on the live site with the popover open — dispatching goa:closePopover with detail: {} leaves the panel at 500x710, dispatching it with detail: { target: document.body } collapses it to 0x0.
The other goa:closePopover dispatchers (Popover.svelte:372, DatePicker.svelte:196) all pass a target, so this is the only caller hitting the gap.
Mobile is unaffected — handleCloseNotificationPanel calls closeMobileDrawer() directly when a drawer element exists, so it never goes through the popover path.
Test coverage gap: libs/react-components/specs/work-side-menu-with-notification-popover.browser.spec.tsx clicks the close button in the mobile drawer test (line 224) but the desktop popover test never does.
The close button in the notification centre panel does not close the popover on desktop. The panel stays open and the button appears dead.
Reproduce on https://design.alberta.ca/components/work-side-notification-panel/ — open the notification menu item in the live preview, then click the X in the panel header. Verified in headless Chromium at 1400x1000.
The event chain fires correctly:
WorkSideNotificationPaneldispatchesgoa:work-side-notification-panel:closePopover,WorkSideMenuItem.handleCloseNotificationPanelreceives it and dispatchesgoa:closePopoverondocument.body. The popover ignores it.WorkSideMenuItem.svelte:217dispatches without atargetin the detail:Popover.svelte:274only closes whentargetis truthy:With
targetundefined the guard short-circuits andclosePopover()never runs. Confirmed by A/B on the live site with the popover open — dispatchinggoa:closePopoverwithdetail: {}leaves the panel at 500x710, dispatching it withdetail: { target: document.body }collapses it to 0x0.The other
goa:closePopoverdispatchers (Popover.svelte:372,DatePicker.svelte:196) all pass atarget, so this is the only caller hitting the gap.Mobile is unaffected —
handleCloseNotificationPanelcallscloseMobileDrawer()directly when a drawer element exists, so it never goes through the popover path.Test coverage gap:
libs/react-components/specs/work-side-menu-with-notification-popover.browser.spec.tsxclicks the close button in the mobile drawer test (line 224) but the desktop popover test never does.