fix: prevent hover preview popover from intercepting sidebar tile clicks
Added pointer-events: none to .preview-popover CSS so clicks fall through to tiles below. Removed e.stopPropagation() from capture-phase document click handler to prevent event interception. Changed dispatched event from preview-click to preview-close (cleanup only). Updated app.js event listener to match. The hover preview overlay (position: fixed, z-index: 300) was intercepting clicks meant for sidebar tiles. Its capture-phase click handler called stopPropagation(), killing the event before the sidebar tile's click handler could fire, then dispatched openSession() with the hovered session name instead of the clicked one. Generated with Amplifier Co-Authored-By: Amplifier <240397093+microsoft-amplifier@users.noreply.github.com>
This commit is contained in:
@@ -3999,16 +3999,14 @@ function bindStaticEventListeners() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Hover preview — component handles click internally; listen for preview-click
|
// Hover preview — component dispatches preview-close when any click dismisses it.
|
||||||
|
// pointer-events:none on the popover means the underlying element (e.g. a
|
||||||
|
// sidebar tile) receives the click and handles navigation itself; this handler
|
||||||
|
// only needs to clean up the timer / session-name state.
|
||||||
var hoverPreview = $('hover-preview');
|
var hoverPreview = $('hover-preview');
|
||||||
if (hoverPreview) {
|
if (hoverPreview) {
|
||||||
hoverPreview.addEventListener('preview-click', function(e) {
|
hoverPreview.addEventListener('preview-close', function() {
|
||||||
hidePreview();
|
hidePreview();
|
||||||
var name = e.detail.name;
|
|
||||||
if (name) {
|
|
||||||
var session = _currentSessions && _currentSessions.find(function(s) { return s.name === name; });
|
|
||||||
openSession(name, { remoteId: (session != null && session.remoteId != null) ? session.remoteId : '' });
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -34,7 +34,8 @@ export class HoverPreview extends LitElement {
|
|||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
cursor: pointer;
|
cursor: default;
|
||||||
|
pointer-events: none; /* clicks pass through to sidebar tiles below */
|
||||||
}
|
}
|
||||||
.preview-popover pre {
|
.preview-popover pre {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@@ -74,11 +75,13 @@ export class HoverPreview extends LitElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
_onDocumentClick(e) {
|
_onDocumentClick(e) {
|
||||||
e.preventDefault();
|
// Close the preview. Do NOT call stopPropagation() — that would swallow
|
||||||
e.stopPropagation();
|
// clicks intended for sidebar tiles and other elements behind the preview.
|
||||||
this.dispatchEvent(new CustomEvent('preview-click', {
|
// pointer-events:none on .preview-popover lets clicks reach their real
|
||||||
|
// target; this handler just ensures the overlay is dismissed in sync.
|
||||||
|
this.open = false;
|
||||||
|
this.dispatchEvent(new CustomEvent('preview-close', {
|
||||||
bubbles: true, composed: true,
|
bubbles: true, composed: true,
|
||||||
detail: { name: this.sessionName },
|
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user