Hello, I’ve been trying to write my own image NodeType so it behaves as a block, so I created the NodeSpec, the Schema replacing old image NodeSpec with the one that I created, parsed the content with the DOMParser (renamed as ProseDOMParser to use along with default DOMParser)
const imageSpec = {
attrs: {
src: { default: '' },
style: { default: 'display:block;' }
},
inline: false,
group: "block",
draggable: false,
toDOM: node => {
return ["img", { ...node.attrs }]
},
parseDom: [{
tag: 'img[src]',
getAttrs: (dom) => {
let src = dom.getAttribute("src")
let style = dom.getAttribute("style")
return { src, style };
}
}]
}
const imageSchema = new Schema({
nodes: state.schema.spec.nodes.remove('image').addBefore('doc', 'image', imageSpec),
marks: state.schema.spec.marks
});
const doc = new DOMParser().parseFromString(localContent, 'text/html');
const proseDoc = ProseDOMParser.fromSchema(imageSchema).parse(doc.body);
The localContent is a string variable with this value:
<p>asdf</p>
<img src="http://localhost:3000/api/rating/system/41574/richtext/image/83008" style="display:block;" />
The thing is the result in proseDoc variable is only a paragraph node added to the doc Node:
{
"type": "doc",
"content": [{
"type": "paragraph",
"attrs": {
"style": null,
"class": null,
"id": null
},
"content": [{
"type": "text",
"text": "asdf"
}]
}]
}
Did I miss something in the NodeSpec or Schema?