►
From YouTube: Jenkins UX SIG Meeting 15 Sep 2021
Description
Jenkins user experience special interest group meeting including a demonstration of the code coverage UI improvements that Ulli Hafner is preparing.
A
Welcome
everyone:
this
is
the
jenkins
user
experience
special
interest
group.
It's
the
15th
of
september
2021
thrilled
to
have
everyone
here.
A
B
A
Okay
got
it
so
that
so
the
the
project
he
was
working
actually
was
a
bachelor
project,
not
a
master
project.
Yes
got
it.
Thank
you
thanks
for
the
clarity
all
right,
so
I
wanted
to
give
uli
some
time
to
talk
about
the
code
coverage,
ui
improvements
that
he's
envisioning
and
that
have
started
discussion
already
in
the
community
thread,
and
then
I
had
put
a
placeholder
in
to
talk
about
pipeline
graph
view.
B
B
Okay,
now
you
should
see
the
code
coverage
view,
the
old
one
and
I'm
planning
to
yeah
rewrite
a
lot
of
the
code
coverage
plug-in
in
the
next
yeah
couple
of
weeks,
and
a
student
at
our
university
is
trying
to
improve
the
coverage
plugin
as
well,
not
on
the
ui
side,
but
on
the
model
side,
what
we
want
to
introduce
is
some
kind
of
delta
coverage
computation.
B
Currently
you
see
the
code
coverage
of
your
project
in
the
current
state,
but
what
is
more
interesting
for
me
is
to
provide
some
details
about
the
delta
coverage
from
a
pull
request.
So
you
see
how
many
or
how
you
improve
the
coverage.
You
have
decreased
the
coverage
which
lines
you
covered,
which
lines
you
did
not
cover
from
the
current
pull
request,
not
the
overall
project.
B
So
the
screen
you
are
seeing
now
is
the
current
implementation,
which
is
on
our
yeah
ci
instance,
available
to
everybody,
and
what
we
see
here
is
basically,
we
have
a
trend
chart
in
this
details
view
we
have
this
over
a
coverage
view,
and
this
screen
needs
a
little
bit
improvement.
I
think
so.
I
started
to
refactor
it
and
what
I've
done
is
I
basically
added
two
different
things.
So
the
first
thing
is,
I
added
a
code
coverage
trend
chart.
B
B
All
these
charts
are
now
yeah,
look
quite
similar,
so
what
I
have
removed
from
the
main
screen
is
the
yeah.
The
project
fuse
should
show
the
trend
of
your
project
and
not
the
current
state.
So
here
you
see
the
trend
and
when
you
want
to
see
the
current
state,
you
need
to
select
one
of
your
builds
and
click,
and
then
you
see
the
new
details
view
and
this
detail
view
is
a
little
bit
expanded
or
extended.
B
So
what
I
tried
to
introduce
here
is,
first
of
all,
I'm
using
also
bootstrap
here
to
to
show
the
elements
in
some
cards.
B
I
still
need
to
rearrange
it
a
little
bit,
so
this
is
not
yet
finished
because,
first
of
all,
I
wanted
to
build
the
building
blocks
and
then
I
need
to
see
how
to
show
on
a
big
screen
how
to
show
on
a
small
screen.
So
that
is
not
yet
finished.
So
I
just
implemented
the
parts
and
the
first
part
is.
This
is
already
part
of
the
existing
plugin
just
an
overview.
B
B
B
B
So
so
what
is?
Maybe
I
sorry
I
switched
into
another
report
where
we
see
it
a
little
bit
better
in
another
project
for
me.
So
this
is
a
project
that
has
a
really
good
code
coverage
and
for
me,
as
an
architect,
it's
important
to
see
which
parts
need
to
be
improved.
So
I
can
focus
on
the
red
things
here.
So
green
is
everything
fine,
so
I
don't
have
to
look
into
so,
but
here
we
have
some
red
markets.
B
So
if
I
press
here,
we
have
this
street
chart
which
navigates
to
these
classes,
which
have
no
code
coverage
currently
or
which
have
a
bad
code
coverage.
This
one
has
75
percent,
but
this
one
has
100,
so
I
can
select
more
easily,
which
are
the
pain
points
in
my
project
and
which
are,
let's
say,
the
good
things.
B
So
this
needs
a
little
bit
more
investigation
for
bigger
projects,
so
I'm
using
it
currently
for
my
projects.
Only
so
it's
you
can't
see
the
names
anymore
for
the
classes,
but
you
can
always
click
into
the
details
and
then
it
is
zooming
automatically
and
you
can
make
it
smaller
and
you
move
around.
This
is
already
provided
by
e-chart.
So
this
is
nothing
I
programmed.
This
is
just
from
the
library
I'm
using.
B
Yes,
so
this
is
basically
for
free
and
the
only
thing
what
I
provided
is
a
tree
model
where
I
render
my
project
in
a
tree
and
each
node
has
a
coverage.
So
I
have
a
node
for
the
project,
a
node
for
the
packages
and
a
node
for
the
files,
a
node
for
the
classes,
and
I
stopped
here
at
the
class
at
the
phi
level.
B
A
So
this
is
a
totally
new
view
which
is
available,
and
that
view
is
a
thing
of
beauty
to
me.
I'm
used
to
using
that
kind
of
a
view
to
look
at
disk
space
use
on
my
computer,
and
I
love
those
those
sorts
of
views
because
they
help
me
very
quickly
identify.
So
the
size
of
the
block
is
the
is
the
number
of
lines
in
the
source
file.
B
B
So
what
not?
What
is
not
yet
implemented
would
be
something
if
I
click
here.
It
would
be
helpful
if
I
see
more
details
for
the
selected
file,
but
I
didn't
get
it
yet
because
currently
the
click
is
interpreted
for
the
zoom.
So
I
need
to
figure
out
how
to
I
can
register
an
additional
event.
A
Okay,
so
so
I
was
curious
what
the
action
was.
The
action
you
took
to
do
the
zoom
is
actually
a
click,
not
something
with
a
scroll.
Okay,
so
yeah
you
can.
B
Use
my
other
my
on
my
zoom
bar
here
on
my
mac.
I
can
use
bigger
and
as
if,
to
make
the
pinch
and
my
pen
how
hard
we
call
it
yeah
and
but
you
can
also
click
and
then
the
selected
element
will
be
put
into
the
middle
or
in
the
center.
B
So
this
view
is
well.
The
idea
of
this
view
is
also
used
by
coral
cover
alls,
and
these
I
don't
know.
Let's
say
let
me
show
you
sorry.
B
B
A
This
is
gorgeous
julie.
Thank
you
I
so
so
in
order
for
me
to
see
that
so
I
you
mentioned
that
you
tend
to
focus
on
on
the
the
which
things
are
most
in
need
of
coverage.
I
tend
to
focus
on,
I
think.
What's
the
next
section
down
the
coverage
detail
of
all
files,
I
tend
to
look
at
the
statement
level,
but
but
I
think
what
you're
saying
is
I
wouldn't
be
able
to
click
in
the
coverage
overview
yet,
but
I
can
see
statement
level
by
clicking
in
the
coverage
details
of
all
files,
yeah.
B
Yes,
this
is
the
third
view,
so
actually,
as
I
already
mentioned
in
the
beginning-
I'm
not
sure
how
to
place
these
three
fuse
if
I
use
different
panels
on
the
left
and
right
or
if
I
use
tabs.
B
So
this
needs
to
be
looked
at,
I'm
not
sure
how
to
make
this,
but
the
oops
this,
the
third
part,
is
kind
of
similar
to
the
warnings
plug-in
where
you
see
all
your
files
in
a
table,
so
you
so
now
here.
This
is
only
40
files.
It's
a
small
project.
B
Maybe
we
go
back
to
the
my
other
project,
so
here
we
have,
let's
say
300
files
and
if
you
want
to
see
the
coverage
of
these
files,
it's
the
same
as
in
the
warning
plugin
you
can
select
for,
for
instance,
press
eclipse
here
in
the
search
field,
and
then
you
have
all
your
four
classes
which
somehow
about
the
eclipse
parser
and
then
you
see
in
in
a
short
view
the
line
coverage
and
the
branch
coverage
of
these
elements.
B
So
this
is
something
which
is
maybe
better
to
work
with
this
table.
You
because
you
want
to
look
at
your
files,
you
may
you
can
sort
the
files
by
let's
by
coverage
or
hereby
coverage
so
yeah.
It
depends
on
what
you
are
trying
to
achieve,
and
here
you
see
the
file
names,
and
here
you
can
also,
let's,
let's
look
some
up
here.
B
A
B
Since
I'm
currently
developing
very
heavily,
this
is
an
old
data
which
is
which
not,
which
is
not
the
source
code
available
yet,
but
this
one
has
so
sorry
for
jumping
back
and
forth.
So
this
is
just
a
different
project
where
I
enabled
the
source
code
view
and-
and
here,
if
you
click
on,
for
instance,
this
file,
you
see
the
source
code
view,
and
this
is
a
few
I
I've
taken
from
the
old
plugin,
though
this
is
not
no
new
implementation.
B
B
The
idea
is,
if
now
we
have
just
two
levels
of
views,
because
in
the
old
plugin
we
had
the
level
of
project
and
a
group
then
package,
then
source
code,
you
need
to
click.
I
think
seven
steps
until
you
see
the
source
code
and
a
lot
of
people
didn't
find
the
source
code
because
they
didn't
know
how,
where
to
click.
B
Okay,
you
need
to
configure
it
and
that's
a
point,
but
if
you
configured
it,
it's
really
hard
to
find.
And
now
you
have
just
two
clicks
or
not
two
clicks,
but
two
fuse.
You
have
your
the
top
level
view
with
this
three
parts
and
then
you
can
click
on
any
source
code.
Let's
it
doesn't
matter,
click
here
and
you
see
immediately
your
source
code.
B
I
think
there
are
a
lot
of
small
things
which
need
to
be
improved
now
some
yeah
layout,
how
to
show
it
on
a
small
screen
and
a
big
screen
but
yeah.
I
think
I
wanted
to
start
with
the
building
blocks
to
make
them
ready,
and
then
we
need
to
improve
step
by
step.
A
And
that's
brilliant,
so
where?
Where
would
you
like
feedback
on
these
kind
of
things?
I
know
you'd
started.
The
conversation
community.jenkins.io
is:
is
that
and
is?
Are
you
at
a
point
where
you
want
people
to
play
with
the
code
or
you're
still
deep
in
development
and
aren't
ready
yet
for
anyone
else
to
experiment
with
it.
B
Currently,
it's
not
yet
ready
to
yeah
to
be
used
by
someone
else,
so
I
I
thought
it
would
be
helpful
to
discuss
it
in
community,
but
then
I
noticed
I
even
posted
it
in
a
video
channel
of
the
code
coverage
api,
but
nobody
responded.
So
I
thought
it's
maybe
better
if
the
people
can
see
it
on
their
machines
and
then
report
about
what
to
change
so.
My
plan
currently
is
to
finish
it.
B
B
A
B
B
Any
different
other
questions
from
for.
C
This
thing
not
really
questions,
but
I
I'm
I'm
just
shocked
and
impressed
by
this,
because
this
is
just
awesome.
One
of
the
products
I
used
to
manage
was
a
code
coverage
tool
for
mainframe
source
code,
so
it
was
cobalt
and
assembler
and
stuff
like
that.
But
the
the
visualization
is
is
so
powerful
and
echo
patti's
question
in
the
chat
there
she
asked
you
know:
is
there
a
need
to
see
all
three?
At
the
same
time,
all
three
views
like
if
you
go
back
one
screen
to
the
more
chart
view
yeah.
D
Yeah,
this
looks
really
good
and,
as
someone
who
is
you
know,
probably
in
my
last
two
jobs
was
the
first
two
jobs
in
my
10-year
career
of
using
code
coverage
for
unit
tests,
which
I'm
sad
to
say.
This
looks
really
great
and
when
you
were
talking
about
you
know
for
the
cards,
do
you
do
tabs?
Do
you
do
columns?
Do
you
do
accordions
and
that's
kind
of
what
made
me
think
of
the
you
know?
Do
you
actually
need
to
see
all
three
of
them
at
the
exact
same
time?
D
Or
could
you
do
some
type
of
like
toggle
to
say
like
if
I
you
know,
because
we,
I
think,
probably
all
three
of
us
have
a
different
use-
use
case
that
we
would
be
viewing
this
for,
and
is
it
something
that
I
could
say
you
know
I'm
an
architect?
I
need
to
see
it
at
this
level.
Let
me
turn
that
on
and
now
I
can
see
that
panel
on
the
ui
or
you
know,
are
we
thinking?
Well,
no.
D
Everyone
needs
to
see
all
three
of
these
at
the
same
time
because
they
give
different
levels
of
detail,
but
I
think
it
looks
really
good
and
I'm
curious.
Actually,
if
you
are
thinking
that
this
will
you're
going
to
release
it
for
october,
are
you
thinking
this
would
be
something
that
would
be
an
interesting
use
for
hacktoberfest?
Maybe
to
help
you
with
some
of
that
alignment
stuff
for
for
seeing
all
of
the
graphs.
B
I
think
we
need
always
need
a
loot,
a
lot
of
good
opportunities
for
people
to
help
in
oktoberfest.
So
this
is
a
ux
user
interface
thing
and
sometimes
we
only
have
java
programmers.
Sometimes
we
have
only
c
programmers
and
sometimes
we
have
javascript
programmers,
and
here
they
could
help
very
much
yeah.
A
A
Would
you
be
interested
in
presenting
a
segment
on
this,
both
as
hey
here's,
something
new
we've
got
and
if
you're
open
to
contributions
from
others,
you
could.
You
could
then
describe
how
they
could
contribute
now,
if
you're
not
open,
if
you're,
not
not
at
the
point,
where
you're
ready
for
others
to
contribute-
that's
okay,
too,
but
are
you
interested
in
in
that
or
is
it
still
premature?
A
B
I
think
the
good
thing
is
it
is.
I
want
to
develop
in
side
by
side,
so
you
can't
break
anything
because
yeah,
you
still
have
the
old
view
and
my
student
starts
in
october
as
well.
So
it
needs
to
be
ready
and
I
want
to
have
it
in
a
in
a
good
shape.
The
project
so,
and
I
think
there
are
a
lot
of
small
improvements
where
I
actually
don't
have
the
time.
B
So
I'm
happy
that
it
is
now
working,
and
so
even
if
someone
else
has
the
idea,
for
instance,
that
let
me
show
a
small
example.
So
what
I
I've
prepared
here
is
this
table,
where
I
have
two
columns
which
are
called
line
coverage
where
we
have
the
color
and,
for
instance,
the
percentage
in
a
number-
and
this
is
fine
for
me
now
to
to
to
make
the
student
happy
to
start
his
work.
B
But
in
order
to
have
a
good
ui,
it
would
be
helpful
if
we
can
combine
these
views
and-
and
this
takes
a
little
bit
time
for
someone.
But
you
don't
have
to
have
much
acknowledge
about
the
whole
project.
So
some
ui
skills
would
be
helpful
and
then
you
can
make
a
better
column,
for
instance,
or
you
can
add
some
tool
tips
here
or
some
small
things.
A
B
Fine,
I
will
can
make
a
demo
and
some
add
some.
A
C
A
question
for
you-
and
maybe
this
is
a
naive,
dumb
question,
but
have
you
thought
of
maybe
combining
these
bottom
two
views?
Would
that
make
sense
one
I
mean,
as
you
keep
digging
down
into
the
into
the
more
graphical
one.
You
know.
Eventually
you
get
to
the
the
line
coverage
of
the
of
the
class
or
of
the
of
the
of
the
methods.
So,
instead
of
like
two
views
here,
have
you
has
that
crossed
your
mind
or
is
that
a
dumb
question.
B
No,
that's,
I
think
it's
I
think
it's
helpful
to
have
this
treat
you
and
on
the
other
side,
I'm
using
in
the
warnings
plugin
quite
a
lot,
often
the
only
the
table,
so
I'm
sometimes
I
don't
need
charts
at
all.
I
just
want
to
sort
by
by
coverage
and
select
the
things
which
yeah.
Maybe
we
click
here,
where
I
see
immediately,
which
file
needs
to
be
improved,
so
I
think
both
views
typically
show
the
same
information
in
a
different
way.
This
is
the
tabula
way,
and
this
is
the
three
way.
B
So,
let's
render
it
again,
so
I
think
it
makes
sense
to
show
either
this
one
or
this
one
and
not
both
together.
So
maybe
it's
helpful
to
have
a
toggle
or
a
tab,
so
one
user
prefers
the
tree
view
and
the
other
users
prefer
the
table
view
so
yeah.
Actually,
I'm
not
really
sure.
C
Yeah
I
mean
yeah
that
was
kind
of
my
thought
is
two
tabs
right.
Some
people
are
more
visual
and
people
want
just
the
raw
data
table
view
so
yeah.
Now,
that's
great
with
the
with
the
the
red
background
in
the
in
the
top
visual.
Would
that
change
to
green?
If
all
the
boxes
were
green
inside
of
it
yeah
this.
B
Is
the
package
the
line
coverage
of
the
package
is
only
35,
so
it's
really
bad.
Maybe
we
can
skip
to
the
to
the
good
project.
B
So
here
you
see
the
the
this
level
is
95
and
therefore
it's
green.
So
I
I
experimented
a
lot
of
with
the
colors.
It's
really
hard
to
find
colors
and
then
I
noticed
these
view
is
not
color
blind
safe.
So
if
someone
is
colorblind
you
you
don't
want
to
see
a
difference
between
red
and
green,
so
we've
got.
A
Awesome
now
so
this
this
particular
project
looks
like
it's
got
on
the
order
of
hundreds
of
hundreds
of
classes.
What
about
a
project
the
size
of
jenkins
core,
for
instance,
with
probably
thousands
of
classes,
is
this
kind
of
presentation
is
the?
Is
the
coverage
overview
by
package
and
file?
Does
it
shrink
and
and
expand
based
on
the
size
of
the
thing.
B
Yeah,
you
see
here
it's
on
this
part
here
you
only
have
the
blocks
and
I
don't
know
how
it
will
look
like
if
you
are
having
jenkins,
but
we
need
to
try
and
I
never
tried
it
so
I
just
used
it
in
my
projects,
but
maybe
we
need
to.
A
And
now
on
the
coverage
details,
the
search
field
that
you
used
earlier
seems
crucial
to
me
because
frequently,
I
know
I
know
a
specific
class
or
substring
that
I
want
to
be
looking
for
is
that
is
that
a
viable
thing
to
include
in
the
visual
in
the
graphical
presentation
in
the
upper
in
the
in
the
coverage
overview
by
packaging
file
or
not?
Really,
it
doesn't
make
sense
to
do
a
tree
view
of
us
of
a
subset.
A
Oh,
you
mean
here
yeah,.
B
Yeah
this
would
be
an
option
as
well
yeah.
I
I
think
you
have
not
only
this,
I'm
currently
using
a
tree
with
one
root,
but
I
think
one
we
can
place
a.
I
think
it's
called
forest
with
a
lot
of
roots,
and
maybe
we
have
a
filter
with
where
we
select
the
package,
for
instance,
and
show
only
the
package
which
has
been
searched
by.
C
And
yeah,
I
think
that
what
you
were
kind
of
just
talking
about
that
search
feature
on
that
more
visual
one.
It
would
kind
of
aid
in
in
your
bigger
projects
right
like
in
you
know
with
that
one
with
all
the
tiny
little
squares
you
don't
know,
you
know
where
it's
at
you'd
be
searching
quite
a
bit
for
the
one
you're
looking
for
you
probably
know.
C
B
So
maybe
we
show
only
blank
boxes
here,
and
only
the
green
and
red
boxes
are
the
boxes
where
which
have
been
changed
in
a
pull
request,
for
instance
with
something.
A
Else,
yeah,
the
the
delta
coverage
concept
sounds,
sounds
really
challenging
to
me
in
terms
of
presentation,
because
you're
trying
to
you're
telling
me
you're
trying
to
convey
to
me
that
this
pull
request
that
I
just
just
arrived,
had
a
change
from
a
base
branch
right.
So
that's
that's
now.
How
do
you
present
to
me?
Which
things
are
unchanged?
Which
things
went
down
and
which
things
went
when
which
things
improved
wow.
C
Could
it
be
similar?
You
know,
I
know
ides
and
things
like
that
when
you
make
code
changes
right,
they
have
the
compare
view.
It
shows
the
older,
the
older
source
and
the
newer
source,
and
it
has
the
line.
You
know
connections
as
to
what
exactly
changed.
I
think
something
like
that
might
be
useful
to
show
the
delta
view.
A
B
A
Excellent
super
and
I'll
go
ahead,
and
I'm
going
to
put
you
into
the
into
the
contributor
summit
as
a
as
a
topic
to
be
discussed
and
highlight
it
as
new
capabilities
coming
and
hacktoberfest
contribution
interested,
so
that
people
who
are
seeing
it
can
say
if
I
want
to
do
hacktoberfest,
I
should
attend,
and
especially
in
this
case,
it
looks
like
javascript
skills
would
be
a
good
thing
here
and
ui
skills,
so
if
they
want
to
do
ui
things,
this
is
this
is
a
good
place
to
be,
as
opposed
to
not
the
get
plug-in.
A
And
I
think
that
covers
all
the
topics
we
had
given
the
time
that
we're
at
I'm
prone
to
so
we
could
do
pipeline
graph
view
if
you'd
like
I
could
show
quickly
where
it's
at,
but
I'm
not
sure
that
I'm
the
best
demonstrator
of
it,
I'm
happy
to
show
it
jake.
If
you'd
like
to
see
that
we
can.
We
can
do
a
brief
discussion
of
that,
or
we
could
just
call
that
we're
done
for
today
and
and
go
forward.
What's
your
preference.
C
A
Great
julia,
are
you
okay?
If
we?
Yes,
I
already
know
the
few
right.
So
a
demonstration
of
pipeline
graphene
to
you
isn't
much
of
a
help,
so
so
jq
and
I
I'll
take
you
up
separately
and
we'll
we'll
show
it
separately.
Then
that's
fine!
That's
that's
excellent!
Great
uli,
thanks
very
much
for
for
your
work
on
code
coverage.
I
propose
then,
let's
go
ahead
and
call
it
a
close
for
today
and
we
will
we'll
meet
again.
A
We
won't
meet
in
two
weeks
because
that
collides
directly
with
with
devops
world,
but
we
will
meet
again
regular
schedule,
I
believe,
would
now
be
four
or
six
weeks
from
now.
Is
that
right?
Really,
I
think,
six
weeks
so
six
weeks
out
because
we
meet
once
a
month.
We
would
of
course
meet
october
2,
not
as
a
ux
sig,
but
as
part
of
the
contributor
summit.
That's
fine
great!
All!
Right!
Thanks
everybody!