Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
李少辉-开发者
gitlab-foss
提交
5a22b588
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,发现更多精彩内容 >>
提交
5a22b588
编写于
1月 25, 2018
作者:
E
Eric Eastwood
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Add createNewItemFromValue option and clearDropdown method
Part of
https://gitlab.com/gitlab-org/gitlab-ee/merge_requests/4110
上级
44728e05
变更
2
隐藏空白更改
内联
并排
Showing
2 changed file
with
139 addition
and
44 deletion
+139
-44
app/assets/javascripts/create_item_dropdown.js
app/assets/javascripts/create_item_dropdown.js
+31
-13
spec/javascripts/create_item_dropdown_spec.js
spec/javascripts/create_item_dropdown_spec.js
+108
-31
未找到文件。
app/assets/javascripts/create_item_dropdown.js
浏览文件 @
5a22b588
...
...
@@ -12,6 +12,7 @@ export default class CreateItemDropdown {
this
.
fieldName
=
options
.
fieldName
;
this
.
onSelect
=
options
.
onSelect
||
(()
=>
{});
this
.
getDataOption
=
options
.
getData
;
this
.
createNewItemFromValueOption
=
options
.
createNewItemFromValue
;
this
.
$dropdown
=
options
.
$dropdown
;
this
.
$dropdownContainer
=
this
.
$dropdown
.
parent
();
this
.
$dropdownFooter
=
this
.
$dropdownContainer
.
find
(
'
.dropdown-footer
'
);
...
...
@@ -30,15 +31,15 @@ export default class CreateItemDropdown {
filterable
:
true
,
remote
:
false
,
search
:
{
fields
:
[
'
t
itle
'
],
fields
:
[
'
t
ext
'
],
},
selectable
:
true
,
toggleLabel
(
selected
)
{
return
(
selected
&&
'
id
'
in
selected
)
?
selected
.
title
:
this
.
defaultToggleLabel
;
return
(
selected
&&
'
id
'
in
selected
)
?
_
.
escape
(
selected
.
title
)
:
this
.
defaultToggleLabel
;
},
fieldName
:
this
.
fieldName
,
text
(
item
)
{
return
_
.
escape
(
item
.
t
itle
);
return
_
.
escape
(
item
.
t
ext
);
},
id
(
item
)
{
return
_
.
escape
(
item
.
id
);
...
...
@@ -51,6 +52,11 @@ export default class CreateItemDropdown {
});
}
clearDropdown
()
{
this
.
$dropdownContainer
.
find
(
'
.dropdown-content
'
).
html
(
''
);
this
.
$dropdownContainer
.
find
(
'
.dropdown-input-field
'
).
val
(
''
);
}
bindEvents
()
{
this
.
$createButton
.
on
(
'
click
'
,
this
.
onClickCreateWildcard
.
bind
(
this
));
}
...
...
@@ -58,9 +64,13 @@ export default class CreateItemDropdown {
onClickCreateWildcard
(
e
)
{
e
.
preventDefault
();
this
.
refreshData
();
this
.
$dropdown
.
data
(
'
glDropdown
'
).
selectRowAtIndex
();
}
refreshData
()
{
// Refresh the dropdown's data, which ends up calling `getData`
this
.
$dropdown
.
data
(
'
glDropdown
'
).
remote
.
execute
();
this
.
$dropdown
.
data
(
'
glDropdown
'
).
selectRowAtIndex
();
}
getData
(
term
,
callback
)
{
...
...
@@ -79,20 +89,28 @@ export default class CreateItemDropdown {
});
}
toggleCreateNewButton
(
item
)
{
if
(
item
)
{
this
.
selectedItem
=
{
title
:
item
,
id
:
item
,
text
:
item
,
};
createNewItemFromValue
(
newValue
)
{
if
(
this
.
createNewItemFromValueOption
)
{
return
this
.
createNewItemFromValueOption
(
newValue
);
}
return
{
title
:
newValue
,
id
:
newValue
,
text
:
newValue
,
};
}
toggleCreateNewButton
(
newValue
)
{
if
(
newValue
)
{
this
.
selectedItem
=
this
.
createNewItemFromValue
(
newValue
);
this
.
$dropdownContainer
.
find
(
'
.js-dropdown-create-new-item code
'
)
.
text
(
item
);
.
text
(
newValue
);
}
this
.
toggleFooter
(
!
item
);
this
.
toggleFooter
(
!
newValue
);
}
toggleFooter
(
toggleState
)
{
...
...
spec/javascripts/create_item_dropdown_spec.js
浏览文件 @
5a22b588
...
...
@@ -18,54 +18,67 @@ describe('CreateItemDropdown', () => {
preloadFixtures
(
'
static/create_item_dropdown.html.raw
'
);
let
$wrapperEl
;
let
createItemDropdown
;
function
createItemAndClearInput
(
text
)
{
// Filter for the new item
$wrapperEl
.
find
(
'
.dropdown-input-field
'
)
.
val
(
text
)
.
trigger
(
'
input
'
);
// Create the new item
const
$createButton
=
$wrapperEl
.
find
(
'
.js-dropdown-create-new-item
'
);
$createButton
.
click
();
// Clear out the filter
$wrapperEl
.
find
(
'
.dropdown-input-field
'
)
.
val
(
''
)
.
trigger
(
'
input
'
);
}
beforeEach
(()
=>
{
loadFixtures
(
'
static/create_item_dropdown.html.raw
'
);
$wrapperEl
=
$
(
'
.js-create-item-dropdown-fixture-root
'
);
// eslint-disable-next-line no-new
new
CreateItemDropdown
({
$dropdown
:
$wrapperEl
.
find
(
'
.js-dropdown-menu-toggle
'
),
defaultToggleLabel
:
'
All variables
'
,
fieldName
:
'
variable[environment]
'
,
getData
:
(
term
,
callback
)
=>
{
callback
(
DROPDOWN_ITEM_DATA
);
},
});
});
afterEach
(()
=>
{
$wrapperEl
.
remove
();
});
it
(
'
should have a dropdown item for each piece of data
'
,
()
=>
{
// Get the data in the dropdown
$
(
'
.js-dropdown-menu-toggle
'
).
click
();
describe
(
'
items
'
,
()
=>
{
beforeEach
(()
=>
{
createItemDropdown
=
new
CreateItemDropdown
({
$dropdown
:
$wrapperEl
.
find
(
'
.js-dropdown-menu-toggle
'
),
defaultToggleLabel
:
'
All variables
'
,
fieldName
:
'
variable[environment]
'
,
getData
:
(
term
,
callback
)
=>
{
callback
(
DROPDOWN_ITEM_DATA
);
},
});
});
it
(
'
should have a dropdown item for each piece of data
'
,
()
=>
{
// Get the data in the dropdown
$
(
'
.js-dropdown-menu-toggle
'
).
click
();
const
$itemEls
=
$wrapperEl
.
find
(
'
.js-dropdown-content a
'
);
expect
(
$itemEls
.
length
).
toEqual
(
DROPDOWN_ITEM_DATA
.
length
);
const
$itemEls
=
$wrapperEl
.
find
(
'
.js-dropdown-content a
'
);
expect
(
$itemEls
.
length
).
toEqual
(
DROPDOWN_ITEM_DATA
.
length
);
});
});
describe
(
'
created items
'
,
()
=>
{
const
NEW_ITEM_TEXT
=
'
foobarbaz
'
;
function
createItemAndClearInput
(
text
)
{
// Filter for the new item
$wrapperEl
.
find
(
'
.dropdown-input-field
'
)
.
val
(
text
)
.
trigger
(
'
input
'
);
// Create the new item
const
$createButton
=
$wrapperEl
.
find
(
'
.js-dropdown-create-new-item
'
);
$createButton
.
click
();
// Clear out the filter
$wrapperEl
.
find
(
'
.dropdown-input-field
'
)
.
val
(
''
)
.
trigger
(
'
input
'
);
}
beforeEach
(()
=>
{
createItemDropdown
=
new
CreateItemDropdown
({
$dropdown
:
$wrapperEl
.
find
(
'
.js-dropdown-menu-toggle
'
),
defaultToggleLabel
:
'
All variables
'
,
fieldName
:
'
variable[environment]
'
,
getData
:
(
term
,
callback
)
=>
{
callback
(
DROPDOWN_ITEM_DATA
);
},
});
// Open the dropdown
$
(
'
.js-dropdown-menu-toggle
'
).
click
();
...
...
@@ -103,4 +116,68 @@ describe('CreateItemDropdown', () => {
expect
(
$itemEls
.
length
).
toEqual
(
DROPDOWN_ITEM_DATA
.
length
);
});
});
describe
(
'
clearDropdown()
'
,
()
=>
{
beforeEach
(()
=>
{
createItemDropdown
=
new
CreateItemDropdown
({
$dropdown
:
$wrapperEl
.
find
(
'
.js-dropdown-menu-toggle
'
),
defaultToggleLabel
:
'
All variables
'
,
fieldName
:
'
variable[environment]
'
,
getData
:
(
term
,
callback
)
=>
{
callback
(
DROPDOWN_ITEM_DATA
);
},
});
});
it
(
'
should clear all data and filter input
'
,
()
=>
{
const
filterInput
=
$wrapperEl
.
find
(
'
.dropdown-input-field
'
);
// Get the data in the dropdown
$
(
'
.js-dropdown-menu-toggle
'
).
click
();
// Filter for an item
filterInput
.
val
(
'
one
'
)
.
trigger
(
'
input
'
);
const
$itemElsAfterFilter
=
$wrapperEl
.
find
(
'
.js-dropdown-content a
'
);
expect
(
$itemElsAfterFilter
.
length
).
toEqual
(
1
);
createItemDropdown
.
clearDropdown
();
const
$itemElsAfterClear
=
$wrapperEl
.
find
(
'
.js-dropdown-content a
'
);
expect
(
$itemElsAfterClear
.
length
).
toEqual
(
0
);
expect
(
filterInput
.
val
()).
toEqual
(
''
);
});
});
describe
(
'
createNewItemFromValue option
'
,
()
=>
{
beforeEach
(()
=>
{
createItemDropdown
=
new
CreateItemDropdown
({
$dropdown
:
$wrapperEl
.
find
(
'
.js-dropdown-menu-toggle
'
),
defaultToggleLabel
:
'
All variables
'
,
fieldName
:
'
variable[environment]
'
,
getData
:
(
term
,
callback
)
=>
{
callback
(
DROPDOWN_ITEM_DATA
);
},
createNewItemFromValue
:
newValue
=>
({
title
:
`
${
newValue
}
-title`
,
id
:
`
${
newValue
}
-id`
,
text
:
`
${
newValue
}
-text`
,
}),
});
});
it
(
'
all items go through createNewItemFromValue
'
,
()
=>
{
// Get the data in the dropdown
$
(
'
.js-dropdown-menu-toggle
'
).
click
();
createItemAndClearInput
(
'
new-item
'
);
const
$itemEls
=
$wrapperEl
.
find
(
'
.js-dropdown-content a
'
);
expect
(
$itemEls
.
length
).
toEqual
(
1
+
DROPDOWN_ITEM_DATA
.
length
);
expect
(
$
(
$itemEls
[
3
]).
text
()).
toEqual
(
'
new-item-text
'
);
expect
(
$wrapperEl
.
find
(
'
.dropdown-toggle-text
'
).
text
()).
toEqual
(
'
new-item-title
'
);
});
});
});
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录