Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
李少辉-开发者
gitlab-foss
提交
7a2f1073
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,发现更多精彩内容 >>
提交
7a2f1073
编写于
12月 22, 2017
作者:
K
Kushal Pandya
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
ItemStatsValue Component
上级
c2951f6f
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
148 addition
and
0 deletion
+148
-0
app/assets/javascripts/groups/components/item_stats_value.vue
...assets/javascripts/groups/components/item_stats_value.vue
+67
-0
spec/javascripts/groups/components/item_stats_value_spec.js
spec/javascripts/groups/components/item_stats_value_spec.js
+81
-0
未找到文件。
app/assets/javascripts/groups/components/item_stats_value.vue
0 → 100644
浏览文件 @
7a2f1073
<
script
>
import
tooltip
from
'
~/vue_shared/directives/tooltip
'
;
import
icon
from
'
~/vue_shared/components/icon.vue
'
;
export
default
{
props
:
{
title
:
{
type
:
String
,
required
:
true
,
},
cssClass
:
{
type
:
String
,
required
:
false
,
default
:
''
,
},
iconName
:
{
type
:
String
,
required
:
true
,
},
tooltipPlacement
:
{
type
:
String
,
required
:
false
,
default
:
'
top
'
,
},
/**
* value could either be number or string
* as `memberCount` is always passed as string
* while `subgroupCount` & `projectCount`
* are always number
*/
value
:
{
type
:
[
Number
,
String
],
required
:
false
,
default
:
''
,
},
},
directives
:
{
tooltip
,
},
components
:
{
icon
,
},
computed
:
{
isValuePresent
()
{
return
this
.
value
!==
''
;
},
},
};
</
script
>
<
template
>
<span
v-tooltip
data-container=
"body"
:data-placement=
"tooltipPlacement"
:class=
"cssClass"
:title=
"title"
>
<icon
:name=
"iconName"
/>
<span
v-if=
"isValuePresent"
class=
"stat-value"
>
{{
value
}}
</span>
</span>
</
template
>
spec/javascripts/groups/components/item_stats_value_spec.js
0 → 100644
浏览文件 @
7a2f1073
import
Vue
from
'
vue
'
;
import
itemStatsValueComponent
from
'
~/groups/components/item_stats_value.vue
'
;
import
mountComponent
from
'
../../helpers/vue_mount_component_helper
'
;
const
createComponent
=
({
title
,
cssClass
,
iconName
,
tooltipPlacement
,
value
})
=>
{
const
Component
=
Vue
.
extend
(
itemStatsValueComponent
);
return
mountComponent
(
Component
,
{
title
,
cssClass
,
iconName
,
tooltipPlacement
,
value
,
});
};
describe
(
'
ItemStatsValueComponent
'
,
()
=>
{
describe
(
'
computed
'
,
()
=>
{
let
vm
;
const
itemConfig
=
{
title
:
'
Subgroups
'
,
cssClass
:
'
number-subgroups
'
,
iconName
:
'
folder
'
,
tooltipPlacement
:
'
left
'
,
};
describe
(
'
isValuePresent
'
,
()
=>
{
it
(
'
returns true if non-empty `value` is present
'
,
()
=>
{
vm
=
createComponent
(
Object
.
assign
({},
itemConfig
,
{
value
:
10
}));
expect
(
vm
.
isValuePresent
).
toBeTruthy
();
});
it
(
'
returns false if empty `value` is present
'
,
()
=>
{
vm
=
createComponent
(
itemConfig
);
expect
(
vm
.
isValuePresent
).
toBeFalsy
();
});
afterEach
(()
=>
{
vm
.
$destroy
();
});
});
});
describe
(
'
template
'
,
()
=>
{
let
vm
;
beforeEach
(()
=>
{
vm
=
createComponent
({
title
:
'
Subgroups
'
,
cssClass
:
'
number-subgroups
'
,
iconName
:
'
folder
'
,
tooltipPlacement
:
'
left
'
,
value
:
10
,
});
});
it
(
'
renders component element correctly
'
,
()
=>
{
expect
(
vm
.
$el
.
classList
.
contains
(
'
number-subgroups
'
)).
toBeTruthy
();
expect
(
vm
.
$el
.
querySelectorAll
(
'
svg
'
).
length
>
0
).
toBeTruthy
();
expect
(
vm
.
$el
.
querySelectorAll
(
'
.stat-value
'
).
length
>
0
).
toBeTruthy
();
});
it
(
'
renders element tooltip correctly
'
,
()
=>
{
expect
(
vm
.
$el
.
dataset
.
originalTitle
).
toBe
(
'
Subgroups
'
);
expect
(
vm
.
$el
.
dataset
.
placement
).
toBe
(
'
left
'
);
});
it
(
'
renders element icon correctly
'
,
()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'
svg use
'
).
getAttribute
(
'
xlink:href
'
)).
toContain
(
'
folder
'
);
});
it
(
'
renders value count correctly
'
,
()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'
.stat-value
'
).
innerText
.
trim
()).
toContain
(
'
10
'
);
});
afterEach
(()
=>
{
vm
.
$destroy
();
});
});
});
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录