1 files changed, 43 insertions, 0 deletions
diff --git a/spec/frontend/kubernetes_dashboard/components/workload_stats_spec.js b/spec/frontend/kubernetes_dashboard/components/workload_stats_spec.js
new file mode 100644
index 00000000000..d1bee0c0a16
--- /dev/null
+++ b/spec/frontend/kubernetes_dashboard/components/workload_stats_spec.js
@@ -0,0 +1,43 @@
+import { shallowMount } from '@vue/test-utils';
+import { GlSingleStat } from '@gitlab/ui/dist/charts';
+import WorkloadStats from '~/kubernetes_dashboard/components/workload_stats.vue';
+import { mockPodStats } from '../graphql/mock_data';
+
+let wrapper;
+
+const createWrapper = () => {
+  wrapper = shallowMount(WorkloadStats, {
+    propsData: {
+      stats: mockPodStats,
+    },
+  });
+};
+
+const findAllStats = () => wrapper.findAllComponents(GlSingleStat);
+const findSingleStat = (at) => findAllStats().at(at);
+
+describe('Workload stats component', () => {
+  it('renders GlSingleStat component for each stat', () => {
+    createWrapper();
+
+    expect(findAllStats()).toHaveLength(4);
+  });
+
+  it.each`
+    count | title          | index
+    ${2}  | ${'Running'}   | ${0}
+    ${1}  | ${'Pending'}   | ${1}
+    ${1}  | ${'Succeeded'} | ${2}
+    ${2}  | ${'Failed'}    | ${3}
+  `(
+    'renders stat with title "$title" and count "$count" at index $index',
+    ({ count, title, index }) => {
+      createWrapper();
+
+      expect(findSingleStat(index).props()).toMatchObject({
+        value: count,
+        title,
+      });
+    },
+  );
+});