-
Notifications
You must be signed in to change notification settings - Fork 7.6k
Add styles for stickyhighlight feature in livepreview #14546
Add styles for stickyhighlight feature in livepreview #14546
Conversation
|
||
function createWebSocket() { | ||
_ws = new WebSocket("ws://localhost:" + remoteWSPort); | ||
_ws.onopen = function () { | ||
window.document.addEventListener("click", onDocumentClick); | ||
if (!experimental && config.stickyHighlight) { | ||
window.document.addEventListener("mouseover", onDocumentHover); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think you would need to listen in the capture phase.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Also, when updateConfig is called, the event listener should be attached even at that time and disengaged when the config changes again.
@vickramdhawal Thanks for the quick review. I have addressed the review comments |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Border would potentially hide/override any Broder used in the actual UI. The ideal way to highlight is either by using a outline or drawing an overlay div by constructing an overlay pane on top of the entire page. Then use element from point of mouse event and use the targets bounding client rect to draw the highlight overlay. Usage of the overlay pane is required to prevent click on an actual link or button.
But still not in an overlay pane. However use outline and the actual elements bounding box for positioning the highlight overlay and styling. |
The current implementation follows the existing approach. Are you suggesting to introduce an overlay pane overall for both the highlight modes ? |
No description provided.