Closed tylersuchan closed 3 months ago
Tiptap represents it's information based on Prosemirrror, which strictly adheres to it's format and does not allow additional metadata to be attached to the node/mark. The only additional data it allows are attrs
which are like in HTML <img src="/image.png" />
where the attrs would be src: "/image.png"
anything that is not defined in this format is stripped out of the prosemirror schema.
If your editor requires that metadata for it's functioning, then add the metadata to attrs
, if it does not require it, then I'd probably keep that metadata around somewhere and have an attr to associate the id to the metadata information that you want.
This is not seen as a deficiency of tiptap, just how prosemirror works and is able to enforce consistency
Affected Packages
@tiptap/react
Version(s)
2.3.0
Bug Description
Hello!
I tried searching current issues to see if anyone else had this issue, but I wasn't able to find anything. I am using Tiptap with React. For my team's usecase, we need to be able to communicate with a backend service when certain user interactions occur. We want to be able to render additional components within the editor based on certain metadata that these services return. Our tiptap component is initialized like so:
You'll notice I'm setting the content to be the return value of this function called
As we can see,
convertArrayToJSONContent
. That was an attempt to convert the initial report information I'm getting from the backend into the format tiptap requires, defined like so:Content
can be of typeJSONContent
, which allows for custom fields to be included (the[key: string]: any
bit.The definition for
convertArrayToJSONContent
is defined like so:Where
reportContents
is a list ofReportContent
objects. That is themockReport
in this case, which I will define here (and shorten to not make this complicated):You will notice that in the
convertToJSONContent
function, I attempt to set metadata both withincontent
and as its own field. However, when I attempt to logeditor.getJSON
, none of the metadata fields are included. This is the object returned to me:No metadata to be found. Would anyone know why this would be? Is this a bug, or is it possible I'm doing something wrong/misinterpreting the documentation?
Any assistance is much appreciated. Thank you!
Browser Used
Chrome
Code Example URL
No response
Expected Behavior
When setting the
content
field inuseEditor
for@tiptap/react
to be able to provide additional key: value pairings defined within theJSONContent
type.Additional Context (Optional)
No response
Dependency Updates