diff --git a/src/sandbox.js b/src/sandbox.js
index 33b1a920..009c5014 100644
--- a/src/sandbox.js
+++ b/src/sandbox.js
@@ -16,6 +16,7 @@ const state = {
settings: {
testIdAttribute: 'data-testid',
},
+ pointerInside: false,
};
function postMessage(action) {
@@ -106,12 +107,16 @@ function Sandbox() {
{
+ state.pointerInside = true;
state.highlighter?.clear();
state.highlighter?.start({ stopOnClick: false, blockEvents: false });
}}
onMouseLeave={() => {
state.highlighter?.stop();
state.highlighter.highlight({ nodes: state.queriedNodes });
+ state.pointerInside = false;
+
+ postMessage({ type: 'HOVER_NODE', payload: null });
}}
>
@@ -120,7 +125,11 @@ function Sandbox() {
}
function onSelectNode(node, { origin }) {
- if (!origin || origin === 'script') {
+ // onSelectNode can be triggered after onMouseLeave has already been called.
+ // This makes it impossible to clear hover state. That's why we maintain and
+ // check a boolean to see if the pointer is inside the sandbox, before
+ // dispatching events.
+ if (!origin || origin === 'script' || !state.pointerInside) {
return;
}