fix: v3 tests

packages/v3/src/components/CvButton/CvButtonSet.stories.js

@@ -12,7 +12,7 @@ export default {
 };
 
 const template = `
-<cv-button-set v-bind="$props">
+<cv-button-set v-bind="args">
   <cv-button>One</cv-button>
   <cv-button kind="secondary">Two</cv-button>
   <cv-button kind="danger">Three</cv-button>

packages/v3/src/components/CvButton/sbBtnPrefix.js

@@ -1 +1,2 @@
+/* istanbul ignore next */
 export const sbBtnPrefix = 'CvButtons';

packages/v3/src/components/CvTag/__tests__/CvTag.spec.js

@@ -17,20 +17,19 @@ describe('CvTag', () => {
 
     // check if the root span exists
     // - verify classes on the root span
-    const tagSpan = wrapper.find('span');
-    expect(tagSpan.classes()).toContain(`${carbonPrefix}--tag`);
-    expect(tagSpan.classes()).toContain(`${carbonPrefix}--tag--${tagKind}`);
+    expect(wrapper.classes()).toContain(`${carbonPrefix}--tag`);
+    expect(wrapper.classes()).toContain(`${carbonPrefix}--tag--${tagKind}`);
 
     // check if the label exists
     // - verify the tag label class
     // - verify if the label's content is equal to the given label text
-    const labelSpan = tagSpan.find('span');
+    const labelSpan = wrapper.find('span');
     expect(labelSpan.classes()).toContain(`${carbonPrefix}--tag__label`);
     expect(labelSpan.element.innerText).toEqual();
 
     // check if the remove button exists
     // - it should not, becuase the filter is set to false
-    expect(tagSpan.find('button').exists()).toBe(false);
+    expect(wrapper.find('button').exists()).toBe(false);
   });
 
   it('CvTag - filter', () => {
@@ -46,20 +45,19 @@ describe('CvTag', () => {
 
     // check if the root span exists
     // - verify classes on the root span
-    const tagSpan = wrapper.find('span');
-    expect(tagSpan.classes()).toContain(`${carbonPrefix}--tag`);
-    expect(tagSpan.classes()).toContain(`${carbonPrefix}--tag--${tagKind}`);
+    expect(wrapper.classes()).toContain(`${carbonPrefix}--tag`);
+    expect(wrapper.classes()).toContain(`${carbonPrefix}--tag--${tagKind}`);
 
     // check if the label exists
     // - verify the tag label class
     // - verify if the label's content is equal to the given label text
-    const labelSpan = tagSpan.find('span');
+    const labelSpan = wrapper.find('span');
     expect(labelSpan.classes()).toContain(`${carbonPrefix}--tag__label`);
-    expect(labelSpan.element.innerText).toEqual();
+    expect(labelSpan.innerText).toEqual();
 
     // check if the remove button exists
     // - it should not, becuase the filter is set to false
-    const removeButton = tagSpan.find('button');
+    const removeButton = wrapper.find('button');
     expect(removeButton.exists()).toBe(true);
 
     // click on remove button
@@ -83,12 +81,34 @@ describe('CvTag', () => {
 
     // check if the root span exists
     // - verify tag disabled class on span
-    const tagSpan = wrapper.find('span');
-    expect(tagSpan.classes()).toContain(`${carbonPrefix}--tag--disabled`);
+    expect(wrapper.classes()).toContain(`${carbonPrefix}--tag--disabled`);
 
     // Call onRemove directly to test disabled path
     wrapper.vm.onRemove();
     // check if it emitted remove
     expect(wrapper.emitted().remove).toBeFalsy();
   });
+
+  it('CvTag - skeleton', () => {
+    const tagKind = 'red';
+    const tagLabel = 'test tag label';
+    const wrapper = shallowMount(CvTag, {
+      props: {
+        kind: tagKind,
+        label: tagLabel,
+        filter: false,
+        skeleton: true,
+      },
+    });
+
+    // check if the root span exists
+    // - verify tag disabled class on span
+    expect(wrapper.classes()).toContain(`${carbonPrefix}--skeleton`);
+
+    const labelSpan = wrapper.find('span');
+    expect(labelSpan.exists()).toBe(false);
+
+    const removeButton = wrapper.find('button');
+    expect(removeButton.exists()).toBe(false);
+  });
 });

packages/v3/src/global/storybook-utils/__tests__/story-source-code.js

@@ -3,7 +3,7 @@ import { storySourceCode } from '../story-source-code';
 
 describe('global/storybook-utils/storyParametersObject', () => {
   it('Should build properties from null', () => {
-    const parameters = storyParametersObject(null, '<div v-bind="$props" />', {
+    const parameters = storyParametersObject(null, '<div v-bind="args" />', {
       prop1: 'prop1',
       prop2: 'prop2',
     });
@@ -18,7 +18,7 @@ describe('global/storybook-utils/storyParametersObject', () => {
   });
 
   it('Should build properties from {}', () => {
-    const parameters = storyParametersObject({}, '<div v-bind="$props" />', {
+    const parameters = storyParametersObject({}, '<div v-bind="args" />', {
       prop1: 'prop1',
       prop2: 'prop2',
     });
@@ -35,7 +35,7 @@ describe('global/storybook-utils/storyParametersObject', () => {
   it('Should build properties from { docs: {}}', () => {
     const parameters = storyParametersObject(
       { docs: {} },
-      '<div v-bind="$props" />',
+      '<div v-bind="args" />',
       {
         prop1: 'prop1',
         prop2: 'prop2',
@@ -54,7 +54,7 @@ describe('global/storybook-utils/storyParametersObject', () => {
   it('Should build properties from { docs: { source: {}}}', () => {
     const parameters = storyParametersObject(
       { docs: { source: {} } },
-      '<div v-bind="$props" />',
+      '<div v-bind="args" />',
       {
         prop1: 'prop1',
         prop2: 'prop2',
@@ -71,7 +71,7 @@ describe('global/storybook-utils/storyParametersObject', () => {
   });
 
   it('Should build properties from with non-string props', () => {
-    const parameters = storyParametersObject(null, '<div v-bind="$props" />', {
+    const parameters = storyParametersObject(null, '<div v-bind="args" />', {
       prop1: true,
       prop2: 2,
     });
@@ -105,7 +105,7 @@ describe('global/storybook-utils/storyParametersObject', () => {
   });
 
   it('Should deal with default values', () => {
-    const parameters = storyParametersObject(null, '<div v-bind="$props" />', {
+    const parameters = storyParametersObject(null, '<div v-bind="args" />', {
       prop1: false,
       prop2: '',
       prop3: 0,
@@ -123,7 +123,7 @@ describe('global/storybook-utils/storyParametersObject', () => {
   it('Is OK with zero pros', () => {
     const parameters = storyParametersObject(
       null,
-      '<div v-bind="$props" />',
+      '<div v-bind="args" />',
       null
     );
 
@@ -137,7 +137,7 @@ describe('global/storybook-utils/storyParametersObject', () => {
   });
 
   it('Is does not add slotArgs', () => {
-    const parameters = storyParametersObject(null, '<div v-bind="$props" />', {
+    const parameters = storyParametersObject(null, '<div v-bind="args" />', {
       'slotArgs.abc': 'abc',
     });
 
@@ -153,7 +153,7 @@ describe('global/storybook-utils/storyParametersObject', () => {
 
 describe('global/storybook-utils/storySourceCode', () => {
   it('Works with a default parameter', () => {
-    const result = storySourceCode('<div v-bind="$props" />', {
+    const result = storySourceCode('<div v-bind="args" />', {
       prop1: 'prop1',
     });
 

packages/v3/src/global/storybook-utils/story-source-code.js

@@ -1,7 +1,7 @@
 export const storySourceCode = (
   templateSource,
   args,
-  replacing = 'v-bind="$props"'
+  replacing = 'v-bind="args"'
 ) => {
   const propToSource = (key, val) => {
     if (key.startsWith('slotArgs.')) return '';