1 files changed, 102 insertions, 0 deletions
diff --git a/spec/frontend/pipeline_wizard/pipeline_wizard_spec.js b/spec/frontend/pipeline_wizard/pipeline_wizard_spec.js
new file mode 100644
index 00000000000..dd0304518a3
--- /dev/null
+++ b/spec/frontend/pipeline_wizard/pipeline_wizard_spec.js
@@ -0,0 +1,102 @@
+import { parseDocument } from 'yaml';
+import PipelineWizard from '~/pipeline_wizard/pipeline_wizard.vue';
+import PipelineWizardWrapper from '~/pipeline_wizard/components/wrapper.vue';
+import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
+import {
+  fullTemplate as template,
+  fullTemplateWithoutFilename as templateWithoutFilename,
+} from './mock/yaml';
+
+const projectPath = 'foo/bar';
+const defaultBranch = 'main';
+
+describe('PipelineWizard', () => {
+  let wrapper;
+
+  const createComponent = (props = {}) => {
+    wrapper = shallowMountExtended(PipelineWizard, {
+      propsData: {
+        projectPath,
+        defaultBranch,
+        template,
+        ...props,
+      },
+    });
+  };
+
+  afterEach(() => {
+    wrapper.destroy();
+  });
+
+  it('mounts without error', () => {
+    const consoleSpy = jest.spyOn(console, 'error');
+
+    createComponent();
+
+    expect(consoleSpy).not.toHaveBeenCalled();
+    expect(wrapper.exists()).toBe(true);
+  });
+
+  it('mounts the wizard wrapper', () => {
+    createComponent();
+
+    expect(wrapper.findComponent(PipelineWizardWrapper).exists()).toBe(true);
+  });
+
+  it('passes the correct steps prop to the wizard wrapper', () => {
+    createComponent();
+
+    expect(wrapper.findComponent(PipelineWizardWrapper).props('steps')).toEqual(
+      parseDocument(template).get('steps'),
+    );
+  });
+
+  it('passes all other expected props to the wizard wrapper', () => {
+    createComponent();
+
+    expect(wrapper.findComponent(PipelineWizardWrapper).props()).toEqual(
+      expect.objectContaining({
+        defaultBranch,
+        projectPath,
+        filename: parseDocument(template).get('filename'),
+      }),
+    );
+  });
+
+  it('passes ".gitlab-ci.yml" as default filename to the wizard wrapper', () => {
+    createComponent({ template: templateWithoutFilename });
+
+    expect(wrapper.findComponent(PipelineWizardWrapper).attributes('filename')).toBe(
+      '.gitlab-ci.yml',
+    );
+  });
+
+  it('allows overriding the defaultFilename with `defaultFilename` prop', () => {
+    const defaultFilename = 'foobar.yml';
+
+    createComponent({
+      template: templateWithoutFilename,
+      defaultFilename,
+    });
+
+    expect(wrapper.findComponent(PipelineWizardWrapper).attributes('filename')).toBe(
+      defaultFilename,
+    );
+  });
+
+  it('displays the title', () => {
+    createComponent();
+
+    expect(wrapper.findByTestId('title').text()).toBe(
+      parseDocument(template).get('title').toString(),
+    );
+  });
+
+  it('displays the description', () => {
+    createComponent();
+
+    expect(wrapper.findByTestId('description').text()).toBe(
+      parseDocument(template).get('description').toString(),
+    );
+  });
+});