Add latest changes from gitlab-org/gitlab@14-1-stable-eev14.1.0-rc42

4 files changed, 123 insertions, 0 deletions

diff --git a/spec/frontend/repository/components/blob_viewers/__snapshots__/empty_viewer_spec.js.snap b/spec/frontend/repository/components/blob_viewers/__snapshots__/empty_viewer_spec.js.snap
new file mode 100644
index 00000000000..e702ea5fd00
--- /dev/null
+++ b/spec/frontend/repository/components/blob_viewers/__snapshots__/empty_viewer_spec.js.snap
@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Empty Viewer matches the snapshot 1`] = `
+<div
+  class="nothing-here-block"
+>
+  Empty file
+</div>
+`;
diff --git a/spec/frontend/repository/components/blob_viewers/download_viewer_spec.js b/spec/frontend/repository/components/blob_viewers/download_viewer_spec.js
new file mode 100644
index 00000000000..c71b2b3c55c
--- /dev/null
+++ b/spec/frontend/repository/components/blob_viewers/download_viewer_spec.js
@@ -0,0 +1,70 @@
+import { GlLink, GlIcon } from '@gitlab/ui';
+import { shallowMount } from '@vue/test-utils';
+import { numberToHumanSize } from '~/lib/utils/number_utils';
+import DownloadViewer from '~/repository/components/blob_viewers/download_viewer.vue';
+
+describe('Text Viewer', () => {
+  let wrapper;
+
+  const DEFAULT_PROPS = {
+    fileName: 'file_name.js',
+    filePath: '/some/file/path',
+    fileSize: 2269674,
+  };
+
+  const createComponent = (props = {}) => {
+    wrapper = shallowMount(DownloadViewer, {
+      propsData: {
+        ...DEFAULT_PROPS,
+        ...props,
+      },
+    });
+  };
+
+  it('renders component', () => {
+    createComponent();
+
+    const { fileName, filePath, fileSize } = DEFAULT_PROPS;
+    expect(wrapper.props()).toMatchObject({
+      fileName,
+      filePath,
+      fileSize,
+    });
+  });
+
+  it('renders download human readable file size text', () => {
+    createComponent();
+
+    const downloadText = `Download (${numberToHumanSize(DEFAULT_PROPS.fileSize)})`;
+    expect(wrapper.text()).toBe(downloadText);
+  });
+
+  it('renders download text', () => {
+    createComponent({
+      fileSize: 0,
+    });
+
+    expect(wrapper.text()).toBe('Download');
+  });
+
+  it('renders download link', () => {
+    createComponent();
+    const { filePath, fileName } = DEFAULT_PROPS;
+
+    expect(wrapper.findComponent(GlLink).attributes()).toMatchObject({
+      rel: 'nofollow',
+      target: '_blank',
+      href: filePath,
+      download: fileName,
+    });
+  });
+
+  it('renders download icon', () => {
+    createComponent();
+
+    expect(wrapper.findComponent(GlIcon).props()).toMatchObject({
+      name: 'download',
+      size: 16,
+    });
+  });
+});
diff --git a/spec/frontend/repository/components/blob_viewers/empty_viewer_spec.js b/spec/frontend/repository/components/blob_viewers/empty_viewer_spec.js
new file mode 100644
index 00000000000..e65f20ea0af
--- /dev/null
+++ b/spec/frontend/repository/components/blob_viewers/empty_viewer_spec.js
@@ -0,0 +1,14 @@
+import { shallowMount } from '@vue/test-utils';
+import EmptyViewer from '~/repository/components/blob_viewers/empty_viewer.vue';
+
+describe('Empty Viewer', () => {
+  let wrapper;
+
+  beforeEach(() => {
+    wrapper = shallowMount(EmptyViewer);
+  });
+
+  it('matches the snapshot', () => {
+    expect(wrapper.element).toMatchSnapshot();
+  });
+});
diff --git a/spec/frontend/repository/components/blob_viewers/text_viewer_spec.js b/spec/frontend/repository/components/blob_viewers/text_viewer_spec.js
new file mode 100644
index 00000000000..88c5bee6564
--- /dev/null
+++ b/spec/frontend/repository/components/blob_viewers/text_viewer_spec.js
@@ -0,0 +1,30 @@
+import { shallowMount } from '@vue/test-utils';
+import waitForPromises from 'helpers/wait_for_promises';
+import TextViewer from '~/repository/components/blob_viewers/text_viewer.vue';
+import SourceEditor from '~/vue_shared/components/source_editor.vue';
+
+describe('Text Viewer', () => {
+  let wrapper;
+  const propsData = {
+    content: 'Some content',
+    fileName: 'file_name.js',
+    readOnly: true,
+  };
+
+  const createComponent = () => {
+    wrapper = shallowMount(TextViewer, { propsData });
+  };
+
+  const findEditor = () => wrapper.findComponent(SourceEditor);
+
+  it('renders a Source Editor component', async () => {
+    createComponent();
+
+    await waitForPromises();
+
+    expect(findEditor().exists()).toBe(true);
+    expect(findEditor().props('value')).toBe(propsData.content);
+    expect(findEditor().props('fileName')).toBe(propsData.fileName);
+    expect(findEditor().props('editorOptions')).toEqual({ readOnly: propsData.readOnly });
+  });
+});