I've modified a Blazor-JS component based on QuillJs to enable two-way binding from the text editor to blazor/c# property
I've done this by adding a 'blur' event listener and invoking a method c# method from js:
All source code here: https://github.com/gismofx/TextEditor/blob/3ea6d0705a443d8ea81bdcce46814ef2261e1e26/src/Blazored.TextEditor/wwwroot/Blazored-BlazorQuill.js#L40
//On Blur - we update the object in dotnet
quillElement.__quill.editor.scroll.domNode.addEventListener('blur',
() => {
if (quillElement.__quill.options.debug === "info") {
console.log('info: Quill Editor blur event for ' + quillElement.id);
}
QuillFunctions.dotNetRefs.get(quillElement.id).invokeMethodAsync('DeltaChanged', QuillFunctions.getQuillContent(quillElement));
}
);
The two-way binding works just fine.
Issue: When interacting with quill's toolbar, e.g. to change some highligted text's format, the cursor jumps to start of text and formatting it not applied. If you repeat, it applied the fomatting. This happens every time.
See recording of strange behavior:

If I remove the invokeMethodAsync call, it restores correct functionality and formatting is applied correctly.
Is there different event to use or another way to keep binding and not affect the quill functionality?