►
From YouTube: GitLab FE - Adding fixtures for generating Startup CSS
Description
In this session, we address adding additional contexts which we'll want to be included during our Startup CSS generation process.
A
But
so
essentially
what
is
happening
is
there's
gonna,
be
a
feature
flag
refactor
of
the
top
nav
search
up
here,
which
is
has
a
lot
of
as
you
imagine,
css
related
to
it,
because
it
responds
to
the
theme
you're
on,
which
is
where
a
lot
of
the
logic
comes
from,
and
so
with
the
feature
flag
since
we're
doing
it.
Iteratively
a
lot
of
the
stuff
is
getting
simplified
because
of
our
gitlab
ui
components
that
this
you
know
isn't
using,
but
essentially
there's
a
couple
changes
here
that
this
is.
A
I
guess
it's
it's
kind
of
hard
to
see,
but
there
is
a
ton
of
css
like
in
these
files
for
the
existing
one,
that
gitlab
ui's
drop
down
kind
of
takes
care
of
for
us,
and
so
what
I
assume
is
happening
is
that,
since
we're
using
a
feature
flag
now
and
our
rs
specs
and
like
our
fixtures,
assume
that
feature
flags
are
enabled
by
default,
which
you
know
this
one
won't
be,
it
ends
up
generating
this
giant.
You
know
change
to
our
startup.
That
is
removing
everything
which
is
you
know
frightening.
B
One
thought
is,
and
I
imagine
we're
doing
the
feature
flag
iteratively,
but
the
question
about
the
feature
flag
is:
what's
gonna
show
up
between
the
time
that
the
html
is
rendered
and
the
javascript
is
executed.
Like
is
the
search
bar
gonna
pop
in
or
do
we
have?
Are
we
rendering
some
sort
of
box
still
there
for
the
search
bar.
A
B
B
So
we
have
a
little
bit
of
duplication
and
our
hammer
underneath
the
element.
That
is
the
view
app
that
we
hook
into.
We
actually
create
the
hammel
just
for
the
button,
so
that
there's
not
a
lot
of
page
jumping.
So
that's
one
like
to
do
just
here
with
the
feature
flag
is
with
the
feature
flag
on.
Ideally
it
would
be
so
fluid
like
of
when
the
the
javascript
kicks
in
or
not
like.
It's
there
shouldn't,
ideally
there's
no
ui
jumping
around
or
anything
right.
That's
a
huge
side
note!
B
Your
instinct
is
completely
correct.
The
feature
flags
are
enabled
by
default
when
we
build
these
fixtures.
So
that's
why
we're
dropping
of
what
we
were
previously
saying.
So
what
I
was
going
to
walk
us
through
was
setting
up
the
fixture
for
both
feature
flag
on
and
off
and
making
sure
that's
included
in
our
startup
world.
B
A
B
B
C
B
That
is
not
what
I
was
looking
for.
There's
the
input
file
somewhere,
create
main,
let's
scroll
up,
html
paths-
oh,
that
must
be
it
yes,
yes,
yes,
yes,
yes,
yep,
so
that
those
are
the
fixtures
we
are
creating
here,
we're
looking
for
so
the
type
I
guess
this
is
a.
This
is
a
shared
function.
We
have
for
creating
the
actual
three
different
types
of
outputs,
the
normal
mode,
dark
mode
and
sign
in
mode
and
so
for
the
normal
mode.
We're
passing
in
on
line
71.
You
see
like
the
type
is
general.
B
A
B
B
Here
we
are
creating
a
shared
example
and
we
have
two
things
actually
are
doing
it,
one
with
the
dark
on
line
54
and
one
with
general
on
line
46,
and
then
we
actually
have
a
separate
one
just
for
the
sign
in
okay,
but
that's
where
we
will
create
one
with
search
flag
on
and
one
with
search,
flag
off
and
line.
33
like
right
below
that
one
like.
A
C
C
B
Well,
I
guess,
since
it's
going
to
be
on
by
default,
maybe
we
want
to
just
do
search
ff
off.
Maybe
that's
the
thing
to
do
because,
tactically,
I
guess
it's
going
to
be
included
in
the
one.
That's
generated
line
24.
so
just
to
back
up
a
second.
Does
it
make
sense?
What
does
it
make
sense
kind
of
what's
going
on
with
the
what
these
end
up
playing
a
role
when
we
generate
the
startup
css.
A
B
And
the
way
it
all
works
is
it
uses
purge
css
and
what
we
take
as
an
input
per
css
takes.
Two
inputs
takes
the
css
large,
the
humongous
css
file,
and
then
it
takes
any
kind
of
source
code,
and
so
what
we're
actually
doing
is
giving
it
these
fixtures
and
we're
giving
it
a
list
of
these
fixtures
saying
here's.
The
big
css
file
only
include
classes
actually
used
by
these
by
these
fixtures,
and
so
we're
gonna
generate
one
with
the
feature
flag
off
so
yeah.
We
just
need
to
do
a
stub.
Yes,.
B
B
These
are
about
so
yes
and
html
has
a
line
50,
that's
the
one,
so
we
have
two
main
outputs,
this
dark
and
the
general
one
and
they
both
use
the
same
kind
of
html
paths.
That's
what's
happening
here
in
line
50.,
so
right
next
to
the
sign
out.
We
just
want
to
copy
and
paste
that
line
and
have
it
reference.
The
new.
B
That
there
yes,
so
then
we
could
choose
to
try
to
generate
all
this
stuff.
Then
locally.
We
could
run
the
fixtures
locally,
we
could
run
the
production
build
locally
and
we
can
run
all
the
scripts
locally,
but
I
highly
recommend
just
committing
this
and
pushing
it
up
and
letting
the
pipeline
run
it
and
tell
you
what
patch
to
apply
okay.
A
B
A
B
B
So
therefore,
we
have
an
ee
startup
css
files
and
we
have
ce
startup
css
files,
but
because
of
the
way
our
pipeline
works,
we
only
get
one
set
of
fixtures
per
pipeline
run
like
so.
If
we
run
karma
fixtures
like
or
we
run
front
end
fixtures,
it's
just
ee
yep.
So
what's
gonna,
what's
gonna
need
to
happen?
B
If
you
change
any
part
of
startup
css,
it's
gonna
trigger
an
as
a
foss
pipeline.
For
so
that
we
can
also
run
the
fast
check
that
we,
if
we
need
to
update
ce-
and
usually
you
need
to
update
both.
So
one
thing
you
could
do
is
with
whatever
patch
that's
generated
here,
just
apply
the
same
patch.
If
you
can
manipulate
the
patch
to
apply
it
to
the
ce
files
or
manually,
make
the
changes
you're
going
to
end
up
having
to
do
it.
A
B
I
think
the
files
are
still
the
exact
same,
they
could
be
different
and
we
did
this
to
optimistically
prevent
breaking
the
foss
build,
but
even
right
now
the
files
are
exactly
the
same.
So
you
could
just
run
this
on
the
ee
files
and
then
probably
just
copy
the
ee
files
over
to
the
ce,
and
that's
probably
the
same.
B
So
all
that's
to
say
if
this
job
fails
and
you
apply
just
this
patch
and
you
push
it
up,
you
might
see
another
pipeline
failure,
but
it's
actually
the
as
if
foss
job
now
failing
because
now
that
job
was
actually
triggered
to
run
because
we
made
startup
css
changes
when
previously
it
wasn't
running.
So
that's
one
thing
that
can
happen,
which
is
a
little
weird.