1 files changed, 59 insertions, 0 deletions
diff --git a/spec/frontend/ide/components/ide_status_mr_spec.js b/spec/frontend/ide/components/ide_status_mr_spec.js
new file mode 100644
index 00000000000..4d9ad61201d
--- /dev/null
+++ b/spec/frontend/ide/components/ide_status_mr_spec.js
@@ -0,0 +1,59 @@
+import { shallowMount } from '@vue/test-utils';
+import { GlIcon, GlLink } from '@gitlab/ui';
+import { TEST_HOST } from 'helpers/test_constants';
+import IdeStatusMr from '~/ide/components/ide_status_mr.vue';
+
+const TEST_TEXT = '!9001';
+const TEST_URL = `${TEST_HOST}merge-requests/9001`;
+
+describe('ide/components/ide_status_mr', () => {
+  let wrapper;
+
+  const createComponent = props => {
+    wrapper = shallowMount(IdeStatusMr, {
+      propsData: props,
+    });
+  };
+  const findIcon = () => wrapper.find(GlIcon);
+  const findLink = () => wrapper.find(GlLink);
+
+  afterEach(() => {
+    wrapper.destroy();
+  });
+
+  describe('when mounted', () => {
+    beforeEach(() => {
+      createComponent({
+        text: TEST_TEXT,
+        url: TEST_URL,
+      });
+    });
+
+    it('renders icon', () => {
+      const icon = findIcon();
+
+      expect(icon.exists()).toBe(true);
+      expect(icon.props()).toEqual(
+        expect.objectContaining({
+          name: 'merge-request',
+        }),
+      );
+    });
+
+    it('renders link', () => {
+      const link = findLink();
+
+      expect(link.exists()).toBe(true);
+      expect(link.attributes()).toEqual(
+        expect.objectContaining({
+          href: TEST_URL,
+        }),
+      );
+      expect(link.text()).toEqual(TEST_TEXT);
+    });
+
+    it('renders text', () => {
+      expect(wrapper.text()).toBe(`Merge request ${TEST_TEXT}`);
+    });
+  });
+});