diff --git a/docs/pages/testing-playground.vue b/docs/pages/testing-playground.vue
index a357770c5..2a75a607e 100644
--- a/docs/pages/testing-playground.vue
+++ b/docs/pages/testing-playground.vue
@@ -8,8 +8,9 @@
   -->
   <div id="testing-playground" style="padding: 24px">
     <component :is="component" v-bind="componentProps">
-      <template v-for="(slot, name) in slots" :slot="[name === 'default' ? '' : name]">
+      <template v-for="(slot, name) in slots">
         <component
+          :key="name"
           v-if="slot.element"
           :is="slot.element"
           v-bind="slot.elementProps"
diff --git a/lib/buttons-and-links/__tests__/KButton.spec.js b/lib/buttons-and-links/__tests__/KButton.spec.js
index 9fbf56efb..720b84a02 100644
--- a/lib/buttons-and-links/__tests__/KButton.spec.js
+++ b/lib/buttons-and-links/__tests__/KButton.spec.js
@@ -153,18 +153,20 @@ describe('KButton', () => {
       await takeSnapshot('KButton - Dropdown Opened', { widths: [400], minHeight: 512 });
     });
     
-    it('should render the slot when the slot has content', async () => {
+    it('should render the default slot when provided', async () => {
       await renderComponent(
         'KButton',
         { text: 'Button' },
         {
           default: {
             element: 'span',
-            innerHTML: 'Default Slot Test',
+            elementProps: { class: 'default-slot-class' },
+            innerHTML: '<span>Default Slot Content</span>',
           },
         }
       );
       await takeSnapshot('KButton - With Default Slot', { widths: [400], minHeight: 512 });
     });
+    
   });
 });