add getSchema & getHtml utility functions to generate HTML from a ProseMirror/tiptap document, without an Editor instance

docs/src/demos/Api/Schema/index.vue

@@ -0,0 +1,38 @@
+<template>
+  <pre>{{ this.html }}</pre>
+</template>
+
+<script>
+import { generateHtml } from '@tiptap/core'
+import { defaultExtensions } from '@tiptap/vue-starter-kit'
+
+export default {
+
+  data() {
+    return {
+      doc: {
+        'type': 'document',
+        'content': [{
+          'type': 'paragraph',
+          'attrs': {
+            'align': 'left'
+          },
+          'content': [{
+            'type': 'text',
+            'text': 'My sample text'
+          }]
+        }]
+      }
+    }
+  },
+
+  computed: {
+    html() {
+      const extensions = defaultExtensions()
+
+      return generateHtml(this.doc, extensions)
+    }
+  }
+
+}
+</script>

docs/src/docPages/api/schema.md

@@ -1,5 +1,19 @@
 # Schema
 
+## Get the ProseMirror schema without initializing the editor
+
+```js
+import { getSchema } from '@tiptap/core'
+
+const schema = getSchema(extensions)
+```
+
+## Generate HTML from ProseMirror JSON without initializing the editor
+
+<demo name="Api/Schema" />
+
+## Old Content
+
 :::warning Out of date
 This content is written for tiptap 1 and needs an update.
 :::

packages/core/index.ts

@@ -9,3 +9,6 @@ export { default as Mark } from './src/Mark'
 
 export { default as markInputRule } from './src/inputRules/markInputRule'
 export { default as markPasteRule } from './src/pasteRules/markPasteRule'
+
+export { default as getSchema } from './src/utils/getSchema'
+export { default as generateHtml } from './src/utils/generateHtml'

packages/core/src/utils/generateHtml.ts

@@ -0,0 +1,21 @@
+import Extension from '../Extension'
+import Node from '../Node'
+import Mark from '../Mark'
+import getSchema from './getSchema'
+import { Node as ProseMirrorNode, DOMSerializer } from "prosemirror-model"
+
+export default function generateHtml(doc: object, extensions: (Extension | Node | Mark)[]): string {
+  const schema = getSchema(extensions)
+
+  let contentNode = ProseMirrorNode.fromJSON(schema, doc)
+  let temporaryDocument = document.implementation.createHTMLDocument()
+  const div = temporaryDocument.createElement('div')
+
+  const fragment = DOMSerializer
+    .fromSchema(schema)
+    .serializeFragment(contentNode.content)
+
+  div.appendChild(fragment)
+
+  return div.innerHTML
+}

packages/core/src/utils/getSchema.ts

@@ -0,0 +1,35 @@
+import Extension from '../Extension'
+import Node from '../Node'
+import Mark from '../Mark'
+import { Schema } from 'prosemirror-model'
+import collect from 'collect.js'
+
+export default function getSchema(extensions: (Extension | Node | Mark)[]): Schema {
+  return new Schema({
+    topNode: getTopNodeFromExtensions(extensions),
+    nodes: getNodesFromExtensions(extensions),
+    marks: getMarksFromExtensions(extensions),
+  })
+}
+
+function getNodesFromExtensions(extensions: (Extension | Node | Mark)[]): any {
+  return collect(extensions)
+    .where('extensionType', 'node')
+    .mapWithKeys((extension: Node) => [extension.name, extension.schema()])
+    .all()
+}
+
+function getTopNodeFromExtensions(extensions: (Extension | Node | Mark)[]): any {
+  const topNode = collect(extensions).firstWhere('topNode', true)
+
+  if (topNode) {
+    return topNode.name
+  }
+}
+
+function getMarksFromExtensions(extensions: (Extension | Node | Mark)[]): any {
+  return collect(extensions)
+    .where('extensionType', 'mark')
+    .mapWithKeys((extension: Mark) => [extension.name, extension.schema()])
+    .all()
+}