1 files changed, 58 insertions, 94 deletions
diff --git a/spec/javascripts/repo/components/repo_file_spec.js b/spec/javascripts/repo/components/repo_file_spec.js
index 620b604f404..bf9181fb09c 100644
--- a/spec/javascripts/repo/components/repo_file_spec.js
+++ b/spec/javascripts/repo/components/repo_file_spec.js
@@ -1,40 +1,31 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import repoFile from '~/repo/components/repo_file.vue';
-import RepoStore from '~/repo/stores/repo_store';
+import { file, resetStore } from '../helpers';
 
 describe('RepoFile', () => {
   const updated = 'updated';
-  const file = {
-    icon: 'icon',
-    url: 'url',
-    name: 'name',
-    lastCommitMessage: 'message',
-    lastCommitUpdate: Date.now(),
-    level: 10,
-  };
-  const activeFile = {
-    pageTitle: 'pageTitle',
-    url: 'url',
-  };
-  const otherFile = {
-    html: '<p class="file-content">html</p>',
-    pageTitle: 'otherpageTitle',
-  };
+  let vm;
 
   function createComponent(propsData) {
     const RepoFile = Vue.extend(repoFile);
 
     return new RepoFile({
+      store,
       propsData,
     }).$mount();
   }
 
-  it('renders link, icon, name and last commit details', () => {
+  afterEach(() => {
+    resetStore(vm.$store);
+  });
+
+  it('renders link, icon and name', () => {
     const RepoFile = Vue.extend(repoFile);
-    const vm = new RepoFile({
+    vm = new RepoFile({
+      store,
       propsData: {
-        file,
-        activeFile,
+        file: file(),
       },
     });
     spyOn(vm, 'timeFormated').and.returnValue(updated);
@@ -43,108 +34,81 @@ describe('RepoFile', () => {
     const name = vm.$el.querySelector('.repo-file-name');
     const fileIcon = vm.$el.querySelector('.file-icon');
 
-    expect(vm.$el.classList.contains('active')).toBeTruthy();
-    expect(vm.$el.querySelector(`.${file.icon}`).style.marginLeft).toEqual('100px');
-    expect(name.title).toEqual(file.url);
-    expect(name.href).toMatch(`/${file.url}`);
-    expect(name.textContent.trim()).toEqual(file.name);
-    expect(vm.$el.querySelector('.commit-message').textContent.trim()).toBe(file.lastCommitMessage);
-    expect(vm.$el.querySelector('.commit-update').textContent.trim()).toBe(updated);
-    expect(fileIcon.classList.contains(file.icon)).toBeTruthy();
-    expect(fileIcon.style.marginLeft).toEqual(`${file.level * 10}px`);
+    expect(vm.$el.querySelector(`.${vm.file.icon}`).style.marginLeft).toEqual('0px');
+    expect(name.href).toMatch(`/${vm.file.url}`);
+    expect(name.textContent.trim()).toEqual(vm.file.name);
+    expect(fileIcon.classList.contains(vm.file.icon)).toBeTruthy();
+    expect(fileIcon.style.marginLeft).toEqual(`${vm.file.level * 10}px`);
+    expect(vm.$el.querySelectorAll('.animation-container').length).toBe(2);
   });
 
   it('does render if hasFiles is true and is loading tree', () => {
-    const vm = createComponent({
-      file,
-      activeFile,
-      loading: {
-        tree: true,
-      },
-      hasFiles: true,
+    vm = createComponent({
+      file: file(),
     });
 
-    expect(vm.$el.innerHTML).toBeTruthy();
     expect(vm.$el.querySelector('.fa-spin.fa-spinner')).toBeFalsy();
   });
 
-  it('sets the document title correctly', () => {
-    RepoStore.setActiveFiles(otherFile);
-
-    expect(document.title.trim()).toEqual(otherFile.pageTitle);
-  });
-
   it('renders a spinner if the file is loading', () => {
-    file.loading = true;
-    const vm = createComponent({
-      file,
-      activeFile,
-      loading: {
-        tree: true,
-      },
-      hasFiles: true,
+    const f = file();
+    f.loading = true;
+    vm = createComponent({
+      file: f,
     });
 
-    expect(vm.$el.innerHTML).toBeTruthy();
-    expect(vm.$el.querySelector('.fa-spin.fa-spinner').style.marginLeft).toEqual(`${file.level * 10}px`);
+    expect(vm.$el.querySelector('.fa-spin.fa-spinner')).not.toBeNull();
+    expect(vm.$el.querySelector('.fa-spin.fa-spinner').style.marginLeft).toEqual(`${vm.file.level * 16}px`);
   });
 
-  it('does not render if loading tree', () => {
-    const vm = createComponent({
-      file,
-      activeFile,
-      loading: {
-        tree: true,
-      },
+  it('does not render commit message and datetime if mini', (done) => {
+    vm = createComponent({
+      file: file(),
     });
+    vm.$store.state.openFiles.push(vm.file);
 
-    expect(vm.$el.innerHTML).toBeFalsy();
-  });
+    vm.$nextTick(() => {
+      expect(vm.$el.querySelector('.commit-message')).toBeFalsy();
+      expect(vm.$el.querySelector('.commit-update')).toBeFalsy();
 
-  it('does not render commit message and datetime if mini', () => {
-    const vm = createComponent({
-      file,
-      activeFile,
-      isMini: true,
+      done();
     });
-
-    expect(vm.$el.querySelector('.commit-message')).toBeFalsy();
-    expect(vm.$el.querySelector('.commit-update')).toBeFalsy();
   });
 
-  it('does not set active class if file is active file', () => {
-    const vm = createComponent({
-      file,
-      activeFile: {},
+  it('fires clickedTreeRow when the link is clicked', () => {
+    vm = createComponent({
+      file: file(),
     });
 
-    expect(vm.$el.classList.contains('active')).toBeFalsy();
-  });
+    spyOn(vm, 'clickedTreeRow');
 
-  it('fires linkClicked when the link is clicked', () => {
-    const vm = createComponent({
-      file,
-      activeFile,
-    });
+    vm.$el.click();
 
-    spyOn(vm, 'linkClicked');
+    expect(vm.clickedTreeRow).toHaveBeenCalledWith(vm.file);
+  });
 
-    vm.$el.querySelector('.repo-file-name').click();
+  describe('submodule', () => {
+    let f;
 
-    expect(vm.linkClicked).toHaveBeenCalledWith(file);
-  });
+    beforeEach(() => {
+      f = file('submodule name', '123456789');
+      f.type = 'submodule';
 
-  describe('methods', () => {
-    describe('linkClicked', () => {
-      const vm = jasmine.createSpyObj('vm', ['$emit']);
+      vm = createComponent({
+        file: f,
+      });
+    });
 
-      it('$emits linkclicked with file obj', () => {
-        const theFile = {};
+    afterEach(() => {
+      vm.$destroy();
+    });
 
-        repoFile.methods.linkClicked.call(vm, theFile);
+    it('renders submodule short ID', () => {
+      expect(vm.$el.querySelector('.commit-sha').textContent.trim()).toBe('12345678');
+    });
 
-        expect(vm.$emit).toHaveBeenCalledWith('linkclicked', theFile);
-      });
+    it('renders ID next to submodule name', () => {
+      expect(vm.$el.querySelector('td').textContent.replace(/\s+/g, ' ')).toContain('submodule name @ 12345678');
     });
   });
 });