renderToHTMLString stops rendering nodes after youtube extension

[EndlessWord]

Affected Packages

@tiptap/extension-youtube

Version(s)

3.4.3

Bug Description

input:

renderToHTMLString({
  content: {
    type: 'doc',
    content: [
      {
        type: 'youtube',
        attrs: {
          src: 'https://www.youtube.com/watch?v=3lTUAWOgoHs',
        },
      },
      {
        type: 'paragraph',
        content: [
          {
            type: 'text',
            text: 'text after youtube',
          },
        ],
      },
    ],
  },
  extensions: [StarterKit, Youtube],
})

output:

<div data-youtube-video=""><iframe class="document-youtube" width="640" height="480" allowfullscreen="true" autoplay="false" cclanguage="undefined" ccloadpolicy="undefined" disablekbcontrols="false" enableiframeapi="false" endtime="0" interfacelanguage="undefined" ivloadpolicy="0" loop="false" modestbranding="false" origin="" playlist="" progressbarcolor="undefined" rel="1" src="https://www.youtube.com/embed/3lTUAWOgoHs?rel=1" start="0"></iframe></div>

Browser Used

Chrome

Code Example URL

https://codesandbox.io/p/devbox/pensive-sound-pjvjnz

Expected Behavior

'text after youtube' should rendered

Additional Context (Optional)

No response

Dependency Updates

• Yes, I've updated all my dependencies.

[EndlessWord]

The temporary solution is to modify renderHTML

renderHTML({ HTMLAttributes }) {
    // exit code
    return [
      'div',
      { 'data-youtube-video': '' },
      [
        'iframe',
        mergeAttributes(
          this.options.HTMLAttributes,
          {
            width: this.options.width,
            height: this.options.height,
            allowfullscreen: this.options.allowFullscreen,
            autoplay: this.options.autoplay,
            ccLanguage: this.options.ccLanguage,
            ccLoadPolicy: this.options.ccLoadPolicy,
            disableKBcontrols: this.options.disableKBcontrols,
            enableIFrameApi: this.options.enableIFrameApi,
            endTime: this.options.endTime,
            interfaceLanguage: this.options.interfaceLanguage,
            ivLoadPolicy: this.options.ivLoadPolicy,
            loop: this.options.loop,
            modestBranding: this.options.modestBranding,
            origin: this.options.origin,
            playlist: this.options.playlist,
            progressBarColor: this.options.progressBarColor,
            rel: this.options.rel,
          },
          HTMLAttributes,
        ),
        // ++++
        0
      ],
    ]
  },

can someone explain why this works?