BigW Consortium Gitlab
Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
G
gitlab-ce
Project
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
Registry
Registry
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Commits
Issue Boards
Open sidebar
Forest Godfrey
gitlab-ce
Commits
4376be84
Commit
4376be84
authored
Jan 26, 2018
by
Phil Hughes
Browse files
Options
Browse Files
Download
Plain Diff
Merge branch 'fl-mr-widget-components' into 'master'
Moves components into vue files: See merge request gitlab-org/gitlab-ce!16719
parents
a0d57ee2
1e897804
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
336 additions
and
334 deletions
+336
-334
mr_widget_failed_to_merge.vue
...st_widget/components/states/mr_widget_failed_to_merge.vue
+99
-72
mr_widget_merge_when_pipeline_succeeds.vue
...ponents/states/mr_widget_merge_when_pipeline_succeeds.vue
+132
-109
dependencies.js
...sets/javascripts/vue_merge_request_widget/dependencies.js
+2
-2
mr_widget_failed_to_merge_spec.js
...idget/components/states/mr_widget_failed_to_merge_spec.js
+59
-64
mr_widget_merge_when_pipeline_succeeds_spec.js
...nts/states/mr_widget_merge_when_pipeline_succeeds_spec.js
+44
-87
No files found.
app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_failed_to_merge.
js
→
app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_failed_to_merge.
vue
View file @
4376be84
import
statusIcon
from
'../mr_widget_status_icon.vue'
;
import
eventHub
from
'../../event_hub'
;
<
script
>
import
{
n__
}
from
'~/locale'
;
import
statusIcon
from
'../mr_widget_status_icon.vue'
;
import
eventHub
from
'../../event_hub'
;
export
default
{
name
:
'MRWidgetFailedToMerge'
,
props
:
{
mr
:
{
type
:
Object
,
required
:
true
},
},
data
()
{
return
{
timer
:
10
,
isRefreshing
:
false
,
};
},
mounted
()
{
setInterval
(()
=>
{
this
.
updateTimer
();
},
1000
);
},
created
()
{
eventHub
.
$emit
(
'DisablePolling'
);
},
computed
:
{
timerText
()
{
return
this
.
timer
>
1
?
`
${
this
.
timer
}
seconds`
:
'a second'
;
export
default
{
name
:
'MRWidgetFailedToMerge'
,
components
:
{
statusIcon
,
},
},
methods
:
{
refresh
()
{
this
.
isRefreshing
=
true
;
eventHub
.
$emit
(
'MRWidgetUpdateRequested'
);
eventHub
.
$emit
(
'EnablePolling'
);
props
:
{
mr
:
{
type
:
Object
,
required
:
true
,
default
:
()
=>
({}),
},
},
updateTimer
()
{
this
.
timer
=
this
.
timer
-
1
;
if
(
this
.
timer
===
0
)
{
this
.
refresh
();
}
data
()
{
return
{
timer
:
10
,
isRefreshing
:
false
,
};
},
},
components
:
{
statusIcon
,
},
template
:
`
<div class="mr-widget-body media">
<template v-if="isRefreshing">
<status-icon status="loading" />
<span class="media-body bold js-refresh-label">
Refreshing now
</span>
</template>
<template v-else>
<status-icon status="warning" :show-disabled-button="true" />
<div class="media-body space-children">
<span class="bold">
<span
class="has-error-message"
v-if="mr.mergeError">
{{mr.mergeError}}.
</span>
<span v-else>Merge failed.</span>
<span
:class="{ 'has-custom-error': mr.mergeError }">
Refreshing in {{timerText}} to show the updated status...
</span>
computed
:
{
timerText
()
{
return
n__
(
'Refreshing in a second to show the updated status...'
,
'Refreshing in %d seconds to show the updated status...'
,
this
.
timer
,
);
},
},
mounted
()
{
setInterval
(()
=>
{
this
.
updateTimer
();
},
1000
);
},
created
()
{
eventHub
.
$emit
(
'DisablePolling'
);
},
methods
:
{
refresh
()
{
this
.
isRefreshing
=
true
;
eventHub
.
$emit
(
'MRWidgetUpdateRequested'
);
eventHub
.
$emit
(
'EnablePolling'
);
},
updateTimer
()
{
this
.
timer
=
this
.
timer
-
1
;
if
(
this
.
timer
===
0
)
{
this
.
refresh
();
}
},
},
};
</
script
>
<
template
>
<div
class=
"mr-widget-body media"
>
<template
v-if=
"isRefreshing"
>
<status-icon
status=
"loading"
/>
<span
class=
"media-body bold js-refresh-label"
>
{{
s__
(
"mrWidget|Refreshing now"
)
}}
</span>
</
template
>
<
template
v-else
>
<status-icon
status=
"warning"
:show-disabled-button=
"true"
/>
<div
class=
"media-body space-children"
>
<span
class=
"bold"
>
<span
class=
"has-error-message"
v-if=
"mr.mergeError"
>
{{
mr
.
mergeError
}}
.
</span>
<span
v-else
>
{{
s__
(
"mrWidget|Merge failed."
)
}}
</span>
<button
@click="refresh"
class="btn btn-default btn-xs js-refresh-button"
type="button">
Refresh now
</button>
</div>
</template>
</div>
`
,
};
<span
:class=
"
{ 'has-custom-error': mr.mergeError }"
>
{{
timerText
}}
</span>
</span>
<button
@
click=
"refresh"
class=
"btn btn-default btn-xs js-refresh-button"
type=
"button"
>
{{
s__
(
"mrWidget|Refresh now"
)
}}
</button>
</div>
</
template
>
</div>
</template>
app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.
js
→
app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds.
vue
View file @
4376be84
import
Flash
from
'../../../flash'
;
import
statusIcon
from
'../mr_widget_status_icon.vue'
;
import
MRWidgetAuthor
from
'../../components/mr_widget_author'
;
import
eventHub
from
'../../event_hub'
;
<
script
>
import
Flash
from
'../../../flash'
;
import
statusIcon
from
'../mr_widget_status_icon.vue'
;
import
mrWidgetAuthor
from
'../../components/mr_widget_author'
;
import
eventHub
from
'../../event_hub'
;
export
default
{
name
:
'MRWidgetMergeWhenPipelineSucceeds'
,
props
:
{
mr
:
{
type
:
Object
,
required
:
true
},
service
:
{
type
:
Object
,
required
:
true
},
},
components
:
{
'mr-widget-author'
:
MRWidgetAuthor
,
statusIcon
,
},
data
()
{
return
{
isCancellingAutoMerge
:
false
,
isRemovingSourceBranch
:
false
,
};
},
computed
:
{
canRemoveSourceBranch
()
{
const
{
shouldRemoveSourceBranch
,
canRemoveSourceBranch
,
mergeUserId
,
currentUserId
}
=
this
.
mr
;
return
!
shouldRemoveSourceBranch
&&
canRemoveSourceBranch
&&
mergeUserId
===
currentUserId
;
export
default
{
name
:
'MRWidgetMergeWhenPipelineSucceeds'
,
components
:
{
mrWidgetAuthor
,
statusIcon
,
},
},
methods
:
{
cancelAutomaticMerge
()
{
this
.
isCancellingAutoMerge
=
true
;
this
.
service
.
cancelAutomaticMerge
()
.
then
(
res
=>
res
.
data
)
.
then
((
data
)
=>
{
eventHub
.
$emit
(
'UpdateWidgetData'
,
data
);
})
.
catch
(()
=>
{
this
.
isCancellingAutoMerge
=
false
;
new
Flash
(
'Something went wrong. Please try again.'
);
// eslint-disable-line
});
props
:
{
mr
:
{
type
:
Object
,
required
:
true
,
default
:
()
=>
({}),
},
service
:
{
type
:
Object
,
required
:
true
,
default
:
()
=>
({}),
},
},
removeSourceBranch
()
{
const
options
=
{
sha
:
this
.
mr
.
sha
,
merge_when_pipeline_succeeds
:
true
,
should_remove_source_branch
:
true
,
data
()
{
return
{
isCancellingAutoMerge
:
false
,
isRemovingSourceBranch
:
false
,
};
},
computed
:
{
canRemoveSourceBranch
()
{
const
{
shouldRemoveSourceBranch
,
canRemoveSourceBranch
,
mergeUserId
,
currentUserId
,
}
=
this
.
mr
;
return
!
shouldRemoveSourceBranch
&&
canRemoveSourceBranch
&&
mergeUserId
===
currentUserId
;
},
},
methods
:
{
cancelAutomaticMerge
()
{
this
.
isCancellingAutoMerge
=
true
;
this
.
service
.
cancelAutomaticMerge
()
.
then
(
res
=>
res
.
data
)
.
then
((
data
)
=>
{
eventHub
.
$emit
(
'UpdateWidgetData'
,
data
);
})
.
catch
(()
=>
{
this
.
isCancellingAutoMerge
=
false
;
Flash
(
'Something went wrong. Please try again.'
);
});
},
removeSourceBranch
()
{
const
options
=
{
sha
:
this
.
mr
.
sha
,
merge_when_pipeline_succeeds
:
true
,
should_remove_source_branch
:
true
,
};
this
.
isRemovingSourceBranch
=
true
;
this
.
service
.
mergeResource
.
save
(
options
)
.
then
(
res
=>
res
.
data
)
.
then
((
data
)
=>
{
if
(
data
.
status
===
'merge_when_pipeline_succeeds'
)
{
eventHub
.
$emit
(
'MRWidgetUpdateRequested'
);
}
})
.
catch
(()
=>
{
this
.
isRemovingSourceBranch
=
false
;
new
Flash
(
'Something went wrong. Please try again.'
);
// eslint-disable-line
});
this
.
isRemovingSourceBranch
=
true
;
this
.
service
.
mergeResource
.
save
(
options
)
.
then
(
res
=>
res
.
data
)
.
then
((
data
)
=>
{
if
(
data
.
status
===
'merge_when_pipeline_succeeds'
)
{
eventHub
.
$emit
(
'MRWidgetUpdateRequested'
);
}
})
.
catch
(()
=>
{
this
.
isRemovingSourceBranch
=
false
;
Flash
(
'Something went wrong. Please try again.'
);
});
},
},
},
template
:
`
<div class="mr-widget-body media">
<status-icon status="success" />
<div class="media-body">
<h4 class="flex-container-block">
};
</
script
>
<
template
>
<div
class=
"mr-widget-body media"
>
<status-icon
status=
"success"
/>
<div
class=
"media-body"
>
<h4
class=
"flex-container-block"
>
<span
class=
"append-right-10"
>
{{
s__
(
"mrWidget|Set by"
)
}}
<mr-widget-author
:author=
"mr.setToMWPSBy"
/>
{{
s__
(
"mrWidget|to be merged automatically when the pipeline succeeds"
)
}}
</span>
<a
v-if=
"mr.canCancelAutomaticMerge"
@
click
.
prevent=
"cancelAutomaticMerge"
:disabled=
"isCancellingAutoMerge"
role=
"button"
href=
"#"
class=
"btn btn-xs btn-default js-cancel-auto-merge"
>
<i
v-if=
"isCancellingAutoMerge"
class=
"fa fa-spinner fa-spin"
aria-hidden=
"true"
>
</i>
{{
s__
(
"mrWidget|Cancel automatic merge"
)
}}
</a>
</h4>
<section
class=
"mr-info-list"
>
<p>
{{
s__
(
"mrWidget|The changes will be merged into"
)
}}
<a
:href=
"mr.targetBranchPath"
class=
"label-branch"
>
{{
mr
.
targetBranch
}}
</a>
</p>
<p
v-if=
"mr.shouldRemoveSourceBranch"
>
{{
s__
(
"mrWidget|The source branch will be removed"
)
}}
</p>
<p
v-else
class=
"flex-container-block"
>
<span
class=
"append-right-10"
>
Set by
<mr-widget-author :author="mr.setToMWPSBy" />
to be merged automatically when the pipeline succeeds
{{
s__
(
"mrWidget|The source branch will not be removed"
)
}}
</span>
<a
v-if="
mr.canCancelAutomaticMerge
"
@click.prevent="cancelAutomaticMerge
"
:disabled="isCancellingAutoMerge
"
v-if=
"
canRemoveSourceBranch
"
:disabled=
"isRemovingSourceBranch
"
@
click
.
prevent=
"removeSourceBranch
"
role=
"button"
class=
"btn btn-xs btn-default js-remove-source-branch"
href=
"#"
class="btn btn-xs btn-default js-cancel-auto-merge">
<i
v-if="isCancellingAutoMerge"
class="fa fa-spinner fa-spin"
aria-hidden="true" />
Cancel automatic merge
</a>
</h4>
<section class="mr-info-list">
<p>The changes will be merged into
<a
:href="mr.targetBranchPath"
class="label-branch">
{{mr.targetBranch}}
</a>
</p>
<p v-if="mr.shouldRemoveSourceBranch">
The source branch will be removed
</p>
<p
v-else
class="flex-container-block"
>
<span class="append-right-10">
The source branch will not be removed
</span>
<a
v-if="canRemoveSourceBranch"
:disabled="isRemovingSourceBranch"
@click.prevent="removeSourceBranch"
role="button"
class="btn btn-xs btn-default js-remove-source-branch"
href="#">
<i
<i
v-if=
"isRemovingSourceBranch"
class=
"fa fa-spinner fa-spin"
aria-hidden="true" />
Remove source branch
</a>
</p>
</section>
</div>
aria-hidden=
"true"
>
</i>
{{
s__
(
"mrWidget|Remove source branch"
)
}}
</a>
</p>
</section>
</div>
`
,
};
</div>
</
template
>
app/assets/javascripts/vue_merge_request_widget/dependencies.js
View file @
4376be84
...
...
@@ -17,7 +17,7 @@ export { default as WidgetPipeline } from './components/mr_widget_pipeline.vue';
export
{
default
as
WidgetDeployment
}
from
'./components/mr_widget_deployment'
;
export
{
default
as
WidgetRelatedLinks
}
from
'./components/mr_widget_related_links'
;
export
{
default
as
MergedState
}
from
'./components/states/mr_widget_merged'
;
export
{
default
as
FailedToMerge
}
from
'./components/states/mr_widget_failed_to_merge'
;
export
{
default
as
FailedToMerge
}
from
'./components/states/mr_widget_failed_to_merge
.vue
'
;
export
{
default
as
ClosedState
}
from
'./components/states/mr_widget_closed.vue'
;
export
{
default
as
MergingState
}
from
'./components/states/mr_widget_merging.vue'
;
export
{
default
as
WipState
}
from
'./components/states/mr_widget_wip'
;
...
...
@@ -31,7 +31,7 @@ export { default as SHAMismatchState } from './components/states/mr_widget_sha_m
export
{
default
as
UnresolvedDiscussionsState
}
from
'./components/states/mr_widget_unresolved_discussions'
;
export
{
default
as
PipelineBlockedState
}
from
'./components/states/mr_widget_pipeline_blocked'
;
export
{
default
as
PipelineFailedState
}
from
'./components/states/mr_widget_pipeline_failed'
;
export
{
default
as
MergeWhenPipelineSucceedsState
}
from
'./components/states/mr_widget_merge_when_pipeline_succeeds'
;
export
{
default
as
MergeWhenPipelineSucceedsState
}
from
'./components/states/mr_widget_merge_when_pipeline_succeeds
.vue
'
;
export
{
default
as
RebaseState
}
from
'./components/states/mr_widget_rebase.vue'
;
export
{
default
as
AutoMergeFailed
}
from
'./components/states/mr_widget_auto_merge_failed.vue'
;
export
{
default
as
CheckingState
}
from
'./components/states/mr_widget_checking.vue'
;
...
...
spec/javascripts/vue_mr_widget/components/states/mr_widget_failed_to_merge_spec.js
View file @
4376be84
import
Vue
from
'vue'
;
import
failedToMergeComponent
from
'~/vue_merge_request_widget/components/states/mr_widget_failed_to_merge'
;
import
failedToMergeComponent
from
'~/vue_merge_request_widget/components/states/mr_widget_failed_to_merge
.vue
'
;
import
eventHub
from
'~/vue_merge_request_widget/event_hub'
;
const
mr
=
{
mergeError
:
'Merge error happened.'
,
};
const
createComponent
=
()
=>
{
const
Component
=
Vue
.
extend
(
failedToMergeComponent
);
return
new
Component
({
el
:
document
.
createElement
(
'div'
),
propsData
:
{
mr
},
});
};
import
mountComponent
from
'../../../helpers/vue_mount_component_helper'
;
describe
(
'MRWidgetFailedToMerge'
,
()
=>
{
describe
(
'data'
,
()
=>
{
it
(
'should have default data'
,
()
=>
{
const
data
=
failedToMergeComponent
.
data
();
let
Component
;
let
vm
;
beforeEach
(()
=>
{
Component
=
Vue
.
extend
(
failedToMergeComponent
);
spyOn
(
eventHub
,
'$emit'
);
vm
=
mountComponent
(
Component
,
{
mr
:
{
mergeError
:
'Merge error happened.'
,
}
});
});
expect
(
data
.
timer
).
toEqual
(
10
);
expect
(
data
.
isRefreshing
).
toBeFalsy
();
});
afterEach
(()
=>
{
vm
.
$destroy
();
});
describe
(
'computed'
,
()
=>
{
describe
(
'timerText'
,
()
=>
{
it
(
'should return correct timer text'
,
()
=>
{
const
vm
=
createComponent
();
expect
(
vm
.
timerText
).
toEqual
(
'10 seconds'
);
expect
(
vm
.
timerText
).
toEqual
(
'Refreshing in 10 seconds to show the updated status...'
);
vm
.
timer
=
1
;
expect
(
vm
.
timerText
).
toEqual
(
'
a second
'
);
expect
(
vm
.
timerText
).
toEqual
(
'
Refreshing in a second to show the updated status...
'
);
});
});
});
describe
(
'created'
,
()
=>
{
it
(
'should disable polling'
,
()
=>
{
spyOn
(
eventHub
,
'$emit'
);
createComponent
();
expect
(
eventHub
.
$emit
).
toHaveBeenCalledWith
(
'DisablePolling'
);
});
});
...
...
@@ -47,13 +39,10 @@ describe('MRWidgetFailedToMerge', () => {
describe
(
'methods'
,
()
=>
{
describe
(
'refresh'
,
()
=>
{
it
(
'should emit event to request component refresh'
,
()
=>
{
spyOn
(
eventHub
,
'$emit'
);
const
vm
=
createComponent
();
expect
(
vm
.
isRefreshing
).
toBeFalsy
();
expect
(
vm
.
isRefreshing
).
toEqual
(
false
);
vm
.
refresh
();
expect
(
vm
.
isRefreshing
).
to
BeTruthy
(
);
expect
(
vm
.
isRefreshing
).
to
Equal
(
true
);
expect
(
eventHub
.
$emit
).
toHaveBeenCalledWith
(
'MRWidgetUpdateRequested'
);
expect
(
eventHub
.
$emit
).
toHaveBeenCalledWith
(
'EnablePolling'
);
});
...
...
@@ -61,12 +50,11 @@ describe('MRWidgetFailedToMerge', () => {
describe
(
'updateTimer'
,
()
=>
{
it
(
'should update timer and emit event when timer end'
,
()
=>
{
const
vm
=
createComponent
();
spyOn
(
vm
,
'refresh'
);
expect
(
vm
.
timer
).
toEqual
(
10
);
for
(
let
i
=
0
;
i
<
10
;
i
++
)
{
// eslint-disable-line
for
(
let
i
=
0
;
i
<
10
;
i
+=
1
)
{
expect
(
vm
.
timer
).
toEqual
(
10
-
i
);
vm
.
updateTimer
();
}
...
...
@@ -76,47 +64,54 @@ describe('MRWidgetFailedToMerge', () => {
});
});
describe
(
'
template
'
,
()
=>
{
let
vm
;
let
el
;
describe
(
'
while it is refreshing
'
,
()
=>
{
it
(
'renders Refresing now'
,
(
done
)
=>
{
vm
.
isRefreshing
=
true
;
beforeEach
(()
=>
{
vm
=
createComponent
();
el
=
vm
.
$el
;
Vue
.
nextTick
(()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'.js-refresh-label'
).
textContent
.
trim
()).
toEqual
(
'Refreshing now'
);
done
();
});
});
});
it
(
'should have correct elements'
,
(
done
)
=>
{
expect
(
el
.
classList
.
contains
(
'mr-widget-body'
)).
toBeTruthy
();
expect
(
el
.
innerText
).
toContain
(
'Merge error happened.'
);
expect
(
el
.
innerText
).
toContain
(
'Refreshing in 10 seconds'
);
expect
(
el
.
innerText
).
not
.
toContain
(
'Merge failed.'
);
expect
(
el
.
querySelector
(
'button'
).
getAttribute
(
'disabled'
)).
toBeTruthy
();
expect
(
el
.
querySelector
(
'button'
).
innerText
).
toContain
(
'Merge'
);
expect
(
el
.
querySelector
(
'.js-refresh-button'
).
innerText
).
toContain
(
'Refresh now'
);
expect
(
el
.
querySelector
(
'.js-refresh-label'
)).
toEqual
(
null
);
expect
(
el
.
innerText
).
not
.
toContain
(
'Refreshing now'
);
setTimeout
(()
=>
{
expect
(
el
.
innerText
).
toContain
(
'Refreshing in 9 seconds'
);
done
();
},
1010
);
describe
(
'while it is not regresing'
,
()
=>
{
it
(
'renders warning icon and disabled merge button'
,
()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'.js-ci-status-icon-warning'
)).
not
.
toBeNull
();
expect
(
vm
.
$el
.
querySelector
(
'.js-disabled-merge-button'
).
getAttribute
(
'disabled'
)).
toEqual
(
'disabled'
);
});
it
(
'renders given error'
,
()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'.has-error-message'
).
textContent
.
trim
()).
toEqual
(
'Merge error happened..'
);
});
it
(
'should just generic merge failed message if merge_error is not available'
,
(
done
)
=>
{
vm
.
mr
.
mergeError
=
null
;
it
(
'renders refresh button'
,
()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'.js-refresh-button'
).
textContent
.
trim
()).
toEqual
(
'Refresh now'
);
});
Vue
.
nextTick
(()
=>
{
expect
(
el
.
innerText
).
toContain
(
'Merge failed.'
);
expect
(
el
.
innerText
).
not
.
toContain
(
'Merge error happened.'
);
done
();
});
it
(
'renders remaining time'
,
()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'.has-custom-error'
).
textContent
.
trim
(),
).
toEqual
(
'Refreshing in 10 seconds to show the updated status...'
);
});
});
it
(
'should just generic merge failed message if merge_error is not available'
,
(
done
)
=>
{
vm
.
mr
.
mergeError
=
null
;
Vue
.
nextTick
(()
=>
{
expect
(
vm
.
$el
.
innerText
).
toContain
(
'Merge failed.'
);
expect
(
vm
.
$el
.
innerText
).
not
.
toContain
(
'Merge error happened.'
);
done
();
});
});
it
(
'should show refresh label when refresh requested'
,
(
)
=>
{
vm
.
refresh
();
Vue
.
nextTick
(()
=>
{
expect
(
el
.
innerText
).
not
.
toContain
(
'Merge failed. Refreshing'
);
expect
(
el
.
innerText
).
toContain
(
'Refreshing now'
);
}
);
it
(
'should show refresh label when refresh requested'
,
(
done
)
=>
{
vm
.
refresh
();
Vue
.
nextTick
(()
=>
{
expect
(
vm
.
$
el
.
innerText
).
not
.
toContain
(
'Merge failed. Refreshing'
);
expect
(
vm
.
$
el
.
innerText
).
toContain
(
'Refreshing now'
);
done
(
);
});
});
});
spec/javascripts/vue_mr_widget/components/states/mr_widget_merge_when_pipeline_succeeds_spec.js
View file @
4376be84
import
Vue
from
'vue'
;
import
mwpsComponent
from
'~/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds'
;
import
mwpsComponent
from
'~/vue_merge_request_widget/components/states/mr_widget_merge_when_pipeline_succeeds
.vue
'
;
import
eventHub
from
'~/vue_merge_request_widget/event_hub'
;
const
targetBranchPath
=
'/foo/bar'
;
const
targetBranch
=
'foo'
;
const
sha
=
'1EA2EZ34'
;
const
createComponent
=
()
=>
{
const
Component
=
Vue
.
extend
(
mwpsComponent
);
const
mr
=
{
shouldRemoveSourceBranch
:
false
,
canRemoveSourceBranch
:
true
,
canCancelAutomaticMerge
:
true
,
mergeUserId
:
1
,
currentUserId
:
1
,
setToMWPSBy
:
{},
sha
,
targetBranchPath
,
targetBranch
,
};
const
service
=
{
cancelAutomaticMerge
()
{},
mergeResource
:
{
save
()
{},
},
};
return
new
Component
({
el
:
document
.
createElement
(
'div'
),
propsData
:
{
mr
,
service
},
});
};
import
mountComponent
from
'../../../helpers/vue_mount_component_helper'
;
describe
(
'MRWidgetMergeWhenPipelineSucceeds'
,
()
=>
{
describe
(
'props'
,
()
=>
{
it
(
'should have props'
,
()
=>
{
const
{
mr
,
service
}
=
mwpsComponent
.
props
;
expect
(
mr
.
type
instanceof
Object
).
toBeTruthy
();
expect
(
mr
.
required
).
toBeTruthy
();
expect
(
service
.
type
instanceof
Object
).
toBeTruthy
();
expect
(
service
.
required
).
toBeTruthy
();
let
vm
;
const
targetBranchPath
=
'/foo/bar'
;
const
targetBranch
=
'foo'
;
const
sha
=
'1EA2EZ34'
;
beforeEach
(()
=>
{
const
Component
=
Vue
.
extend
(
mwpsComponent
);
spyOn
(
eventHub
,
'$emit'
);
vm
=
mountComponent
(
Component
,
{
mr
:
{
shouldRemoveSourceBranch
:
false
,
canRemoveSourceBranch
:
true
,
canCancelAutomaticMerge
:
true
,
mergeUserId
:
1
,
currentUserId
:
1
,
setToMWPSBy
:
{},
sha
,
targetBranchPath
,
targetBranch
,
},
service
:
{
cancelAutomaticMerge
()
{},
mergeResource
:
{
save
()
{},
},
},
});
});
describe
(
'components'
,
()
=>
{
it
(
'should have components added'
,
()
=>
{
expect
(
mwpsComponent
.
components
[
'mr-widget-author'
]).
toBeDefined
();
});
});
describe
(
'data'
,
()
=>
{
it
(
'should have default data'
,
()
=>
{
const
data
=
mwpsComponent
.
data
();
expect
(
data
.
isCancellingAutoMerge
).
toBeFalsy
();
expect
(
data
.
isRemovingSourceBranch
).
toBeFalsy
();
});
afterEach
(()
=>
{
vm
.
$destroy
();
});
describe
(
'computed'
,
()
=>
{
describe
(
'canRemoveSourceBranch'
,
()
=>
{
it
(
'should return true when user is able to remove source branch'
,
()
=>
{
const
vm
=
createComponent
();
expect
(
vm
.
canRemoveSourceBranch
).
toBeTruthy
();
});
it
(
'should return false when user id is not the same with who set the MWPS'
,
()
=>
{
const
vm
=
createComponent
();
vm
.
mr
.
mergeUserId
=
2
;
expect
(
vm
.
canRemoveSourceBranch
).
toBeFalsy
();
...
...
@@ -83,15 +56,11 @@ describe('MRWidgetMergeWhenPipelineSucceeds', () => {
});
it
(
'should return false when shouldRemoveSourceBranch set to false'
,
()
=>
{
const
vm
=
createComponent
();
vm
.
mr
.
shouldRemoveSourceBranch
=
true
;
expect
(
vm
.
canRemoveSourceBranch
).
toBeFalsy
();
});
it
(
'should return false if user is not able to remove the source branch'
,
()
=>
{
const
vm
=
createComponent
();
vm
.
mr
.
canRemoveSourceBranch
=
false
;
expect
(
vm
.
canRemoveSourceBranch
).
toBeFalsy
();
});
...
...
@@ -101,11 +70,9 @@ describe('MRWidgetMergeWhenPipelineSucceeds', () => {
describe
(
'methods'
,
()
=>
{
describe
(
'cancelAutomaticMerge'
,
()
=>
{
it
(
'should set flag and call service then tell main component to update the widget with data'
,
(
done
)
=>
{
const
vm
=
createComponent
();
const
mrObj
=
{
is_new_mr_data
:
true
,
};
spyOn
(
eventHub
,
'$emit'
);
spyOn
(
vm
.
service
,
'cancelAutomaticMerge'
).
and
.
returnValue
(
new
Promise
((
resolve
)
=>
{
resolve
({
data
:
mrObj
,
...
...
@@ -123,8 +90,6 @@ describe('MRWidgetMergeWhenPipelineSucceeds', () => {
describe
(
'removeSourceBranch'
,
()
=>
{
it
(
'should set flag and call service then request main component to update the widget'
,
(
done
)
=>
{
const
vm
=
createComponent
();
spyOn
(
eventHub
,
'$emit'
);
spyOn
(
vm
.
service
.
mergeResource
,
'save'
).
and
.
returnValue
(
new
Promise
((
resolve
)
=>
{
resolve
({
data
:
{
...
...
@@ -148,31 +113,23 @@ describe('MRWidgetMergeWhenPipelineSucceeds', () => {
});
describe
(
'template'
,
()
=>
{
let
vm
;
let
el
;
beforeEach
(()
=>
{
vm
=
createComponent
();
el
=
vm
.
$el
;
});
it
(
'should have correct elements'
,
()
=>
{
expect
(
el
.
classList
.
contains
(
'mr-widget-body'
)).
toBeTruthy
();
expect
(
el
.
innerText
).
toContain
(
'to be merged automatically when the pipeline succeeds'
);
expect
(
el
.
innerText
).
toContain
(
'The changes will be merged into'
);
expect
(
el
.
innerText
).
toContain
(
targetBranch
);
expect
(
el
.
innerText
).
toContain
(
'The source branch will not be removed'
);
expect
(
el
.
querySelector
(
'.js-cancel-auto-merge'
).
innerText
).
toContain
(
'Cancel automatic merge'
);
expect
(
el
.
querySelector
(
'.js-cancel-auto-merge'
).
getAttribute
(
'disabled'
)).
toBeFalsy
();
expect
(
el
.
querySelector
(
'.js-remove-source-branch'
).
innerText
).
toContain
(
'Remove source branch'
);
expect
(
el
.
querySelector
(
'.js-remove-source-branch'
).
getAttribute
(
'disabled'
)).
toBeFalsy
();
expect
(
vm
.
$
el
.
classList
.
contains
(
'mr-widget-body'
)).
toBeTruthy
();
expect
(
vm
.
$
el
.
innerText
).
toContain
(
'to be merged automatically when the pipeline succeeds'
);
expect
(
vm
.
$
el
.
innerText
).
toContain
(
'The changes will be merged into'
);
expect
(
vm
.
$
el
.
innerText
).
toContain
(
targetBranch
);
expect
(
vm
.
$
el
.
innerText
).
toContain
(
'The source branch will not be removed'
);
expect
(
vm
.
$
el
.
querySelector
(
'.js-cancel-auto-merge'
).
innerText
).
toContain
(
'Cancel automatic merge'
);
expect
(
vm
.
$
el
.
querySelector
(
'.js-cancel-auto-merge'
).
getAttribute
(
'disabled'
)).
toBeFalsy
();
expect
(
vm
.
$
el
.
querySelector
(
'.js-remove-source-branch'
).
innerText
).
toContain
(
'Remove source branch'
);
expect
(
vm
.
$
el
.
querySelector
(
'.js-remove-source-branch'
).
getAttribute
(
'disabled'
)).
toBeFalsy
();
});
it
(
'should disable cancel auto merge button when the action is in progress'
,
(
done
)
=>
{
vm
.
isCancellingAutoMerge
=
true
;
Vue
.
nextTick
(()
=>
{
expect
(
el
.
querySelector
(
'.js-cancel-auto-merge'
).
getAttribute
(
'disabled'
)).
toBeTruthy
();
expect
(
vm
.
$
el
.
querySelector
(
'.js-cancel-auto-merge'
).
getAttribute
(
'disabled'
)).
toBeTruthy
();
done
();
});
});
...
...
@@ -181,7 +138,7 @@ describe('MRWidgetMergeWhenPipelineSucceeds', () => {
vm
.
mr
.
shouldRemoveSourceBranch
=
true
;
Vue
.
nextTick
(()
=>
{
const
normalizedText
=
el
.
innerText
.
replace
(
/
\s
+/g
,
' '
);
const
normalizedText
=
vm
.
$
el
.
innerText
.
replace
(
/
\s
+/g
,
' '
);
expect
(
normalizedText
).
toContain
(
'The source branch will be removed'
);
expect
(
normalizedText
).
not
.
toContain
(
'The source branch will not be removed'
);
done
();
...
...
@@ -192,7 +149,7 @@ describe('MRWidgetMergeWhenPipelineSucceeds', () => {
vm
.
mr
.
currentUserId
=
4
;
Vue
.
nextTick
(()
=>
{
expect
(
el
.
querySelector
(
'.js-remove-source-branch'
)).
toEqual
(
null
);
expect
(
vm
.
$
el
.
querySelector
(
'.js-remove-source-branch'
)).
toEqual
(
null
);
done
();
});
});
...
...
@@ -201,7 +158,7 @@ describe('MRWidgetMergeWhenPipelineSucceeds', () => {
vm
.
isRemovingSourceBranch
=
true
;
Vue
.
nextTick
(()
=>
{
expect
(
el
.
querySelector
(
'.js-remove-source-branch'
).
getAttribute
(
'disabled'
)).
toBeTruthy
();
expect
(
vm
.
$
el
.
querySelector
(
'.js-remove-source-branch'
).
getAttribute
(
'disabled'
)).
toBeTruthy
();
done
();
});
});
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment