fix: don't set empty keys on marks

closes #116
nuxt-modules · May 15, 2021 · cefdaaa · cefdaaa
1 parent 69b9768
commit cefdaaa
Show file tree

Hide file tree

Showing 4 changed files with 105 additions and 1 deletion.
diff --git a/example/pages/text.vue b/example/pages/text.vue
@@ -0,0 +1,55 @@
+<template>
+  <div>
+    <SanityContent :blocks="blocks" />
+  </div>
+</template>
+<script>
+export default {
+  data () {
+    return {
+      blocks: [{
+        _key: 'd810da8ac845',
+        _type: 'block',
+        children: [
+          {
+            _key: 'd810da8ac8450',
+            _type: 'span',
+            marks: [],
+            text: 'An example of ',
+          },
+          {
+            _key: '7dc51c030a2f',
+            _type: 'span',
+            marks: [
+              'strong',
+            ],
+            text: 'bold',
+          },
+          {
+            _key: '794714489c2d',
+            _type: 'span',
+            marks: [],
+            text: ' text and ',
+          },
+          {
+            _key: '23487f',
+            _type: 'span',
+            marks: [
+              'strong',
+            ],
+            text: 'another',
+          },
+          {
+            _key: '230498a',
+            _type: 'span',
+            marks: [],
+            text: '.',
+          },
+        ],
+        markDefs: [],
+        style: 'normal',
+      }],
+    }
+  },
+}
+</script>
diff --git a/src/components/sanity-content.ts b/src/components/sanity-content.ts
@@ -101,7 +101,7 @@ function getProps (item?: Record<string, any>) {
     (obj, [key, value]) => {
       switch (true) {
         case ['_key', 'key'].includes(key):
-          obj.key = value
+          obj.key = value || null
           return obj
 
         case ['class', 'href', 'src'].includes(key):

diff --git a/test/unit/__snapshots__/sanity-content.test.ts.snap b/test/unit/__snapshots__/sanity-content.test.ts.snap
@@ -51,6 +51,12 @@ exports[`SanityContent should render nestedList blocks 1`] = `
 </div>
 `;
 
+exports[`SanityContent should render strong blocks 1`] = `
+<div>
+  <p>An example of <strong>bold</strong> text and <strong>another</strong>.</p>
+</div>
+`;
+
 exports[`SanityContent should render with no props 1`] = `<div></div>`;
 
 exports[`SanityContent should render with non-standard props 1`] = `<section class="customClass"></section>`;
diff --git a/test/unit/sanity-content.test.ts b/test/unit/sanity-content.test.ts
@@ -171,6 +171,49 @@ const exampleBlocks: Record<string, ExampleBlock | ExampleBlock[]> = {
     ],
     style: 'blockquote',
   },
+  strong:
+    {
+      _key: 'd810da8ac845',
+      _type: 'block',
+      children: [
+        {
+          _key: 'd810da8ac8450',
+          _type: 'span',
+          marks: [],
+          text: 'An example of ',
+        },
+        {
+          _key: '7dc51c030a2f',
+          _type: 'span',
+          marks: [
+            'strong',
+          ],
+          text: 'bold',
+        },
+        {
+          _key: '794714489c2d',
+          _type: 'span',
+          marks: [],
+          text: ' text and ',
+        },
+        {
+          _key: '23487f',
+          _type: 'span',
+          marks: [
+            'strong',
+          ],
+          text: 'another',
+        },
+        {
+          _key: '230498a',
+          _type: 'span',
+          marks: [],
+          text: '.',
+        },
+      ],
+      markDefs: [],
+      style: 'normal',
+    },
   exampleMarkDefs: {
     _key: '3522a2a863b9',
     _type: 'block',