Back

Technologies:

javascriptjavascript
avatar
Tolerim
18 hours ago

How can I stop text in ProseMirror-Document from automatically shifting upwards when the previous node becomes vacant?

As a senior JavaScript developer, I am working with a shortened custom schema that uses different nodes to create a document with a title and body. The schema includes a title node that is intended to be separate from the document body, even if the title content is deleted. To achieve this, the "isolating: true" property was set for the title node, but it does not seem to work as expected. The official documentation states that this property should prevent regular editing operations from crossing the title boundary, but it is not functioning as intended.
Answers(1)
avatar
Tolerim
18 hours ago
Verified Answer
The isolating property in the schema is used to indicate that a node should be treated as an atomic node for editing purposes. However, it does not prevent the content inside the isolating node from being deleted. In order to achieve the desired behavior, you can add a custom deletion behavior for the title node using the delete command. This will prevent the user from being able to delete the last character of the title node when they are editing it. Here is an example of how you can modify the title node to achieve the desired behavior: 
// ...
  nodes: {
    // ...
    title: {
      // ...
      delete: (state, dispatch) => {
        // Determine the current selection
        const { $from } = state.selection

        // If the current selection is within the title node, prevent deletion
        if ($from.depth > 0 && $from.nodeBefore.type.name === 'title') {
          return false
        }

        // Otherwise, allow deletion to proceed normally
        return true
      }
    },
    // ...
  }
})
In this example, we have added a delete property to the title node that defines a custom deletion behavior. The behavior checks if the current selection is within the title node, and if it is, it returns false to prevent deletion. Otherwise, it returns true to allow deletion to proceed normally.
;