fix: t3debug correct name and render

TYPO3-Headless · Jul 21, 2023 · 0f3b295 · 0f3b295
1 parent 5f08f48
commit 0f3b295
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 9 deletions.
diff --git a/lib/components/T3Debug/T3Debug.vue b/lib/components/T3Debug/T3Debug.vue
@@ -5,12 +5,12 @@ export default {
   functional: true,
   render (createElement, ctx) {
     return createElement(
-      'div',
+      'pre',
       {
         style: {
           position: 'relative'
         },
-        class: 't3p-debug'
+        class: 't3-debug'
       },
       [
         createElement(
@@ -22,7 +22,6 @@ export default {
               color: '#000',
               display: 'inline-block',
               wordBreak: 'break-word',
-              position: 'absolute',
               fontSize: '12px',
               fontFamily:
                 'SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace',
@@ -33,7 +32,7 @@ export default {
               backgroundColor: '#FED7D7'
             }
           },
-          JSON.stringify(ctx.props)
+          JSON.stringify(ctx.props, null, 4)
         ),
         ctx.children
       ]

diff --git a/lib/components/T3Dynamic/T3Dynamic.js b/lib/components/T3Dynamic/T3Dynamic.js
@@ -73,9 +73,9 @@ export default {
     const element = createElement(tag, data)
 
     if (this.$nuxt.$typo3.options.debug) {
-      return createElement('t3-debug', { props: this.data }, [
-        element
-      ])
+      return createElement('div', {
+        class: 't3-debug-wrapper'
+      }, [createElement('t3-debug', { props: { tag, data: this.data } }), element])
     }
 
     return element

diff --git a/lib/plugins/components.js b/lib/plugins/components.js
@@ -3,7 +3,7 @@ import T3BlDefault from '~typo3/components/T3BlDefault'
 import T3HtmlParser from '~typo3/components/T3HtmlParser'
 import T3LangSwitcher from '~typo3/components/T3LangSwitcher'
 import T3NavLink from '~typo3/components/T3NavLink'
-import T3CeDebug from '~typo3/components/T3Debug'
+import T3Debug from '~typo3/components/T3Debug'
 import T3Dynamic from '~typo3/components/T3Dynamic'
 import T3Frame from '~typo3/components/T3Frame'
 import T3Renderer from '~typo3/components/T3Renderer'
@@ -35,7 +35,7 @@ const components = {
   T3HtmlParser,
   T3LangSwitcher,
   T3NavLink,
-  T3CeDebug,
+  T3Debug,
   T3CeDefault,
   T3Dynamic,
   T3Frame,