1 files changed, 39 insertions, 0 deletions
diff --git a/spec/frontend/analytics/components/activity_chart_spec.js b/spec/frontend/analytics/components/activity_chart_spec.js
new file mode 100644
index 00000000000..1f0f9a6c5d7
--- /dev/null
+++ b/spec/frontend/analytics/components/activity_chart_spec.js
@@ -0,0 +1,39 @@
+import { shallowMount } from '@vue/test-utils';
+import { GlColumnChart } from '@gitlab/ui/dist/charts';
+import ActivityChart from '~/analytics/product_analytics/components/activity_chart.vue';
+
+describe('Activity Chart Bundle', () => {
+  let wrapper;
+  function mountComponent({ provide }) {
+    wrapper = shallowMount(ActivityChart, {
+      provide: {
+        formattedData: {},
+        ...provide,
+      },
+    });
+  }
+
+  afterEach(() => {
+    wrapper.destroy();
+    wrapper = null;
+  });
+
+  const findChart = () => wrapper.find(GlColumnChart);
+  const findNoData = () => wrapper.find('[data-testid="noActivityChartData"]');
+
+  describe('Activity Chart', () => {
+    it('renders an warning message with no data', () => {
+      mountComponent({ provide: { formattedData: {} } });
+      expect(findNoData().exists()).toBe(true);
+    });
+
+    it('renders a chart with data', () => {
+      mountComponent({
+        provide: { formattedData: { keys: ['key1', 'key2'], values: [5038, 2241] } },
+      });
+
+      expect(findNoData().exists()).toBe(false);
+      expect(findChart().exists()).toBe(true);
+    });
+  });
+});