Fixed failing tests.

src/components/hy-key-figure-group/hy-key-figure-group.tsx

@@ -30,7 +30,7 @@ export class HyKeyFigureGroup implements ComponentInterface {
   }
 
   getBoxClassName(count) {
-    var className = 'box';
+    let className = 'box';
 
     if (count % 3 == 0) {
       className = 'box-3';

src/components/hy-key-figure-group/test/hy-key-figure-group.spec.tsx

 import {newSpecPage} from '@stencil/core/testing';
-import {HyKeyFigureGroup} from './hy-key-figure-group';
+import {HyKeyFigureGroup} from '../hy-key-figure-group';
 
 describe('hy-key-figure-group', () => {
   it('renders', async () => {
     const page = await newSpecPage({
       components: [HyKeyFigureGroup],
-      html: `<hy-key-figure-group></hy-key-figure-group>`
+      html: `<hy-key-figure-group data-items='[{"heading":"a","description":"b"}]'></hy-key-figure-group>`
     });
     expect(page.root).toEqualHtml(`
-      <hy-key-figure-group>
+      <hy-key-figure-group data-items="[{&quot;heading&quot;:&quot;a&quot;,&quot;description&quot;:&quot;b&quot;}]">
         <mock:shadow-root>
-          <slot></slot>
+          <div class="big hy-key-figure-group-container">
+            <div class="hy-key-figure-group">
+              <hy-key-figure class="box" description="b" heading="a" variant="big"></hy-key-figure>
+            </div>
+          </div>
         </mock:shadow-root>
       </hy-key-figure-group>
     `);

src/components/hy-key-figure/test/hy-key-figure.spec.tsx

 import {newSpecPage} from '@stencil/core/testing';
-import {HyKeyFigure} from './hy-key-figure';
+import {HyKeyFigure} from '../hy-key-figure';
 
 describe('hy-key-figure', () => {
   it('renders', async () => {
@@ -10,7 +10,10 @@ describe('hy-key-figure', () => {
     expect(page.root).toEqualHtml(`
       <hy-key-figure>
         <mock:shadow-root>
-          <slot></slot>
+          <div class="big hy-key-figure">
+            <div class="hy-key-figure__title"></div>
+            <div class="hy-key-figure__description"></div>
+          </div>
         </mock:shadow-root>
       </hy-key-figure>
     `);

src/components/hy-key-highlight-group/test/hy-key-highlight-group.spec.tsx

 import {newSpecPage} from '@stencil/core/testing';
-import {HyKeyHighlightGroup} from './hy-key-highlight-group';
+import {HyKeyHighlightGroup} from '../hy-key-highlight-group';
 
 describe('hy-key-highlight-group', () => {
   it('renders', async () => {
     const page = await newSpecPage({
       components: [HyKeyHighlightGroup],
-      html: `<hy-key-highlight-group></hy-key-highlight-group>`
+      html: `<hy-key-highlight-group  data-items='[{"heading":"a","description":"b"}]'></hy-key-highlight-group>`
     });
     expect(page.root).toEqualHtml(`
-      <hy-key-highlight-group>
+      <hy-key-highlight-group data-items="[{&quot;heading&quot;:&quot;a&quot;,&quot;description&quot;:&quot;b&quot;}]">
         <mock:shadow-root>
-          <slot></slot>
+          <div class="big hy-key-highlight-group">
+            <hy-key-highlight class="box" description="b" heading="a" variant="big"></hy-key-highlight>
+          </div>
         </mock:shadow-root>
       </hy-key-highlight-group>
     `);

src/components/hy-key-highlight/test/hy-key-highlight.spec.tsx

 import {newSpecPage} from '@stencil/core/testing';
-import {HyKeyHighlight} from './hy-key-highlight';
+import {HyKeyHighlight} from '../hy-key-highlight';
 
 describe('hy-key-highlight', () => {
   it('renders', async () => {
@@ -10,7 +10,15 @@ describe('hy-key-highlight', () => {
     expect(page.root).toEqualHtml(`
       <hy-key-highlight>
         <mock:shadow-root>
-          <slot></slot>
+          <div class="big hy-key-highlight">
+            <div class="hy-key-highlight__title__container">
+              <div class="hy-key-highlight__title"></div>
+              <div class="hy-key-highlight__overlay--container">
+                <div class="hy-key-highlight__overlay"></div>
+              </div>
+            </div>
+            <div class="hy-key-highlight__description"></div>
+          </div>
         </mock:shadow-root>
       </hy-key-highlight>
     `);