[ci skip] Improved repo_file_spec

This commit is contained in:
Luke "Jared" Bennett 2017-08-02 15:39:44 +01:00
parent a1f2bd7daa
commit 1cb18b00f1
No known key found for this signature in database
GPG key ID: 402ED51FB5D306C2
3 changed files with 22 additions and 3 deletions

View file

@ -42,7 +42,7 @@ export default RepoFile;
<template> <template>
<tr class="file" v-if="!loading.tree || hasFiles" :class="{'active': activeFile.url === file.url}"> <tr class="file" v-if="!loading.tree || hasFiles" :class="{'active': activeFile.url === file.url}">
<td @click.prevent="linkClicked(file)"> <td @click.prevent="linkClicked(file)">
<i class="fa" v-if="!file.loading" :class="file.icon" :style="{'margin-left': file.level * 10 + 'px'}"></i> <i class="fa file-icon" v-if="!file.loading" :class="file.icon" :style="{'margin-left': file.level * 10 + 'px'}"></i>
<i class="fa fa-spinner fa-spin" v-if="file.loading" :style="{'margin-left': file.level * 10 + 'px'}"></i> <i class="fa fa-spinner fa-spin" v-if="file.loading" :style="{'margin-left': file.level * 10 + 'px'}"></i>
<a :href="file.url" class="repo-file-name" :title="file.url">{{file.name}}</a> <a :href="file.url" class="repo-file-name" :title="file.url">{{file.name}}</a>
</td> </td>

View file

@ -1,7 +1,7 @@
import Vue from 'vue'; import Vue from 'vue';
import repoFileOptions from '~/repo/repo_file_options.vue'; import repoFileOptions from '~/repo/repo_file_options.vue';
fdescribe('RepoFileOptions', () => { describe('RepoFileOptions', () => {
const projectName = 'projectName'; const projectName = 'projectName';
function createComponent(propsData) { function createComponent(propsData) {

View file

@ -1,7 +1,7 @@
import Vue from 'vue'; import Vue from 'vue';
import repoFile from '~/repo/repo_file.vue'; import repoFile from '~/repo/repo_file.vue';
describe('RepoFile', () => { fdescribe('RepoFile', () => {
const updated = 'updated'; const updated = 'updated';
const file = { const file = {
icon: 'icon', icon: 'icon',
@ -33,6 +33,7 @@ describe('RepoFile', () => {
activeFile, activeFile,
}); });
const name = vm.$el.querySelector('.repo-file-name'); 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.classList.contains('active')).toBeTruthy();
expect(vm.$el.querySelector(`.${file.icon}`).style.marginLeft).toEqual('100px'); expect(vm.$el.querySelector(`.${file.icon}`).style.marginLeft).toEqual('100px');
@ -41,6 +42,8 @@ describe('RepoFile', () => {
expect(name.textContent).toEqual(file.name); expect(name.textContent).toEqual(file.name);
expect(vm.$el.querySelector('.commit-message').textContent).toBe(file.lastCommitMessage); expect(vm.$el.querySelector('.commit-message').textContent).toBe(file.lastCommitMessage);
expect(vm.$el.querySelector('.commit-update').textContent).toBe(updated); expect(vm.$el.querySelector('.commit-update').textContent).toBe(updated);
expect(fileIcon.classList.contains(file.icon)).toBeTruthy();
expect(fileIcon.style.marginLeft).toEqual(`${file.level * 10}px`);
}); });
it('does render if hasFiles is true and is loading tree', () => { it('does render if hasFiles is true and is loading tree', () => {
@ -54,6 +57,22 @@ describe('RepoFile', () => {
}); });
expect(vm.$el.innerHTML).toBeTruthy(); expect(vm.$el.innerHTML).toBeTruthy();
expect(vm.$el.querySelector('.fa-spin.fa-spinner')).toBeFalsy();
});
it('renders a spinner if the file is loading', () => {
file.loading = true;
const vm = createComponent({
file,
activeFile,
loading: {
tree: true,
},
hasFiles: true,
});
expect(vm.$el.innerHTML).toBeTruthy();
expect(vm.$el.querySelector('.fa-spin.fa-spinner').style.marginLeft).toEqual(`${file.level * 10}px`);
}); });
it('does not render if loading tree', () => { it('does not render if loading tree', () => {