Hey! First of all, I am a huge CodeMirror fan and I absolutely loving working with the code.
Let me know if I’m missing something but I believe ‘destroyed!’ should be logged in this example both when the user mouses away from the tooltip, as well as when the user scrolls (calling the ‘closeHoverTooltips’ StateEffect.
Can paste the example directly here and run it: https://codemirror.net/try/
import { basicSetup, EditorView } from "codemirror";
import { hoverTooltip, closeHoverTooltips } from "@codemirror/view";
import { autocompletion } from "@codemirror/autocomplete";
const wordHover = hoverTooltip((view, pos, side) => {
let { from, to, text } = view.state.doc.lineAt(pos);
let start = pos,
end = pos;
while (start > from && /\w/.test(text[start - from - 1])) start--;
while (end < to && /\w/.test(text[end - from])) end++;
if ((start == pos && side < 0) || (end == pos && side > 0)) return null;
return {
pos: start,
end,
above: true,
create(view) {
let dom = document.createElement("div");
dom.textContent = text.slice(start - from, end - from);
console.log('created!')
return { dom, destroy: () => { console.log("destroyed!") } };
},
};
});
let view = new EditorView({
doc: `\n\n\n\nword word word${"\n".repeat(200)}`,
extensions: [
basicSetup,
wordHover,
EditorView.domEventHandlers({
scroll: (_event, view) => {
console.log('scroll effect')
view.dispatch({ effects: [closeHoverTooltips] });
},
}),
],
parent: document.body,
});
