Home
Contribute Contact Us Browse all meetings
Home Contribute Contact Us Browse all meetings

GitLab / Pair Programming - Frontend

Add meeting Rate page Subscribe

GitLab / Pair Programming - Frontend

These are all the meetings we have in "Pair Programming - F…" (part of the organization "GitLab"). Click into individual meeting pages to watch the recording and search or read the transcript.

22 Sep 2023
In this session, we pair up at pushing forward a contribution to firstissue.dev to show GitLab projects. Thanks so much Marco for starting this PR!
  • 6 participants
  • 1:22 hours
git
gid
github
gitlab
repository
repo
repositories
problems
debug
process
youtube image

18 Aug 2023
In this session we set up an experiment for a redesign on the free trial page.
  • 2 participants
  • 28 minutes
experimenting
experiment
glex
glax
gnarly
glux
gdk
git
installation
glass
youtube image

11 Aug 2023
In this session we deep dive into investigating an environment specific tooltip issue. By the end we actually find the leading contributing cause!

00:00 - Intro
01:50 - Introduce problem
11:05 - Looking into code behind buttons
12:54 - Switching to Mac and testing on .com
20:05 - Testing drawer on gitlab-ui
32:54 - Starting the debugger before tooltip shows
35:35 - WE FIND THE ISSUE!
41:00 - Moment of clarity and summarizing the issue
  • 4 participants
  • 47 minutes
sidebars
sidebar
tooltip
scrolling
margins
tilted
vgltooltip
ui
window
breakpoint
youtube image

4 Aug 2023
In this session we pair up on testing an MR that fixes the artifacts dropdown behavior. We also pair up on mocking the locale module to help with unit test determinism across environments.

00:00 - Testing artifacts dropdown contribution
18:30 - Mocking locale modules

- https://gitlab.com/gitlab-org/gitlab/-/merge_requests/128531
  • 4 participants
  • 56 minutes
pipeline
artifact
processing
issue
hmm
project
updated
testing
finished
git
youtube image

7 Jul 2023
In this session we discuss ways we can improve writing issues so that they can assume less context and be better picked up by the wider community.
  • 3 participants
  • 48 minutes
implementation
functionality
planning
problematic
needs
maintenance
workflow
bug
thinking
git
youtube image

16 Jun 2023
In this session we pair up on pushing an achievements MR and evaluating some approaches with the upcoming DateToken in FilteredSearch component.

00:00 - Discussing achievements MR
22:26 - Working on DateToken in FilteredSearch
  • 3 participants
  • 49 minutes
nitpicky
updated
glitchy
patch
achievements
gdk
button
issue
ai
tag
youtube image

19 May 2023
https://gitlab.com/gitlab-org/gitlab/-/merge_requests/120160
  • 4 participants
  • 50 minutes
date
filter
milestones
dashboard
selectable
validation
merge
reread
mr
gltl
youtube image

5 May 2023
In this session we pair up in replacing an existing component to use gl-form-fields.

00:00:00 - Intro talking about gl-form-fields and possible usage in Achievements
00:05:45 - Start working on admin_emails_form.vue

https://gitlab.com/gitlab-org/gitlab/-/merge_requests/119789
  • 6 participants
  • 1:08 hours
project
form
users
difficult
geoform
ui
query
helper
starting
crn
youtube image

28 Apr 2023
In this session we engage in a bit of discussion about the ideal user experience / maintainability of resolving TODO's and updating the relevant count.
  • 4 participants
  • 1:15 hours
updated
manipulation
ui
refactoring
managements
recalculated
mark
mr
demoing
toggling
youtube image

21 Apr 2023
In this session we pair up on finishing up gl-form-fields.

00:00 - Intro
03:15 - Discussing purpose of gl-form-fields
05:50 - Discussing what to do with shared validators and mappers
13:50 - Commenting about appropriate usage
25:15 - Writing a validator factory and tests
46:11 - Discuss persisting extension configuration in VSCode Web IDE
  • 4 participants
  • 60 minutes
submissions
form
users
validations
problems
commits
message
tag
ready
gitlab
youtube image

14 Apr 2023
In this pair programming session we work even more on wrapping up gl-form-fields.
  • 4 participants
  • 45 minutes
validators
validate
validator
validation
valid
testing
ready
issue
documenting
brew
youtube image

31 Mar 2023
In this paring session we work on configuring Jest to properly detect what tests to run when an HTML fixture changes in a pipeline.

00:00 Detecting tests to run based on fixture changes
33:00 Working on tests with cookie expirations
  • 4 participants
  • 1:09 hours
fail
pipelines
issue
specs
maintainer
implementation
advanced
mmr
debugging
ci
youtube image

10 Mar 2023
In this session we pair on an issue with modals for a timetracking MR and showing visible forks for the Web IDE button.

00:00 - Question about lifecycle of modals
11:06 - Displaying visible forks with Web IDE button
  • 3 participants
  • 1:14 hours
initialization
initialized
initializes
initialize
modal
modify
forkmodal
time
estimated
intuitively
youtube image

8 Mar 2023
In this session we discuss the kind of API we'd like for an `init_vue_app` helper.

00:00:00 - Discussion issue scope of initializing Vue apps
00:03:43 - Introducing what was recently introduced
00:08:00 - Discussing idea of removing JavaScript side of glue code
00:31:00 - Start working on the rails-side helper
00:44:00 - Discussion provide vs. props preference
01:01:00 - Looking into providing and propping everything
01:15:30 - Testing out the changes
  • 6 participants
  • 1:22 hours
implementation
bootstrapping
interfaces
backend
helpers
app
proposing
issue
reusability
repo
youtube image

24 Feb 2023
In this session we resurrect an old MR to introduce a component `form-fields` which will encapsulate creating a design compliant form.

- https://gitlab.com/gitlab-org/gitlab-ui/-/merge_requests/2586
  • 9 participants
  • 1:21 hours
form
functionality
validation
component
submission
frontenders
fields
api
thread
gitlab
youtube image

10 Feb 2023
In this session we dive into polishing up a contribution to untamper-my-lockfile for Yarn2 support.

00:00 - Discussion about top-level folders
02:55 - Question about where to put "~/flash.js" or "~/alert.js"
07:04 - Question about "template" around "slot" in Vue
13:30 - Pairing on the untamper-my-lockfile MR
16:59 - Paul finally starts sharing his screen
19:42 - Let's TDD!
  • 3 participants
  • 34 minutes
domain
folder
architectures
lib
packages
structure
v1
gitlab
simplifying
ui
youtube image

3 Feb 2023
In this session we explore some approaches to creating an action for a Toast popup, and discuss an MR that adds Yarn2 support to our untamper-my-lockfile script.

0:00 - Creating an action in a toast popup
17:32 - Yarn2 support for untamper-my-lockfile

https://gitlab.com/gitlab-org/frontend/untamper-my-lockfile/-/merge_requests/38
  • 4 participants
  • 37 minutes
router
link
views
toast
ui
issue
timeline
request
meta
chat
youtube image

27 Jan 2023
00:00 - Discussing lack of "Checkout branch" feature in new Web IDE
04:52 - Picking an issue to pair on
08:38 - Discussing ChatGPT
18:00 - Fix error thrown when "Mark as ready" clicked
  • 3 participants
  • 50 minutes
workflow
editing
tweaks
commit
web
version
oversight
discussion
debug
gitlab
youtube image

6 Jan 2023
In this session we discuss some approaches and tradeoffs to persisting the Apollo cache on the clientside.

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/106004
  • 3 participants
  • 50 minutes
cache
persisting
refresh
processed
fetching
apollocation
selectively
smart
manage
upgrade
youtube image

25 Nov 2022
In this session we dive into reimplementing BrowserFS's OverlayFS for the Web IDE Remake.
  • 3 participants
  • 57 minutes
rework
tweaking
implementation
interfaces
deploying
threads
repository
web
vb
commit
youtube image

28 Oct 2022
In this session we talk about controlling the number of Apollo Clients rendered per page, and we write a Vue component test.

0:00 - Discussion about Apollo Clients
13:30 - Chatting
18:30 - Pairing on a Vue component test
  • 5 participants
  • 60 minutes
resolvers
maintainable
workflows
views
interface
mergeable
github
client
cache
issue
youtube image

21 Oct 2022
In this session we discuss the existence of our Startup CSS behavior and work on resurrecting an MR to introduce a "/pipeline" quick action.

- https://gitlab.com/gitlab-org/gitlab/-/issues/210538
- https://gitlab.com/gitlab-org/frontend/rfcs/-/issues/92

0:00 - Discuss Startup CSS
4:50 - Discuss and pair on "/pipeline" quick action
  • 2 participants
  • 47 minutes
compromise
decision
discussion
thinking
css
approval
having
milestone
fairly
finished
youtube image

30 Sep 2022
In this session, we work on fixing some rspecs and jest specs.
  • 3 participants
  • 59 minutes
error
helper
testing
showing
session
gitlab
redesign
configure
autism
login
youtube image

23 Sep 2022
In this sesison, we work on some complexities involving using the dropdown component triggered by a text input.

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/97343
  • 8 participants
  • 1:01 hours
scrolling
functionality
interface
navigation
editing
highlighting
input
reevaluating
iterations
selectors
youtube image

16 Sep 2022
In this session we visit an MR that replaces a `visitUrl` call with a regular ol' `href`. We also discuss the challenges of tracking link clicks.

- https://gitlab.com/gitlab-org/gitlab/-/merge_requests/97601#note_1102331961
  • 3 participants
  • 57 minutes
snowplow
navigate
clicks
users
tracker
push
hyperlinks
redirects
handlers
revisiting
youtube image

9 Sep 2022
In this session we discuss at a high level the tradeoffs of different approaches to showing code quality warnings in MR diffs. We also show some helpful CSS classes at center aligning icons.
  • 3 participants
  • 54 minutes
nitpicky
icons
debug
appears
bar
pleasing
versions
editor
centering
discussion
youtube image

2 Sep 2022
In this session we dive into how we can adjust our top nav ViewModel builder to satisfy some new UX requirements.
  • 3 participants
  • 1:04 hours
reorganize
dashboards
headers
menu
view
interface
navigation
editor
selectors
nested
youtube image

19 Aug 2022
In this session we dived into writing fixtures to replace hard coded graphql responses in Frontend specs.

Thumbnail: AI-generated by DALL-E. Thanks DALL-E!
  • 2 participants
  • 1:05 hours
fixture
graphql
schedule
annotation
doing
rspec
rails
project
query
linter
youtube image

12 Aug 2022
In this short FE pairing session, we pair up on a task around writing capybara tests for a button.
  • 2 participants
  • 22 minutes
testing
jquery
button
functionality
loading
toggling
css
debugger
comments
executescript
youtube image

5 Aug 2022
In this session, we resurrect an old MR to introduce a reusable Vue component that encapsualtes some common logic about form fields.

MR: https://gitlab.com/gitlab-org/gitlab-ui/-/merge_requests/2586
  • 5 participants
  • 54 minutes
model
component
form
presenting
revalidation
implementation
validations
thinking
maintainer
submitted
youtube image

29 Jul 2022
In this session we talk about webpack bundles, fix emoji popups, and then talk about organizing feature specs.

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/93572

00:00:00 - Question about webpack bundles and MR's that remove dependencies
00:07:40 - Exploring is-this-known slack channel
00:17:40 - Fixing emoji autocomplete with leading space
00:50:45 - Question about rspecs with shared contexts
  • 6 participants
  • 1:16 hours
processing
packages
merge
reviewing
significant
cleanup
version
rebase
bot
metadata
youtube image

22 Jul 2022
In this session we work on making some apollo specs pass and talk about feature specs for the login page.

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/92111
  • 4 participants
  • 1:11 hours
staging
query
testing
model
create
process
error
tweaking
natalya
responsify
youtube image

21 Jul 2022
In this session we show that changes in an earlier MR fix local webpack issues in the capybara test environment. But! For some reason these changes were accidentally reverted by a completely unrelated MR :|

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/93043
  • 2 participants
  • 5 minutes
loading
async
chrome
confirm
fail
debug
commit
okay
showing
expecting
youtube image

15 Jul 2022
In this session we continue with fixing the autocomplete cancel with "ESC" by addressing some testing concerns and fixing the issue for other types of autocomplete.

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/91829
  • 3 participants
  • 1:03 hours
add
gitlab
helper
fixing
gfm
menu
editing
session
command
issue
youtube image

8 Jul 2022
In this session we investigate solutions to an issue with ESC triggering the "Cancel comment" modal, when it should just trigger canceling the emoji dropdown.

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/91829
  • 5 participants
  • 1:08 hours
emoji
listeners
triggering
chat
annoying
handlers
ui
commenting
prevent
mousetrap
youtube image

1 Jul 2022
In this session we finish rewriting an old Vue spec to use VTU and follow testing best practices.

Part 1: https://youtu.be/B_-NBSdFn6s
MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/91603
  • 2 participants
  • 1:53 hours
helpers
refactoring
testing
setup
maintain
workflow
implementation
prop
showing
gitlab
youtube image

1 Jul 2022
In this session we try to "leave the code better than we found it" by rewriting an old Vue spec to use VTU and follow testing best practices.

Part 2: https://youtu.be/mjyBU2dD3a0
MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/91603
  • 4 participants
  • 36 minutes
testing
private
methods
internals
vutas
views
rewriting
practice
consider
scopes
youtube image

19 Nov 2021
0:00:00 - Discuss CRM features
0:30:45 - Working on the confirm_modal refactoring
  • 5 participants
  • 1:18 hours
users
microsoft
manage
server
cyber
apps
query
concerns
editing
getting
youtube image

8 Oct 2021
An experiment with running UI parts of the Source Editor extensions externally in the Vue compoenents.
  • 11 participants
  • 2:13 hours
editing
session
brainstorming
enrique
discussion
project
advanced
anticipating
managed
proposals
youtube image

10 Sep 2021
In this session we work on finishing up the "Table of Contents" Content Editor extension.

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/68210
  • 2 participants
  • 35 minutes
algebra
thinking
programming
iterate
help
lab
solving
interesting
computationally
fibonacci
youtube image

13 Aug 2021
In this session we pair up on adding a "Table of Contents" extension to GitLab's new WYSIWYG Content Editor.


Issue: https://gitlab.com/gitlab-org/gitlab/-/issues/338270
MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/68210
  • 7 participants
  • 52 minutes
gitlab
markdown
epic
editing
flavor
tiptap
rendering
contaminator
content
specification
youtube image

30 Jul 2021
In this session we pair program on a preexisting MR around improving MutationObserver's in our Jest test environment. We then pair on fixing a bug around usernames with special characters in MR assignees.

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/67250
  • 5 participants
  • 1:03 hours
observers
gitlab
mac
bugging
jsdom
screenshot
mockumentation
fail
helper
upgrade
youtube image

4 Jun 2021
In this session we pair up on creating a Danger rule for a recently added job with a quirk. Here's the MR we worked on https://gitlab.com/gitlab-org/gitlab/-/merge_requests/63234
  • 5 participants
  • 59 minutes
dangerbot
scripts
locally
dangerous
logging
plugins
underscore
helper
warn
execute
youtube image

14 May 2021
In this pairing session we push this MR forward a bit:

https://gitlab.com/gitlab-org/gitlab/-/merge_requests/61635
  • 8 participants
  • 1:28 hours
git
puppeteer
css
manually
asynchronously
downloaded
script
execute
tasks
jig
youtube image

9 Apr 2021
In this session we fix a bug where the "Sign out" button does not work on our 404 and 403 pages.


Issue: https://gitlab.com/gitlab-org/gitlab/-/issues/322980
MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/59030
  • 3 participants
  • 43 minutes
gitlab
logged
button
submits
helper
access
hey
verification
login
commit
youtube image

9 Apr 2021
Javier Garcia and Tyler Williams from the Digital Experience team do pair programming to address accessibility concerns in the Slippers navigation component.

Link to MR: https://gitlab.com/gitlab-com/marketing/inbound-marketing/slippers-ui/-/merge_requests/55
  • 3 participants
  • 44 minutes
accessibility
navigationw
view
ui
concerns
redesign
scrolling
display
browser
toggle
youtube image

26 Mar 2021
In this session we pick up on an old effort and flesh out a helper that adapts graphql-mock-factory. This helper will enable us to remove a lot of duplication caused by creating mock data **and** improve the strength of our tests since it's all based on the schema.

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/57629/
graphql-mock-factory: https://www.npmjs.com/package/graphql-mock-factory
  • 5 participants
  • 1:18 hours
rebase
mockresolved
schema
generated
graphql
repo
iterative
dynamically
implementation
suspicious
youtube image

12 Mar 2021
In this pairing session we look at simplifying some observable creation used for a new spam capturing apollo link!

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/56190
  • 3 participants
  • 54 minutes
backend
retur
filter
stuff
graphql
configured
log
helper
debug
edit
youtube image

5 Mar 2021
In this video we write a unit test for an ApolloLink we've written to interface with rails action cable.

00:00 - Start!
05:00 - Paul starts sharing his screen :|

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/43333#note_523177396
  • 7 participants
  • 60 minutes
subscribed
observables
project
analysis
repo
rxjs
helper
luca
cable
debug
youtube image

8 Jan 2021
In this session we replace a usage of `deprecated_modal_2.vue` with our `@gitlab/ui` modal.

Resulting MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/51227
  • 6 participants
  • 52 minutes
deprecated
milestones
modal
bootstrap
dashboard
reviewing
prototype
rework
enables
ujs
youtube image

11 Dec 2020
In this session we try to debug a failing feature spec of an MR that attempts to replace jQuery scrolling with DOM based scrolling.

MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/43167
Test: `spec/features/merge_request/user_interacts_with_batched_mr_diffs_spec.rb`
  • 10 participants
  • 1:22 hours
scrolling
debugging
moved
skip
worries
refresh
webpack
slim
server
push
youtube image

1 Dec 2020
We were running into a weird Vue warning which was hiding the expected Jest failure. It turns out that some magical prop `_withStripped` which .vue compiles to is related!


Related branch: https://gitlab.com/gitlab-org/gitlab/-/tree/ps-recreate-pretty-print-issue
  • 2 participants
  • 15 minutes
render
template
behavior
dom
error
view
js
implementation
tests
component
youtube image

20 Nov 2020
In this session we were excited to have Lee Tickett a member of our Core Team bring up an issue and join our pairing session.
Issue: https://gitlab.com/gitlab-org/gitlab/-/issues/225291
MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/48261
Core Team: https://about.gitlab.com/community/core-team/
  • 5 participants
  • 52 minutes
issue
git
worthwhile
support
flagging
users
warning
doubting
gnarly
message
youtube image

18 Nov 2020
In this session we try to tackle a issue where some feature specs are taking a long time by moving them to feature integration specs.


Issue: https://gitlab.com/gitlab-org/gitlab/-/issues/282436
MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/48074
  • 4 participants
  • 59 minutes
feature
backend
testing
safety
refactoring
specs
ide
editors
integrations
ahead
youtube image

13 Nov 2020
In this pairing session we work through some strange behavior that appeared when writing tests for a Vue component using a custom resolver.

Related issue: https://gitlab.com/gitlab-org/gitlab/-/issues/282440
Related docs: https://www.apollographql.com/docs/react/local-state/local-resolvers/
Related upstream issue: https://github.com/vuejs/vue-apollo/issues/636
  • 9 participants
  • 1:06 hours
resolvers
graphql
local
concerns
repository
debugging
endpoint
resolved
fetches
mapping
youtube image

30 Oct 2020
In this session we tackle moving a Vue template that was being written in HAML over to a Single-File-Component.


MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/46569
  • 4 participants
  • 50 minutes
programming
control
users
ide
inspecting
view
maintain
ui
issue
component
youtube image

2 Oct 2020
In this video we move some the merge conflict specific styles out of the main CSS to a page specific CSS.


https://gitlab.com/gitlab-org/gitlab/-/merge_requests/44168
  • 7 participants
  • 54 minutes
workflows
project
css
editing
browsers
pagemental
significantly
codebase
markup
themes
youtube image

25 Sep 2020
In this video we discuss a lot about optimizing Webpack bundling chunks and observe that GraphQL is being loaded in every page specific chunk.

Here's the resulting MR:
https://gitlab.com/gitlab-org/gitlab/-/merge_requests/43421
  • 4 participants
  • 1:00 hours
size
merge
chunks
configuration
megabytes
download
edit
huge
bundles
max
youtube image

18 Sep 2020
In this pairing session we walk through reviewing some MR's together.

00:00:00 - Start
00:01:07 - Start reviewing ["Remove unused HAML"][1]
00:15:30 - Create [follow-up MR][2]
00:19:30 - Start reviewing ["Add info_line"][3]
00:48:45 - Start reviewing ["test for vscode extension"][4]

[1]: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/42210
[2]: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/42713
[3]: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/42443
[4]: https://gitlab.com/gitlab-org/gitlab-vscode-extension/-/merge_requests/97
  • 4 participants
  • 1:16 hours
deleting
debugging
templates
editor
workflow
maintenance
merge
views
reviewing
registry
youtube image

11 Sep 2020
In this video we pair on grokking some unusual API requests that also return JavaScript. We also discuss the best approach of unraveling this complexity.
  • 6 participants
  • 48 minutes
asynchronous
fetching
weird
maintainability
ujs
executed
pinged
reloads
ajax
request
youtube image

24 Aug 2020
We continued working on: https://gitlab.com/gitlab-org/frontend/jest-speed-reporter
  • 4 participants
  • 1:48 hours
git
api
dependencies
axios
repository
bootstrapping
setup
webpack
docker
vlog
youtube image

24 Aug 2020
In this session we start looking into a GitLab CI solution to generate a report for slow Jest tests.

Part 2: https://youtu.be/BgFLT4oOwa8
Result: https://gitlab.com/gitlab-org/frontend/playground/jest-speed-reporter/
  • 8 participants
  • 43 minutes
ci
gitlab
project
querying
coverage
junit
scripts
maintainers
docs
processing
youtube image

13 Aug 2020
In this impromptu pairing session, we walk through writing a component unit test from scratch using a common approach and techniques.
  • 6 participants
  • 1:60 hours
implementation
testing
tweaking
package
unit
complicated
spec
import
configuration
section
youtube image

5 Aug 2020
In this pair session we talked about what to do with the remaining karma specs, and also started working on moving a [`tooltip_on_truncate`][1] component to [`gitlab-ui`][2].

0:00:00 - Intro to the problem
0:00:30 - What to do with balsamiq_viewer_browser_spec.js?
0:02:05 - What to do with lib/utils/browser_spec.js?
0:19:10 - What to do with dashboard_resize_browser_spec.js?
0:29:20 - What to do with tooltip_on_truncate_browser_spec.js?
0:31:50 - Let's start moving tooltip_on_truncate component!

[1]: https://gitlab.com/gitlab-org/gitlab/blob/c43156cd927a0010edc1f68e87cf75d73cb8ab89/app/assets/javascripts/vue_shared/components/tooltip_on_truncate.vue#L1
[2]: https://gitlab.com/gitlab-org/gitlab-ui/-/merge_requests/1614/
  • 6 participants
  • 1:07 hours
ported
toolkit
browser
backend
monitoring
project
previews
specs
scan
loads
youtube image

23 Jul 2020
In this frontend pairs session, we investigate why writing tests that use the Toast UI dependency fail in jest. We discovered that we could remove some DOM API stubs because JSDOM already provides those APIs in the currrent version. We also had to stub others like some methods in the DOMRange class.
  • 8 participants
  • 53 minutes
renderers
testing
toast
editor
ui
mark
tweak
dangerbot
thread
browser
youtube image

23 Jul 2020
There's an awesome community contribution MR which introduces WebAuthn support. In this video we hop on and test some interesting cases of this MR together :) https://gitlab.com/gitlab-org/gitlab/-/merge_requests/26692

- 17:40 interesting bug found when user has U2F device but the webauthn feature flag is on, the user is locked out 😱
  • 3 participants
  • 28 minutes
authentication
login
authenticator
signing
key
checking
user
registration
yubikey
support
youtube image

17 Jul 2020
Revert MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/37131
Feature spec MR: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/37136
  • 7 participants
  • 1:09 hours
typing
keydown
frustrating
commenting
thread
tabs
input
keyboard
fixes
smr
youtube image

17 Jul 2020
In this pairing session we create an eslint rule to detect that `off(...)` and `$off(...)` are never called with less than 2 arguments.
https://gitlab.com/gitlab-org/frontend/eslint-plugin/-/merge_requests/19
  • 2 participants
  • 31 minutes
rules
bootstrap
stu
generates
specifying
testing
maintainer
eslint
script
package
youtube image

16 Jul 2020
Issue: https://gitlab.com/gitlab-org/gitlab/-/issues/228729


In this video we try to find a commit that might have fixed this issue using `git bisect` and the power of binary search!
  • 5 participants
  • 1:15 hours
bisect
git
fixes
tricky
commits
hashes
hacked
newbie
gosh
repository
youtube image

14 Jul 2020
Result: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/33189#note_377446537
  • 4 participants
  • 50 minutes
version
screenshots
workflow
facebook
views
maintain
dashboards
ui
features
updated
youtube image

6 Jul 2020
No description provided.
  • 3 participants
  • 32 minutes
prepend
labels
problematic
breakpoint
configure
app
refactor
tip
margin
programming
youtube image

3 Jul 2020
Can we use Miragejs to replace a layer of our backend in GitLab and run frontend integration tests faster? Let's find out via the Web IDE!

https://miragejs.com/
  • 5 participants
  • 1:02 hours
backend
mock
debugging
workflow
api
testing
endpoint
startup
fail
thinking
youtube image

27 Jun 2020
Here's the issue we looked into https://gitlab.com/groups/gitlab-org/-/epics/3694

Here's the resulting MR of this https://gitlab.com/gitlab-org/gitlab/-/merge_requests/35436


0:00 - Jean introduces the issue that GitLab places all page specific styles in the application.scss
3:50 - Do we have anything set up to actually load page specific styles?
5:40 - Nope. It's just one big file.
8:00 - Laying out options and planning next steps
11:50 - Let's start doing this in Webpack with scss-loader
18:20 - We start adding the webpack rule after installing the loader packages
23:20 - Nico starts trying to test it out but the GDK fails for him
32:24 - Jose gracefully takes over and applies Nico's patch
36:20 - Jose creates the missing test.scss and tests it out in local gdk
40:00 - We run into a webpack error and fix it by fixing the regex in another rule
42:00 - Paul tries to sell parcel while we're waiting for webpack
43:00 - It works! Now what is webpack actually doing?
46:45 - We realize how webpack is doing this by inlining styles and there's some problems, and plan on using a mini-css-extract-plugin
53:00 - We look at webpack_helper.rb which is where we load page specific javascript
57:30 - Paul hops off for a second and we load the css extract plugin
1:01:30 - We try to ping the webpack development folder to see what the plugin did
1:07:30 - We talk about Jose's 32 GB of memory
1:12:50 - `webpack-prod` finally finishes and we check out the results
  • 4 participants
  • 1:19 hours
discussed
plan
improvement
concerns
creating
page
documentation
ideas
project
inspect
youtube image

5 Jun 2020
**Result:**
- https://gitlab.com/gitlab-org/gitlab/-/merge_requests/33973


**Highlights:**
- 0:00 Eipi explains the problem and current debugging approaches
- 7:45 Eipi shows how he's been investigating memory issues
- 25:00 Eipi has to hop off but we were so close to seeing what was blowing up
- 30:00 Paul starts saving a memory snapshot locally and praises Demoscene while ranting about JavaScript
- 36:00 We start looking at the snapshot and aren't sure what "shallow size" vs. "retained size"
- 37:50 After researching we summarize what it means for us to have a huge gap between "shallow size" and "retained size"
- 53:30 Start on the fix with 5 minutes before Nico has to hop off
- 1:06:20 Summarizing our effort
  • 5 participants
  • 1:09 hours
memory
problems
rerun
realizing
commit
mocked
debugging
execution
jason
gone
youtube image

22 May 2020
- https://gitlab.com/groups/gitlab-org/-/epics/895
- https://gitlab.com/gitlab-org/gitlab/-/merge_requests/32869
  • 6 participants
  • 50 minutes
problems
migrate
takes
review
ahead
thinking
okay
pass
karma
having
youtube image

15 May 2020
**Result:**
- https://gitlab.com/gitlab-org/gitlab/-/merge_requests/32086
- https://gitlab.com/gitlab-org/gitlab/-/merge_requests/32336


**Highlights:**
- 3:00 Debugging differences between Karma environment and Jest environment
- 28:10 Lets keep this spec in Karma since it seems dependent on browser environment
- 33:20 We start on a new task of finishing up migrating lib/utils directory
  • 4 participants
  • 1:00 hours
mount
problems
dashboard
adding
loading
mock
testing
throughput
bumping
mounting
youtube image

8 May 2020
**Result:**
- https://gitlab.com/gitlab-org/gitlab/-/merge_requests/31481
- https://gitlab.com/gitlab-org/gitlab/-/issues/217140


**Highlights:**
- 1:38 Where does this 5000ms timeout come from?
- 6:00 Start running the spec.
- 13:10 Considering if something like debounce is the issue, we review what debounce actually means.
- 16:00 Some discussion on integration vs. unit tests
- 25:50 Summarizing options discussed
- 29:10 What do we think of ad-hoc bumping the test timeout
- 30:30 We start slicing away to discover what's taking a long time
- 38:20 We start to see some improvement!
- 44:38 Summarizing the problem and approach again
- 45:30 We finalize our solution to fix the spec, but mounting lots of epics is still slow
- 49:00 We start exploring what parts of the component are slow
- 54:30 We talk about profiling in production as opposed to the test environment
- 57:57 We summarize some key takeaways
  • 6 participants
  • 59 minutes
slowness
timeouts
testing
specs
milliseconds
speed
delay
ci
optimize
iterative
youtube image

7 May 2020
No description provided.
  • 5 participants
  • 1:04 hours
testing
mvc
sync
apollo
preparations
demo
log
timelock
loading
mock
youtube image

30 Apr 2020
**Result:**
Here's the resulting MR from the first part of the session https://gitlab.com/gitlab-org/gitlab/-/merge_requests/30859


**Highlights:**
00:20 - We start on a spec which is in the middle of being migrated to Jest
17:30 - We talk about the challenges of the codemod to replace setImmediate with setTimeout.
27:00 - We start on migrating `ide/actions_spec`
27:45 - Migrating `spyOnDependency` calls from Karma to Jest
33:30 - We run into a really wild issue where actions passed to the Vuex store are null
47:50 - We are still trying to debug this issue...
52:45 - We are getting pretty close and realize there is a circular dependency between the Vuex store modules and the router
53:50 - We find another piece of the puzzle that the router won't work because we mocked the entire utility module in the spec
59:10 - We retro the problem and discuss the better pattern of exporting store options vs. an actually built store
  • 6 participants
  • 1:07 hours
render
checked
onclick
endpoint
trigger
exposes
pass
tessie
implementation
finished
youtube image

24 Apr 2020
**Result:**
https://gitlab.com/gitlab-org/gitlab/-/merge_requests/30398


**Highlights:**
- 03:20 We get started but run into some issues with merging directories in bash
- 06:30 We decide to move files to `ide_new` to get started on actually converting things to Jest
- 13:20 We fix some web worker stuff by introducing a shared mock
- 23:50 We uncover a spec that was dependent on unrelated Karma specs running first
- 46:20 We write a code mod for converting import aliases
- 53:40 We figure out why our codemod was erroring which wasn't our codemod after all
  • 3 participants
  • 57 minutes
ide
slice
scripts
scary
editing
suggest
themes
bit
explorer
helper
youtube image

17 Apr 2020
**Result**
https://gitlab.com/gitlab-org/gitlab/-/merge_requests/29796


**Highlights:**
- 3:20 We dive into updating our codemod to support renaming import aliases
- 11:30 We fix our issue we ran into while trying to update the codemod
- 17:30 We run into an issue with a spec that's testing the behavior of debounce but debounce is mocked in our environment
- 26:30 End of discussing best way to test debounce in this environment, but opt for moving on
- 29:00 We run into a spec that is outdated and references a non-existent prop
- 42:00 We run into a spec that tests an unused spec
  • 8 participants
  • 1:18 hours
modified
exodus
shared
okay
moved
helpers
commit
vm
paul
rethink
youtube image

13 Apr 2020
**Result:**
https://gitlab.com/gitlab-org/gitlab/-/merge_requests/27120

**Description:**
This pairing session's goal was to fix a pipeline failure for an old Jest migration MR. It turns out that the Karma specs were bumping into each other. Rather than dissecting how to fix the antiquated Karma spec, we opt to just move it to Jest right away.

**Highlights:**
1:20:00 - Retrospective and ideas on improving this huge spec (spoiler: attack the component)
  • 7 participants
  • 1:27 hours
rebasing
pipeline
problems
debugging
commits
processes
log
ahead
finished
fixing
youtube image

3 Apr 2020
Result: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/28807

Some highlights:

8:10 - We update our global afterEach from runAllTimers to runOnlyPendingTimers
11:54 - We talk about Paul's personal preference against mocking
14:50 - Eipi joins and we summarize the problem
25:30 - We mock debounce for the spec
26:15 - Product placement by Ikea
26:35 - Eipi solves the problem
  • 4 participants
  • 47 minutes
specs
fail
testing
runs
timers
process
speck
karma
helpers
careful
youtube image

27 Mar 2020
Here's the resulting MR from this session:
- https://gitlab.com/gitlab-org/gitlab/-/merge_requests/28223


Near the end, we run into a really weird issue where a textarea is not updating like we expect. After hopping off the call, this was fixed. It looks like there was an accidental insertion where we returned `$nextTick` *and* used `done` which caused some timing issues 🤷‍♀️
  • 6 participants
  • 1:14 hours
commit
java
editor
backend
justin
disks
notes
migrates
downloaded
configuration
youtube image

26 Mar 2020
**Result:**
https://gitlab.com/gitlab-org/gitlab/-/merge_requests/27691#pinning-tests

**What's a pinning test?**
https://wiki.c2.com/?PinningTests

It's a "temporary" snapshot test to pin down behavior that gives you confidence in refactoring. The book Working Effectively with Legacy Code explains it best.

**Does GitLab not have good enough test coverage?**
We are committed to good test coverage (at all levels of testing) and improving this every release, but tests can't prove the absence of bugs (only the presence of them). Whether there is or isn't existing test coverage, adding a pinning test (which doesn't take long) can further help us refactor confidently and quickly.
  • 8 participants
  • 1:23 hours
capybara
snapshots
renders
view
obviously
capturing
hamel
screen
batch
head
youtube image

20 Mar 2020
0:00 - We start exploring the problems with [migrating these specs to Jest][1]
11:00 - We realize there's some bigger problems and start migrating [a HAML template][2] to [Vue SFC][3]

[1]: https://gitlab.com/groups/gitlab-org/-/epics/895
[2]: https://gitlab.com/gitlab-org/gitlab/-/blob/83a67aaa4945cef5d45be330b0aeea68fe524bf6/app/views/shared/boards/components/_board.html.haml
[3]: https://vuejs.org/v2/guide/single-file-components.html
  • 5 participants
  • 56 minutes
views
issue
port
maintainer
template
boards
loaded
workflow
project
accessing
youtube image

13 Mar 2020
Here's the Jestodus epic:
- https://gitlab.com/groups/gitlab-org/-/epics/895

Here's our jestodus-codemod project:
- https://gitlab.com/gitlab-org/frontend/playground/jestodus-codemod


Here's the MR we made :)
- https://gitlab.com/gitlab-org/gitlab/-/merge_requests/27234
  • 7 participants
  • 1:22 hours
karma
commit
driving
anyways
helpers
damn
patch
review
contribute
issue
youtube image

15 Jan 2020
Result: https://gitlab.com/gitlab-org/gitlab/merge_requests/22553#note_272090432
  • 6 participants
  • 27 minutes
setup
gdk
helper
hacky
okay
problem
planning
pushing
comments
thinking
youtube image

16 Dec 2019
Presented by Rea Loretta, CEO at Toast

The GitHub API is a key part of accelerating workflows at scale. This session will leave you with tactical tips for how to paginate effectively, create and plan queries, use tech-preview features, and manage costs learned from years of practice and iteration at Toast and beyond.

About GitHub Universe:
GitHub Universe is a two-day conference dedicated to the creativity and curiosity of the largest software community in the world. Sessions cover topics from team culture to open source software across industries and technologies.

For more information on GitHub Universe, check the website:
https://githubuniverse.com
  • 1 participant
  • 31 minutes
github
insights
workflows
graph
concerns
api
advanced
getup
repository
slack
youtube image

22 Oct 2019
Do calls to `offsetWidth` always force a layout recalculation, even in ResizeObserver callbacks? Let's find out!

- Originating comment:
https://gitlab.com/gitlab-org/gitlab-ui/merge_requests/810#note_231406426

- Relevant Firefox source code:
https://dxr.mozilla.org/mozilla-central/rev/d42c22627c8dee9e9286fd5d7bbc3d02afbfad44/dom/base/Element.cpp#931

- Resulting experiment (with clean up):
https://codesandbox.io/s/peaceful-gates-47rnl?fontsize=14
  • 3 participants
  • 1:02 hours
resizer
observing
mozilla
size
resizing
rendering
observer
compare
updated
client
youtube image

17 Oct 2019
In this video we work on fixing some violations with using vue-test-utils and Karma that can cause weird flaky issues.

Related issue:

https://gitlab.com/gitlab-org/gitlab/issues/32213#note_231967347
  • 4 participants
  • 38 minutes
karma
views
issue
naive
debug
reps
stuff
thinking
testy
tales
youtube image