diff --git a/client/components/editor/editor-asciidoc.vue b/client/components/editor/editor-asciidoc.vue
index 296b2414..126ba370 100644
--- a/client/components/editor/editor-asciidoc.vue
+++ b/client/components/editor/editor-asciidoc.vue
@@ -228,7 +228,8 @@ export default {
       })
 
       this.previewHTML = DOMPurify.sanitize($.html(), {
-        ADD_TAGS: ['foreignObject']
+        ADD_TAGS: ['foreignObject'],
+        HTML_INTEGRATION_POINTS: { foreignobject: true }
       })
     },
     /**
diff --git a/client/components/editor/editor-markdown.vue b/client/components/editor/editor-markdown.vue
index 4ca6e192..baee118d 100644
--- a/client/components/editor/editor-markdown.vue
+++ b/client/components/editor/editor-markdown.vue
@@ -454,7 +454,8 @@ export default {
       // this.$store.set('editor/content', newContent)
       this.processMarkers(this.cm.firstLine(), this.cm.lastLine())
       this.previewHTML = DOMPurify.sanitize(md.render(newContent), {
-        ADD_TAGS: ['foreignObject']
+        ADD_TAGS: ['foreignObject'],
+        HTML_INTEGRATION_POINTS: { foreignobject: true }
       })
       this.$nextTick(() => {
         tabsetHelper.format()
diff --git a/server/modules/rendering/html-security/renderer.js b/server/modules/rendering/html-security/renderer.js
index 3bf9b2dc..b57aaf1b 100644
--- a/server/modules/rendering/html-security/renderer.js
+++ b/server/modules/rendering/html-security/renderer.js
@@ -34,7 +34,8 @@ module.exports = {
 
       input = DOMPurify.sanitize(input, {
         ADD_ATTR: allowedAttrs,
-        ADD_TAGS: allowedTags
+        ADD_TAGS: allowedTags,
+        HTML_INTEGRATION_POINTS: { foreignobject: true }
       })
     }
     return input