Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
G
gitlab-ce
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
Léo-Paul Géneau
gitlab-ce
Commits
b01dacff
Commit
b01dacff
authored
6 years ago
by
Winnie Hellmann
Committed by
Phil Hughes
6 years ago
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Replace job with group in frontend components to be consistent with backend
parent
b2da681f
Changes
9
Show whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
60 additions
and
81 deletions
+60
-81
app/assets/javascripts/pipelines/components/graph/graph_component.vue
...avascripts/pipelines/components/graph/graph_component.vue
+1
-1
app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue
...scripts/pipelines/components/graph/job_group_dropdown.vue
+19
-35
app/assets/javascripts/pipelines/components/graph/job_item.vue
...ssets/javascripts/pipelines/components/graph/job_item.vue
+0
-0
app/assets/javascripts/pipelines/components/graph/stage_column_component.vue
...pts/pipelines/components/graph/stage_column_component.vue
+16
-20
app/assets/javascripts/pipelines/components/stage.vue
app/assets/javascripts/pipelines/components/stage.vue
+3
-3
qa/qa/page/project/pipeline/show.rb
qa/qa/page/project/pipeline/show.rb
+1
-1
spec/javascripts/pipelines/graph/job_group_dropdown_spec.js
spec/javascripts/pipelines/graph/job_group_dropdown_spec.js
+9
-9
spec/javascripts/pipelines/graph/job_item_spec.js
spec/javascripts/pipelines/graph/job_item_spec.js
+3
-3
spec/javascripts/pipelines/graph/stage_column_component_spec.js
...avascripts/pipelines/graph/stage_column_component_spec.js
+8
-9
No files found.
app/assets/javascripts/pipelines/components/graph/graph_component.vue
View file @
b01dacff
...
...
@@ -70,7 +70,7 @@ export default {
v-for=
"(stage, index) in graph"
:key=
"stage.name"
:title=
"capitalizeStageName(stage.name)"
:
job
s=
"stage.groups"
:
group
s=
"stage.groups"
:stage-connector-class=
"stageConnectorClass(index, stage)"
:is-first-column=
"isFirstColumn(index)"
@
refreshPipelineGraph=
"refreshPipelineGraph"
...
...
This diff is collapsed.
Click to expand it.
app/assets/javascripts/pipelines/components/graph/
dropdown_job_component
.vue
→
app/assets/javascripts/pipelines/components/graph/
job_group_dropdown
.vue
View file @
b01dacff
<
script
>
import
$
from
'
jquery
'
;
import
JobNameComponent
from
'
./job_name_component
.vue
'
;
import
Job
Component
from
'
./job_component
.vue
'
;
import
CiIcon
from
'
~/vue_shared/components/ci_icon
.vue
'
;
import
Job
Item
from
'
./job_item
.vue
'
;
import
tooltip
from
'
../../../vue_shared/directives/tooltip
'
;
/**
* Renders the dropdown for the pipeline graph.
*
* The
following object should be provided as `job`:
* The
object provided as `group` corresponds to app/serializers/job_group_entity.rb.
*
* {
* "id": 4256,
* "name": "test",
* "status": {
* "icon": "status_success",
* "text": "passed",
* "label": "passed",
* "group": "success",
* "details_path": "/root/ci-mock/builds/4256",
* "action": {
* "icon": "retry",
* "title": "Retry",
* "path": "/root/ci-mock/builds/4256/retry",
* "method": "post"
* }
* }
* }
*/
export
default
{
directives
:
{
...
...
@@ -33,12 +16,12 @@ export default {
},
components
:
{
Job
Component
,
JobNameComponent
,
Job
Item
,
CiIcon
,
},
props
:
{
job
:
{
group
:
{
type
:
Object
,
required
:
true
,
},
...
...
@@ -46,7 +29,8 @@ export default {
computed
:
{
tooltipText
()
{
return
`
${
this
.
job
.
name
}
-
${
this
.
job
.
status
.
label
}
`
;
const
{
name
,
status
}
=
this
.
group
;
return
`
${
name
}
-
${
status
.
label
}
`
;
},
},
...
...
@@ -56,7 +40,7 @@ export default {
methods
:
{
/**
* When the user right clicks or cmd/ctrl + click in the
job
name or the action icon
* When the user right clicks or cmd/ctrl + click in the
group
name or the action icon
* the dropdown should not be closed so we stop propagation
* of the click event inside the dropdown.
*
...
...
@@ -90,14 +74,14 @@ export default {
data-display=
"static"
class=
"dropdown-menu-toggle build-content"
>
<ci-icon
:status=
"group.status"
/>
<job-name-component
:name=
"job.name"
:status=
"job.status"
/>
<span
class=
"ci-status-text"
>
{{
group
.
name
}}
</span>
<span
class=
"dropdown-counter-badge"
>
{{
job
.
size
}}
{{
group
.
size
}}
</span>
</button>
...
...
@@ -105,12 +89,12 @@ export default {
<li
class=
"scrollable-menu"
>
<ul>
<li
v-for=
"
(item, i) in job
.jobs"
:key=
"
i
"
v-for=
"
job in group
.jobs"
:key=
"
job.id
"
>
<job-
component
:dropdown-length=
"
job
.size"
:job=
"
item
"
<job-
item
:dropdown-length=
"
group
.size"
:job=
"
job
"
css-class-job-name=
"mini-pipeline-graph-dropdown-item"
@
pipelineActionRequestComplete=
"pipelineActionRequestComplete"
/>
...
...
This diff is collapsed.
Click to expand it.
app/assets/javascripts/pipelines/components/graph/job_
component
.vue
→
app/assets/javascripts/pipelines/components/graph/job_
item
.vue
View file @
b01dacff
File moved
This diff is collapsed.
Click to expand it.
app/assets/javascripts/pipelines/components/graph/stage_column_component.vue
View file @
b01dacff
<
script
>
import
_
from
'
underscore
'
;
import
Job
Component
from
'
./job_component
.vue
'
;
import
DropdownJobComponent
from
'
./dropdown_job_component
.vue
'
;
import
Job
Item
from
'
./job_item
.vue
'
;
import
JobGroupDropdown
from
'
./job_group_dropdown
.vue
'
;
export
default
{
components
:
{
Job
Component
,
DropdownJobComponent
,
Job
Item
,
JobGroupDropdown
,
},
props
:
{
title
:
{
...
...
@@ -14,7 +14,7 @@ export default {
required
:
true
,
},
job
s
:
{
group
s
:
{
type
:
Array
,
required
:
true
,
},
...
...
@@ -33,12 +33,8 @@ export default {
},
methods
:
{
firstJob
(
list
)
{
return
list
[
0
];
},
jobId
(
job
)
{
return
`ci-badge-
${
_
.
escape
(
job
.
name
)}
`
;
groupId
(
group
)
{
return
`ci-badge-
${
_
.
escape
(
group
.
name
)}
`
;
},
buildConnnectorClass
(
index
)
{
...
...
@@ -61,25 +57,25 @@ export default {
<div
class=
"builds-container"
>
<ul>
<li
v-for=
"(
job, index) in job
s"
:id=
"
jobId(job
)"
:key=
"
job
.id"
v-for=
"(
group, index) in group
s"
:id=
"
groupId(group
)"
:key=
"
group
.id"
:class=
"buildConnnectorClass(index)"
class=
"build"
>
<div
class=
"curve"
></div>
<job-
component
v-if=
"
job
.size === 1"
:job=
"
job
"
<job-
item
v-if=
"
group
.size === 1"
:job=
"
group.jobs[0]
"
css-class-job-name=
"build-content"
@
pipelineActionRequestComplete=
"pipelineActionRequestComplete"
/>
<
dropdown-job-component
v-if=
"
job
.size > 1"
:
job=
"job
"
<
job-group-dropdown
v-if=
"
group
.size > 1"
:
group=
"group
"
@
pipelineActionRequestComplete=
"pipelineActionRequestComplete"
/>
...
...
This diff is collapsed.
Click to expand it.
app/assets/javascripts/pipelines/components/stage.vue
View file @
b01dacff
...
...
@@ -18,14 +18,14 @@ import Flash from '../../flash';
import
axios
from
'
../../lib/utils/axios_utils
'
;
import
eventHub
from
'
../event_hub
'
;
import
Icon
from
'
../../vue_shared/components/icon.vue
'
;
import
Job
Component
from
'
./graph/job_component
.vue
'
;
import
Job
Item
from
'
./graph/job_item
.vue
'
;
import
tooltip
from
'
../../vue_shared/directives/tooltip
'
;
import
{
PIPELINES_TABLE
}
from
'
../constants
'
;
export
default
{
components
:
{
Icon
,
Job
Component
,
Job
Item
,
},
directives
:
{
...
...
@@ -198,7 +198,7 @@ export default {
v-for=
"job in dropdownContent"
:key=
"job.id"
>
<job-
component
<job-
item
:dropdown-length=
"dropdownContent.length"
:job=
"job"
css-class-job-name=
"mini-pipeline-graph-dropdown-item"
...
...
This diff is collapsed.
Click to expand it.
qa/qa/page/project/pipeline/show.rb
View file @
b01dacff
...
...
@@ -9,7 +9,7 @@ module QA::Page
element
:pipeline_graph
,
/class.*pipeline-graph.*/
# rubocop:disable QA/ElementWithPattern
end
view
'app/assets/javascripts/pipelines/components/graph/job_
component
.vue'
do
view
'app/assets/javascripts/pipelines/components/graph/job_
item
.vue'
do
element
:job_component
,
/class.*ci-job-component.*/
# rubocop:disable QA/ElementWithPattern
element
:job_link
,
/class.*js-pipeline-graph-job-link.*/
# rubocop:disable QA/ElementWithPattern
end
...
...
This diff is collapsed.
Click to expand it.
spec/javascripts/pipelines/graph/
dropdown_job_component
_spec.js
→
spec/javascripts/pipelines/graph/
job_group_dropdown
_spec.js
View file @
b01dacff
import
Vue
from
'
vue
'
;
import
component
from
'
~/pipelines/components/graph/dropdown_job_component
.vue
'
;
import
JobGroupDropdown
from
'
~/pipelines/components/graph/job_group_dropdown
.vue
'
;
import
mountComponent
from
'
spec/helpers/vue_mount_component_helper
'
;
describe
(
'
dropdown job
component
'
,
()
=>
{
const
Component
=
Vue
.
extend
(
component
);
describe
(
'
job group dropdown
component
'
,
()
=>
{
const
Component
=
Vue
.
extend
(
JobGroupDropdown
);
let
vm
;
const
mock
=
{
const
group
=
{
jobs
:
[
{
id
:
4256
,
...
...
@@ -71,15 +71,15 @@ describe('dropdown job component', () => {
});
beforeEach
(()
=>
{
vm
=
mountComponent
(
Component
,
{
job
:
mock
});
vm
=
mountComponent
(
Component
,
{
group
});
});
it
(
'
renders button with
job
name and size
'
,
()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'
button
'
).
textContent
).
toContain
(
mock
.
name
);
expect
(
vm
.
$el
.
querySelector
(
'
button
'
).
textContent
).
toContain
(
mock
.
size
);
it
(
'
renders button with
group
name and size
'
,
()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'
button
'
).
textContent
).
toContain
(
group
.
name
);
expect
(
vm
.
$el
.
querySelector
(
'
button
'
).
textContent
).
toContain
(
group
.
size
);
});
it
(
'
renders dropdown with jobs
'
,
()
=>
{
expect
(
vm
.
$el
.
querySelectorAll
(
'
.scrollable-menu>ul>li
'
).
length
).
toEqual
(
mock
.
jobs
.
length
);
expect
(
vm
.
$el
.
querySelectorAll
(
'
.scrollable-menu>ul>li
'
).
length
).
toEqual
(
group
.
jobs
.
length
);
});
});
This diff is collapsed.
Click to expand it.
spec/javascripts/pipelines/graph/job_
component
_spec.js
→
spec/javascripts/pipelines/graph/job_
item
_spec.js
View file @
b01dacff
import
Vue
from
'
vue
'
;
import
jobComponent
from
'
~/pipelines/components/graph/job_component
.vue
'
;
import
JobItem
from
'
~/pipelines/components/graph/job_item
.vue
'
;
import
mountComponent
from
'
spec/helpers/vue_mount_component_helper
'
;
describe
(
'
pipeline graph job
component
'
,
()
=>
{
const
JobComponent
=
Vue
.
extend
(
jobComponent
);
describe
(
'
pipeline graph job
item
'
,
()
=>
{
const
JobComponent
=
Vue
.
extend
(
JobItem
);
let
component
;
const
mockJob
=
{
...
...
This diff is collapsed.
Click to expand it.
spec/javascripts/pipelines/graph/stage_column_component_spec.js
View file @
b01dacff
...
...
@@ -25,17 +25,16 @@ describe('stage column component', () => {
};
beforeEach
(()
=>
{
const
mockJobs
=
[];
const
mockGroups
=
[];
for
(
let
i
=
0
;
i
<
3
;
i
+=
1
)
{
const
mockedJob
=
Object
.
assign
({},
mockJob
);
mockedJob
.
id
+=
i
;
mock
Job
s
.
push
(
mockedJob
);
mock
Group
s
.
push
(
mockedJob
);
}
component
=
mountComponent
(
StageColumnComponent
,
{
title
:
'
foo
'
,
jobs
:
mockJob
s
,
groups
:
mockGroup
s
,
});
});
...
...
@@ -43,14 +42,14 @@ describe('stage column component', () => {
expect
(
component
.
$el
.
querySelector
(
'
.stage-name
'
).
textContent
.
trim
()).
toEqual
(
'
foo
'
);
});
it
(
'
should render the provided
job
s
'
,
()
=>
{
it
(
'
should render the provided
group
s
'
,
()
=>
{
expect
(
component
.
$el
.
querySelectorAll
(
'
.builds-container > ul > li
'
).
length
).
toEqual
(
3
);
});
describe
(
'
jobId
'
,
()
=>
{
it
(
'
escapes job name
'
,
()
=>
{
component
=
mountComponent
(
StageColumnComponent
,
{
job
s
:
[
group
s
:
[
{
id
:
4259
,
name
:
'
<img src=x onerror=alert(document.domain)>
'
,
...
...
@@ -64,9 +63,9 @@ describe('stage column component', () => {
title
:
'
test
'
,
});
expect
(
component
.
$el
.
querySelector
(
'
.builds-container li
'
).
getAttribute
(
'
id
'
)
,
)
.
toEqual
(
'
ci-badge-<img src=x onerror=alert(document.domain)>
'
)
;
expect
(
component
.
$el
.
querySelector
(
'
.builds-container li
'
).
getAttribute
(
'
id
'
)).
toEqual
(
'
ci-badge-<img src=x onerror=alert(document.domain)>
'
,
);
});
});
});
This diff is collapsed.
Click to expand it.
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