fix(ContentRenderer): empty content detection (#1653)

nuxt · Nov 3, 2022 · dee9ae1 · dee9ae1
1 parent 954a224
commit dee9ae1
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 1 deletion.
diff --git a/src/runtime/components/ContentRenderer.vue b/src/runtime/components/ContentRenderer.vue
@@ -60,7 +60,7 @@ export default defineComponent({
 
     const { value, excerpt, tag } = ctx
 
-    if (!value && slots?.empty) {
+    if ((!value || !value?.body?.children?.length) && slots?.empty) {
       // Fallback on `empty` slot.
       return slots.empty({ value, excerpt, tag, ...this.$attrs })
     }

diff --git a/test/basic.test.ts b/test/basic.test.ts
@@ -94,6 +94,11 @@ describe('Basic usage', async () => {
     expect(html).contains('Persian')
   })
 
+  test('Empty slot', async () => {
+    const html = await $fetch('/features/empty-slot')
+    expect(html).contains('Empty!!!')
+  })
+
   test('<ContentDoc> head management (if same path)', async () => {
     const html = await $fetch('/head')
     expect(html).contains('<title>Head overwritten</title>')

diff --git a/test/fixtures/basic/pages/features/empty-slot.vue b/test/fixtures/basic/pages/features/empty-slot.vue
@@ -0,0 +1,35 @@
+<template>
+  <ContentRenderer :value="emptyDocument">
+    <template #empty>
+      Empty!!!
+    </template>
+  </ContentRenderer>
+</template>
+
+<script setup>
+const emptyDocument = {
+  _path: '/_markdown',
+  _dir: '',
+  _draft: false,
+  _partial: true,
+  _locale: 'en',
+  _empty: true,
+  title: 'Markdown',
+  description: '',
+  body: {
+    type: 'root',
+    children: [],
+    toc: {
+      title: '',
+      searchDepth: 2,
+      depth: 2,
+      links: []
+    }
+  },
+  _type: 'markdown',
+  _id: 'content:_markdown.md',
+  _source: 'content',
+  _file: '_markdown.md',
+  _extension: 'md'
+}
+</script>