Add latest changes from gitlab-org/gitlab@master

4 files changed, 187 insertions, 35 deletions

diff --git a/spec/frontend/repository/components/preview/__snapshots__/index_spec.js.snap b/spec/frontend/repository/components/preview/__snapshots__/index_spec.js.snap
new file mode 100644
index 00000000000..3d5ec3fd411
--- /dev/null
+++ b/spec/frontend/repository/components/preview/__snapshots__/index_spec.js.snap
@@ -0,0 +1,36 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Repository file preview component renders file HTML 1`] = `
+<article
+  class="file-holder js-hide-on-navigation limited-width-container readme-holder"
+>
+  <div
+    class="file-title"
+  >
+    <i
+      aria-hidden="true"
+      class="fa fa-file-text-o fa-fw"
+    />
+     
+    <gllink-stub
+      href="http://test.com"
+    >
+      <strong>
+        README.md
+      </strong>
+    </gllink-stub>
+  </div>
+   
+  <div
+    class="blob-viewer"
+  >
+    <div>
+      <div
+        class="blob"
+      >
+        test
+      </div>
+    </div>
+  </div>
+</article>
+`;
diff --git a/spec/frontend/repository/components/preview/index_spec.js b/spec/frontend/repository/components/preview/index_spec.js
new file mode 100644
index 00000000000..0112e6310f4
--- /dev/null
+++ b/spec/frontend/repository/components/preview/index_spec.js
@@ -0,0 +1,49 @@
+import { shallowMount } from '@vue/test-utils';
+import { GlLoadingIcon } from '@gitlab/ui';
+import Preview from '~/repository/components/preview/index.vue';
+
+let vm;
+let $apollo;
+
+function factory(blob) {
+  $apollo = {
+    query: jest.fn().mockReturnValue(Promise.resolve({})),
+  };
+
+  vm = shallowMount(Preview, {
+    propsData: {
+      blob,
+    },
+    mocks: {
+      $apollo,
+    },
+  });
+}
+
+describe('Repository file preview component', () => {
+  afterEach(() => {
+    vm.destroy();
+  });
+
+  it('renders file HTML', () => {
+    factory({
+      webUrl: 'http://test.com',
+      name: 'README.md',
+    });
+
+    vm.setData({ readme: { html: '<div class="blob">test</div>' } });
+
+    expect(vm.element).toMatchSnapshot();
+  });
+
+  it('renders loading icon', () => {
+    factory({
+      webUrl: 'http://test.com',
+      name: 'README.md',
+    });
+
+    vm.setData({ loading: 1 });
+
+    expect(vm.find(GlLoadingIcon).exists()).toBe(true);
+  });
+});
diff --git a/spec/frontend/repository/components/table/index_spec.js b/spec/frontend/repository/components/table/index_spec.js
index 0c5a7370fca..1e2f3501c8c 100644
--- a/spec/frontend/repository/components/table/index_spec.js
+++ b/spec/frontend/repository/components/table/index_spec.js
@@ -1,18 +1,34 @@
 import { shallowMount } from '@vue/test-utils';
 import { GlSkeletonLoading } from '@gitlab/ui';
 import Table from '~/repository/components/table/index.vue';
+import TableRow from '~/repository/components/table/row.vue';
 
 let vm;
 let $apollo;
 
-function factory(path, data = () => ({})) {
-  $apollo = {
-    query: jest.fn().mockReturnValue(Promise.resolve({ data: data() })),
-  };
-
+const MOCK_BLOBS = [
+  {
+    id: '123abc',
+    flatPath: 'blob',
+    name: 'blob.md',
+    type: 'blob',
+    webUrl: 'http://test.com',
+  },
+  {
+    id: '124abc',
+    flatPath: 'blob2',
+    name: 'blob2.md',
+    type: 'blob',
+    webUrl: 'http://test.com',
+  },
+];
+
+function factory({ path, isLoading = false, entries = {} }) {
   vm = shallowMount(Table, {
     propsData: {
       path,
+      isLoading,
+      entries,
     },
     mocks: {
       $apollo,
@@ -31,7 +47,7 @@ describe('Repository table component', () => {
     ${'app/assets'} | ${'master'}
     ${'/'}          | ${'test'}
   `('renders table caption for $ref in $path', ({ path, ref }) => {
-    factory(path);
+    factory({ path });
 
     vm.setData({ ref });
 
@@ -41,40 +57,20 @@ describe('Repository table component', () => {
   });
 
   it('shows loading icon', () => {
-    factory('/');
-
-    vm.setData({ isLoadingFiles: true });
+    factory({ path: '/', isLoading: true });
 
     expect(vm.find(GlSkeletonLoading).exists()).toBe(true);
   });
 
-  describe('normalizeData', () => {
-    it('normalizes edge nodes', () => {
-      const output = vm.vm.normalizeData('blobs', [{ node: '1' }, { node: '2' }]);
-
-      expect(output).toEqual(['1', '2']);
+  it('renders table rows', () => {
+    factory({
+      path: '/',
+      entries: {
+        blobs: MOCK_BLOBS,
+      },
     });
-  });
-
-  describe('hasNextPage', () => {
-    it('returns undefined when hasNextPage is false', () => {
-      const output = vm.vm.hasNextPage({
-        trees: { pageInfo: { hasNextPage: false } },
-        submodules: { pageInfo: { hasNextPage: false } },
-        blobs: { pageInfo: { hasNextPage: false } },
-      });
 
-      expect(output).toBe(undefined);
-    });
-
-    it('returns pageInfo object when hasNextPage is true', () => {
-      const output = vm.vm.hasNextPage({
-        trees: { pageInfo: { hasNextPage: false } },
-        submodules: { pageInfo: { hasNextPage: false } },
-        blobs: { pageInfo: { hasNextPage: true, nextCursor: 'test' } },
-      });
-
-      expect(output).toEqual({ hasNextPage: true, nextCursor: 'test' });
-    });
+    expect(vm.find(TableRow).exists()).toBe(true);
+    expect(vm.findAll(TableRow).length).toBe(2);
   });
 });
diff --git a/spec/frontend/repository/components/tree_content_spec.js b/spec/frontend/repository/components/tree_content_spec.js
new file mode 100644
index 00000000000..954c4791c04
--- /dev/null
+++ b/spec/frontend/repository/components/tree_content_spec.js
@@ -0,0 +1,71 @@
+import { shallowMount } from '@vue/test-utils';
+import TreeContent from '~/repository/components/tree_content.vue';
+import FilePreview from '~/repository/components/preview/index.vue';
+
+let vm;
+let $apollo;
+
+function factory(path, data = () => ({})) {
+  $apollo = {
+    query: jest.fn().mockReturnValue(Promise.resolve({ data: data() })),
+  };
+
+  vm = shallowMount(TreeContent, {
+    propsData: {
+      path,
+    },
+    mocks: {
+      $apollo,
+    },
+  });
+}
+
+describe('Repository table component', () => {
+  afterEach(() => {
+    vm.destroy();
+  });
+
+  it('renders file preview', () => {
+    factory('/');
+
+    vm.setData({ entries: { blobs: [{ name: 'README.md ' }] } });
+
+    expect(vm.find(FilePreview).exists()).toBe(true);
+  });
+
+  describe('normalizeData', () => {
+    it('normalizes edge nodes', () => {
+      factory('/');
+
+      const output = vm.vm.normalizeData('blobs', [{ node: '1' }, { node: '2' }]);
+
+      expect(output).toEqual(['1', '2']);
+    });
+  });
+
+  describe('hasNextPage', () => {
+    it('returns undefined when hasNextPage is false', () => {
+      factory('/');
+
+      const output = vm.vm.hasNextPage({
+        trees: { pageInfo: { hasNextPage: false } },
+        submodules: { pageInfo: { hasNextPage: false } },
+        blobs: { pageInfo: { hasNextPage: false } },
+      });
+
+      expect(output).toBe(undefined);
+    });
+
+    it('returns pageInfo object when hasNextPage is true', () => {
+      factory('/');
+
+      const output = vm.vm.hasNextPage({
+        trees: { pageInfo: { hasNextPage: false } },
+        submodules: { pageInfo: { hasNextPage: false } },
+        blobs: { pageInfo: { hasNextPage: true, nextCursor: 'test' } },
+      });
+
+      expect(output).toEqual({ hasNextPage: true, nextCursor: 'test' });
+    });
+  });
+});