Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
李少辉-开发者
gitlab-foss
提交
3369232c
G
gitlab-foss
项目概览
李少辉-开发者
/
gitlab-foss
通知
15
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
G
gitlab-foss
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
3369232c
编写于
3月 28, 2017
作者:
P
Phil Hughes
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Added specs for board list component
上级
4917df5e
变更
3
显示空白变更内容
内联
并排
Showing
3 changed file
with
210 addition
and
6 deletion
+210
-6
app/assets/javascripts/boards/components/board.js
app/assets/javascripts/boards/components/board.js
+1
-2
app/assets/javascripts/boards/components/board_list.js
app/assets/javascripts/boards/components/board_list.js
+8
-4
spec/javascripts/boards/board_list_spec.js
spec/javascripts/boards/board_list_spec.js
+201
-0
未找到文件。
app/assets/javascripts/boards/components/board.js
浏览文件 @
3369232c
/* eslint-disable comma-dangle, space-before-function-paren, one-var */
/* eslint-disable comma-dangle, space-before-function-paren, one-var */
/* global Sortable */
/* global Sortable */
import
boardList
from
'
./board_list
'
;
import
Vue
from
'
vue
'
;
import
Vue
from
'
vue
'
;
import
boardList
from
'
./board_list
'
;
import
boardBlankState
from
'
./board_blank_state
'
;
import
boardBlankState
from
'
./board_blank_state
'
;
require
(
'
./board_delete
'
);
require
(
'
./board_delete
'
);
...
...
app/assets/javascripts/boards/components/board_list.js
浏览文件 @
3369232c
/* global Sortable */
/* global Sortable */
import
Vue
from
'
vue
'
;
import
boardNewIssue
from
'
./board_new_issue
'
;
import
boardNewIssue
from
'
./board_new_issue
'
;
import
boardCard
from
'
./board_card
'
;
import
boardCard
from
'
./board_card
'
;
import
eventHub
from
'
../eventhub
'
;
import
eventHub
from
'
../eventhub
'
;
...
@@ -12,8 +10,12 @@ export default {
...
@@ -12,8 +10,12 @@ export default {
<div class="board-list-component">
<div class="board-list-component">
<div
<div
class="board-list-loading text-center"
class="board-list-loading text-center"
aria-label="Loading issues"
v-if="loading">
v-if="loading">
<i class="fa fa-spinner fa-spin"></i>
<i
class="fa fa-spinner fa-spin"
aria-hidden="true">
</i>
</div>
</div>
<board-new-issue
<board-new-issue
:list="list"
:list="list"
...
@@ -40,10 +42,12 @@ export default {
...
@@ -40,10 +42,12 @@ export default {
data-id="-1">
data-id="-1">
<i
<i
class="fa fa-spinner fa-spin"
class="fa fa-spinner fa-spin"
aria-label="Loading more issues"
aria-hidden="true"
v-show="list.loadingMore">
v-show="list.loadingMore">
</i>
</i>
<span v-if="list.issues.length === list.issuesSize">
<span v-if="list.issues.length === list.issuesSize">
Show all issues
Show
ing
all issues
</span>
</span>
<span v-else>
<span v-else>
Showing {{ list.issues.length }} of {{ list.issuesSize }} issues
Showing {{ list.issues.length }} of {{ list.issuesSize }} issues
...
...
spec/javascripts/boards/board_list_spec.js
0 → 100644
浏览文件 @
3369232c
/* global BoardService */
/* global boardsMockInterceptor */
/* global List */
/* global listObj */
/* global ListIssue */
import
Vue
from
'
vue
'
;
import
_
from
'
underscore
'
;
import
Sortable
from
'
vendor/Sortable
'
;
import
BoardList
from
'
~/boards/components/board_list
'
;
import
eventHub
from
'
~/boards/eventhub
'
;
import
'
~/boards/mixins/sortable_default_options
'
;
import
'
~/boards/models/issue
'
;
import
'
~/boards/models/list
'
;
import
'
~/boards/stores/boards_store
'
;
import
'
./mock_data
'
;
window
.
Sortable
=
Sortable
;
describe
(
'
Board list component
'
,
()
=>
{
let
component
;
beforeEach
((
done
)
=>
{
const
el
=
document
.
createElement
(
'
div
'
);
document
.
body
.
appendChild
(
el
);
Vue
.
http
.
interceptors
.
push
(
boardsMockInterceptor
);
gl
.
boardService
=
new
BoardService
(
'
/test/issue-boards/board
'
,
''
,
'
1
'
);
gl
.
issueBoards
.
BoardsStore
.
create
();
gl
.
IssueBoardsApp
=
new
Vue
();
const
BoardListComp
=
Vue
.
extend
(
BoardList
);
const
list
=
new
List
(
listObj
);
const
issue
=
new
ListIssue
({
title
:
'
Testing
'
,
iid
:
1
,
confidential
:
false
,
labels
:
[],
});
list
.
issuesSize
=
1
;
list
.
issues
.
push
(
issue
);
component
=
new
BoardListComp
({
el
,
propsData
:
{
disabled
:
false
,
list
,
issues
:
list
.
issues
,
loading
:
false
,
issueLinkBase
:
'
/issues
'
,
rootPath
:
'
/
'
,
},
}).
$mount
();
Vue
.
nextTick
(()
=>
{
done
();
});
});
afterEach
(()
=>
{
Vue
.
http
.
interceptors
=
_
.
without
(
Vue
.
http
.
interceptors
,
boardsMockInterceptor
);
});
it
(
'
renders component
'
,
()
=>
{
expect
(
component
.
$el
.
classList
.
contains
(
'
board-list-component
'
),
).
toBe
(
true
);
});
it
(
'
renders loading icon
'
,
(
done
)
=>
{
component
.
loading
=
true
;
Vue
.
nextTick
(()
=>
{
expect
(
component
.
$el
.
querySelector
(
'
.board-list-loading
'
),
).
not
.
toBeNull
();
done
();
});
});
it
(
'
renders issues
'
,
()
=>
{
expect
(
component
.
$el
.
querySelectorAll
(
'
.card
'
).
length
,
).
toBe
(
1
);
});
it
(
'
sets data attribute with issue id
'
,
()
=>
{
expect
(
component
.
$el
.
querySelector
(
'
.card
'
).
getAttribute
(
'
data-issue-id
'
),
).
toBe
(
'
1
'
);
});
it
(
'
shows new issue form
'
,
(
done
)
=>
{
component
.
toggleForm
();
Vue
.
nextTick
(()
=>
{
expect
(
component
.
$el
.
querySelector
(
'
.board-new-issue-form
'
),
).
not
.
toBeNull
();
expect
(
component
.
$el
.
querySelector
(
'
.is-smaller
'
),
).
not
.
toBeNull
();
done
();
});
});
it
(
'
shows new issue form after eventhub event
'
,
(
done
)
=>
{
eventHub
.
$emit
(
`hide-issue-form-
${
component
.
list
.
id
}
`
);
Vue
.
nextTick
(()
=>
{
expect
(
component
.
$el
.
querySelector
(
'
.board-new-issue-form
'
),
).
not
.
toBeNull
();
expect
(
component
.
$el
.
querySelector
(
'
.is-smaller
'
),
).
not
.
toBeNull
();
done
();
});
});
it
(
'
does not show new issue form for closed list
'
,
(
done
)
=>
{
component
.
list
.
type
=
'
closed
'
;
component
.
toggleForm
();
Vue
.
nextTick
(()
=>
{
expect
(
component
.
$el
.
querySelector
(
'
.board-new-issue-form
'
),
).
toBeNull
();
done
();
});
});
it
(
'
shows count list item
'
,
(
done
)
=>
{
component
.
showCount
=
true
;
Vue
.
nextTick
(()
=>
{
expect
(
component
.
$el
.
querySelector
(
'
.board-list-count
'
),
).
not
.
toBeNull
();
expect
(
component
.
$el
.
querySelector
(
'
.board-list-count
'
).
textContent
.
trim
(),
).
toBe
(
'
Showing all issues
'
);
done
();
});
});
it
(
'
shows how many more issues to load
'
,
(
done
)
=>
{
component
.
showCount
=
true
;
component
.
list
.
issuesSize
=
20
;
Vue
.
nextTick
(()
=>
{
expect
(
component
.
$el
.
querySelector
(
'
.board-list-count
'
).
textContent
.
trim
(),
).
toBe
(
'
Showing 1 of 20 issues
'
);
done
();
});
});
it
(
'
loads more issues after scrolling
'
,
(
done
)
=>
{
spyOn
(
component
.
list
,
'
nextPage
'
);
component
.
$refs
.
list
.
style
.
height
=
'
100px
'
;
component
.
$refs
.
list
.
style
.
overflow
=
'
scroll
'
;
for
(
let
i
=
0
;
i
<
19
;
i
+=
1
)
{
const
issue
=
component
.
list
.
issues
[
0
];
issue
.
id
+=
1
;
component
.
list
.
issues
.
push
(
issue
);
}
Vue
.
nextTick
(()
=>
{
component
.
$refs
.
list
.
scrollTop
=
20000
;
setTimeout
(()
=>
{
expect
(
component
.
list
.
nextPage
).
toHaveBeenCalled
();
done
();
});
});
});
it
(
'
shows loading more spinner
'
,
(
done
)
=>
{
component
.
showCount
=
true
;
component
.
list
.
loadingMore
=
true
;
Vue
.
nextTick
(()
=>
{
expect
(
component
.
$el
.
querySelector
(
'
.board-list-count .fa-spinner
'
),
).
not
.
toBeNull
();
done
();
});
});
});
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录