1 files changed, 21 insertions, 38 deletions

diff --git a/spec/javascripts/repo/components/repo_loading_file_spec.js b/spec/javascripts/repo/components/repo_loading_file_spec.js
index a030314d749..031f2a9c0b2 100644
--- a/spec/javascripts/repo/components/repo_loading_file_spec.js
+++ b/spec/javascripts/repo/components/repo_loading_file_spec.js
@@ -1,12 +1,16 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import repoLoadingFile from '~/repo/components/repo_loading_file.vue';
+import { resetStore } from '../helpers';
 
 describe('RepoLoadingFile', () => {
-  function createComponent(propsData) {
+  let vm;
+
+  function createComponent() {
     const RepoLoadingFile = Vue.extend(repoLoadingFile);
 
     return new RepoLoadingFile({
-      propsData,
+      store,
     }).$mount();
   }
 
@@ -28,52 +32,31 @@ describe('RepoLoadingFile', () => {
     });
   }
 
-  it('renders 3 columns of animated LoC', () => {
-    const vm = createComponent({
-      loading: {
-        tree: true,
-      },
-      hasFiles: false,
-    });
-    const columns = [...vm.$el.querySelectorAll('td')];
+  afterEach(() => {
+    vm.$destroy();
 
-    expect(columns.length).toEqual(3);
-    assertColumns(columns);
+    resetStore(vm.$store);
   });
 
-  it('renders 1 column of animated LoC if isMini', () => {
-    const vm = createComponent({
-      loading: {
-        tree: true,
-      },
-      hasFiles: false,
-      isMini: true,
-    });
+  it('renders 3 columns of animated LoC', () => {
+    vm = createComponent();
     const columns = [...vm.$el.querySelectorAll('td')];
 
-    expect(columns.length).toEqual(1);
+    expect(columns.length).toEqual(3);
     assertColumns(columns);
   });
 
-  it('does not render if tree is not loading', () => {
-    const vm = createComponent({
-      loading: {
-        tree: false,
-      },
-      hasFiles: false,
-    });
+  it('renders 1 column of animated LoC if isMini', (done) => {
+    vm = createComponent();
+    vm.$store.state.openFiles.push('test');
 
-    expect(vm.$el.innerHTML).toBeFalsy();
-  });
+    vm.$nextTick(() => {
+      const columns = [...vm.$el.querySelectorAll('td')];
 
-  it('does not render if hasFiles is true', () => {
-    const vm = createComponent({
-      loading: {
-        tree: true,
-      },
-      hasFiles: true,
-    });
+      expect(columns.length).toEqual(1);
+      assertColumns(columns);
 
-    expect(vm.$el.innerHTML).toBeFalsy();
+      done();
+    });
   });
 });