remove typenames extension and move attribute logic back to the schema initialization logic

demos/src/Examples/Default/React/index.jsx

@@ -230,6 +230,6 @@ const content = `
 
 export default () => {
   return (
-    <EditorProvider slotBefore={<MenuBar />} extensions={extensions} content={content}></EditorProvider>
+    <EditorProvider slotBefore={<MenuBar />} extensions={extensions} content={content} rendering={{ addTypeAttributes: true }}></EditorProvider>
   )
 }

packages/core/src/Editor.ts

@@ -16,7 +16,6 @@ import {
   ClipboardTextSerializer, Commands, Drop, Editable, FocusEvents, Keymap, Paste,
   Tabindex,
 } from './extensions/index.js'
-import { Typenames } from './extensions/typenames.js'
 import { createDocument } from './helpers/createDocument.js'
 import { getAttributes } from './helpers/getAttributes.js'
 import { getHTMLFromFragment } from './helpers/getHTMLFromFragment.js'
@@ -79,8 +78,9 @@ export class Editor extends EventEmitter<EditorEvents> {
     coreExtensionOptions: {},
     enableInputRules: true,
     enablePasteRules: true,
-    enableCoreExtensions: { typenames: false },
+    enableCoreExtensions: true,
     enableContentCheck: false,
+    addTypeAttributes: false,
     onBeforeCreate: () => null,
     onCreate: () => null,
     onUpdate: () => null,
@@ -287,7 +287,6 @@ export class Editor extends EventEmitter<EditorEvents> {
       Tabindex,
       Drop,
       Paste,
-      Typenames,
     ].filter(ext => {
       if (typeof this.options.enableCoreExtensions === 'object') {
         return this.options.enableCoreExtensions[ext.name as keyof typeof this.options.enableCoreExtensions] !== false

packages/core/src/ExtensionManager.ts

@@ -272,6 +272,7 @@ export class ExtensionManager {
           const extensionAttributes = this.attributes.filter(
             attribute => attribute.type === extension.name,
           )
+
           const context = {
             name: extension.name,
             options: extension.options,

packages/core/src/extensions/typenames.ts

@@ -1,19 +0,0 @@
-import { Extension } from '../Extension.js'
-
-export const Typenames = Extension.create({
-  name: 'typenames',
-
-  addGlobalAttributes() {
-    return this.extensions.filter(extension => {
-      return extension.name !== 'text' && extension.name !== 'doc'
-    }).map(extension => ({
-      types: [extension.name],
-      attributes: {
-        'data-tiptap': {
-          default: extension.name,
-          rendered: true,
-        },
-      },
-    }))
-  },
-})

packages/core/src/helpers/getHTMLFromFragment.ts

@@ -3,11 +3,6 @@ import { DOMSerializer, Fragment, Schema } from '@tiptap/pm/model'
 export function getHTMLFromFragment(fragment: Fragment, schema: Schema): string {
   const documentFragment = DOMSerializer.fromSchema(schema).serializeFragment(fragment)
 
-  // remove the data-tiptap attribute
-  documentFragment.querySelectorAll('[data-tiptap]').forEach(node => {
-    node.removeAttribute('data-tiptap')
-  })
-
   const temporaryDocument = document.implementation.createHTMLDocument()
   const container = temporaryDocument.createElement('div')
 

packages/core/src/helpers/getSchemaByResolvedExtensions.ts

@@ -106,11 +106,20 @@ export function getSchemaByResolvedExtensions(extensions: Extensions, editor?: E
       )
 
       if (renderHTML) {
-        schema.toDOM = node => renderHTML({
+        schema.toDOM = node => {
+          const HTMLAttributes = getRenderedAttributes(node, extensionAttributes)
+
+          if (editor?.options.addTypeAttributes) {
+            HTMLAttributes['data-tiptap-element'] = ''
+            HTMLAttributes['data-tiptap-name'] = extension.name
+          }
+
+          return renderHTML({
             node,
-          HTMLAttributes: getRenderedAttributes(node, extensionAttributes),
+            HTMLAttributes,
           })
         }
+      }
 
       const renderText = getExtensionField<NodeConfig['renderText']>(
         extension,
@@ -186,11 +195,20 @@ export function getSchemaByResolvedExtensions(extensions: Extensions, editor?: E
       )
 
       if (renderHTML) {
-        schema.toDOM = mark => renderHTML({
+        schema.toDOM = mark => {
+          const HTMLAttributes = getRenderedAttributes(mark, extensionAttributes)
+
+          if (editor?.options.addTypeAttributes) {
+            HTMLAttributes['data-tiptap-element'] = ''
+            HTMLAttributes['data-tiptap-name'] = extension.name
+          }
+
+          return renderHTML({
             mark,
-          HTMLAttributes: getRenderedAttributes(mark, extensionAttributes),
+            HTMLAttributes,
           })
         }
+      }
 
       return [extension.name, schema]
     }),

packages/core/src/types.ts

@@ -114,7 +114,6 @@ export interface EditorOptions {
           | 'focusEvents'
           | 'keymap'
           | 'tabindex'
-          | 'typenames'
           | 'drop'
           | 'paste',
           false
@@ -127,6 +126,10 @@ export interface EditorOptions {
    * @default false
    */
   enableContentCheck: boolean;
+  /**
+   * If `true`, all editor nodes will have a `data-tiptap-element` attribute with the node type name.
+   */
+  addTypeAttributes?: boolean;
   onBeforeCreate: (props: EditorEvents['beforeCreate']) => void;
   onCreate: (props: EditorEvents['create']) => void;
   /**