What is the best way to modify text on a text-change event in Quill?
See original GitHub issueWe’re trying to build track changes into Quill, which includes checking for user input, and then modifying the document. For example, if a user deletes some text, we reverse the deletion, and then apply a track-deletion
attribute. Here is a simplified example of what we do:
quill.on('text-change', (delta, oldContents, source) => {
if (source !== 'user') return;
const trackChangesDelta = delta.invert(oldContents);
trackChangesDelta.ops.forEach((op) => {
if (op.insert) op.attributes['track-deletion'] = true;
// Also handle tracked insertions, etc...
});
quill.updateContents(trackChangesDelta);
});
This approach mostly works, but runs into some slightly odd cases:
-
If I have the text
foo
, and I highlight the text, and then type the lettero
, I’d expect the entire word to be deleted, followed by ano
insertion. Instead, Parchment appears to “optimise” the op, and instead do a pair of deletions either side of the middleo
-
If I highlight and replace text at the start of a paragraph, then the inserted letter goes to the end of the deletion, but my cursor stays in the wrong place
I think both of these issues are symptoms of the fact that we’re performing a text-change
within a text-change
, and I was wondering if there was a better (more synchronous?) way of hooking into the Quill document life-cycle.
For example, the second issue we have is resolved by using a setTimeout
to let the Quill document finish processing the text-change
before we apply our track changes, but that then results in some other jittery behaviour.
Ideally, I’d like to catch the text-change
before it’s even been applied to the document, but as far as I can tell, neither Quill nor Parchment offers a suitable hook?
Issue Analytics
- State:
- Created 4 years ago
- Reactions:10
- Comments:6 (1 by maintainers)
This is also problematic when dealing with deltas. If you make a call to
updateContents
fromtext-change
event, that delta appears before the actual user’s change. Sodelta.compse
for those changes results in an incorrect delta.One other place this is juddery is if you hold down the backspace key in Safari. It would be really nice if we could update the contents before the editor is redrawn.