Wrapping multiple elements

1

Hello,

I’m trying to wrap multiple elements within another node. Specifically, I am trying to wrap two paragraphs within a custom node that I have defined.

In my schema definition, I defined the NodeSpec like so:

org_property: {
      defining: true,
      priority: 60,
      group: "block",
      content: "paragraph{2}",
      parseDOM: [{tag: 'div.orgProperty[data-label="property-label"]'}],
      toDOM() { return ["div", {"data-label": "property-label", "class": "orgProperty"}, 0] }
    }

I’ve also defined an InputRule to recognize when text needs to be converted into a org_property.

When I match this input rule, I call a function that returns a transaction, like so:

function handleOrgPropertyRule(state, match, start, end) {
  let trans = state.tr
  let resstart = trans.doc.resolve(start)
  let resend = trans.doc.resolve(end)
  let span = new NodeRange(resstart, resend, 1)
  // In order to insert my org_property, it needs to fit in the document.
  // insertPoint says I should insert at (start - 1).
  let whereinsert = insertPoint(trans.doc, start, state.schema.nodes.org_property)
  let find = findWrapping(span, state.schema.nodes.org_property, {}) // Returns NULL.
  trans.wrap(span, [{type: state.schema.nodes.org_property, attrs: {}}]) // This seems to fail... since we can't find an appropriate wrapping.
  return trans;
}

At this point, wrap() will fail because we can’t find an appropriate place to insert this within the range. My initial thought was that we can’t insert it because I require two paragraphs, so I attempted to split the current node with the split() function, to no avail.

Currently, I get an error reporting that I have Invalid content for node paragraph. I’m using the paragraph definition from the example-setup. I think this makes sense because the content of a paragraph is “inline*”. I don’t actually want to be inserting inside the paragraph… but rather wrap the paragraph node instead. I notice that insertPoint() reports that I should be inserting a org_property just one position before the start of the match, but any time I try to wrap outside of the original start and end positions, I usually get an undefined error.

Does anyone have any advise on how I would go about wrapping the paragraphs with my custom node?

2

I am trying to solve the same thing. Were you ever able to figure this out?

3

My recommendation is to actually go into the console and expose the editor, make something to print out the contents of the prosemirror structure after you call each command, confirm it does what you expect. This stuff is not obvious. So I’d highly recommend enhancing your debugging techniques. I’ve had to debug deep into prosemirror itself to figure out what certain things don’t work. This is a very difficult tool to use because it’s so easy to use it the wrong way, that said, it’s a very powerful tool and easy to use if you understand what you’re doing and what you want to achieve.

4

It works if you change the code like this

new NodeRange(resstart, resend, 0)