First off, thank you for ProseMirror. The amount of work that went into it is quite impressive. While complex, it is thoroughly comprehensive.
Is there a way to detect parsing errors? For example, initializing PM with the following code:
try {
const doc = DOMParser.fromSchema(schema).parse(inputElement);
const state = EditorState.create({
doc,
plugins: []
});
state.doc.check();
const view = new EditorView({ mount: container }, { state });
} catch (e) {
console.error("error parsing", e);
}
where inputElement
is set to <h1>
does not throw an error in either of the try/catch
blocks. However, focusing on the PM editor results in the following error:
dom.js:42 Uncaught TypeError: Cannot read property 'nodeType' of null
at scanFor (dom.js:42)
at isEquivalentPosition (dom.js:31)
at NodeViewDesc2.setSelection (viewdesc.js:401)
at NodeViewDesc2.setSelection (viewdesc.js:359)
at selectionToDOM (selection.js:57)
at DOMObserver2.flush (domobserver.js:178)
at DOMObserver2.onSelectionChange (domobserver.js:122)
scanFor @ dom.js:42
isEquivalentPosition @ dom.js:31
setSelection @ viewdesc.js:401
setSelection @ viewdesc.js:359
selectionToDOM @ selection.js:57
flush @ domobserver.js:178
onSelectionChange @ domobserver.js:122
dom.js:42 Uncaught TypeError: Cannot read property 'nodeType' of null
at scanFor (dom.js:42)
at isEquivalentPosition (dom.js:31)
at NodeViewDesc2.setSelection (viewdesc.js:401)
at NodeViewDesc2.setSelection (viewdesc.js:359)
at selectionToDOM (selection.js:57)
at DOMObserver2.flush (domobserver.js:178)
at MutationObserver.DOMObserver2.observer (domobserver.js:50)
scanFor @ dom.js:42
isEquivalentPosition @ dom.js:31
setSelection @ viewdesc.js:401
setSelection @ viewdesc.js:359
selectionToDOM @ selection.js:57
flush @ domobserver.js:178
DOMObserver2.observer @ domobserver.js:50
attributes (async)
selectionToDOM @ selection.js:63
flush @ domobserver.js:178
onSelectionChange @ domobserver.js:122
dom.js:42 Uncaught TypeError: Cannot read property 'nodeType' of null
at scanFor (dom.js:42)
at isEquivalentPosition (dom.js:31)
at NodeViewDesc2.setSelection (viewdesc.js:401)
at NodeViewDesc2.setSelection (viewdesc.js:359)
at selectionToDOM (selection.js:57)
at input.js:664
Am I missing a method that’ll validate the content? state.doc.check() seems like it would suffice but I guess it doesn’t function if the content is malformed.
edit
Actually, the error I’m seeing may not be related to parsing errors at all.
I refactored the code to:
try {
const el = document.createElement("div");
el.innerHTML = content;
console.log(content);
const doc = DOMParser.fromSchema(schema).parse(el);
const state = EditorState.create({
doc,
plugins: []
});
state.doc.check();
container.innerHTML = "";
const view = new EditorView({ mount: container }, { state });
el.remove();
} catch (e) {
console.error("error parsing", e);
}
even with valid input (below) I’m getting the same errors when I focus on the editor.
<h1>title</h1>
<p>paragraph</p>
As of right now, I am recreating the editor every time the content changes. The output of PM is correct as well:
<div class="s-Hsmovd_is9MC ProseMirror" contenteditable="true">
<h1>title</h1>
<p>paragraph</p>
</div>