Debugging Apollo iOS
with
Apollo Client Developer Tools
@manicmaniac
Slide 2
Slide 2 text
Ryosuke Ito
• iOS software engineer
• Working for Quipper Ltd.
@manicmaniac
Slide 3
Slide 3 text
I’ve written a blog post related to this slide.
https://bit.ly/2Y1sUDv
Slide 4
Slide 4 text
ى
What’s Apollo iOS?
Slide 5
Slide 5 text
No content
Slide 6
Slide 6 text
Strongly typed
Apollo generates Swift source code from query definitions (.graphql)
Slide 7
Slide 7 text
query {
posts {
id
title
author {
name
}
}
}
query {
posts {
title
}
}
Smart cache
If you already have queried You can query in cache
• Even without Internet!
• Even selections changed!
ˠ
Slide 8
Slide 8 text
ঝ
What’s difficult?
Slide 9
Slide 9 text
Networking is opaque
There was no convenient way to see each query and
its response.
Fortunately Apollo introducedHTTPNetworkTransportDelegatesince0.15.0
https://github.com/apollographql/apollo-ios/pull/257
But we still need some configurations to see them.
Slide 10
Slide 10 text
Cache is opaque
There’s no convenient way to see the cache tree.
Slide 11
Slide 11 text
Hard to debug
• We need a debugger to know the internal state of Apollo.
• We need frequent communication with server-side developers.
Slide 12
Slide 12 text
Web devs: When does the app perform this query?
Me: Ah, let me see the code…
Web devs: I got a weird error. Do you know why?
Me: Can you lend me the device?
Then tell me how to reproduce the problem.
Slide 13
Slide 13 text
స
How does Apollo JS client solve problems?
Slide 14
Slide 14 text
No content
Slide 15
Slide 15 text
No content
Slide 16
Slide 16 text
Features
• Embedded GraphiQL
• Real-time query recording
• Visualize cache tree
• Full-text search in cache
and more…
Slide 17
Slide 17 text
How can I use this in iOS?
Slide 18
Slide 18 text
open Apollo Client Developer Tools
Apollo Client
Request data
via function call
Slide 19
Slide 19 text
establish HTTP server and expose endpoints to get data
open Apollo Client Developer Tools
JavaScript object pretending Apollo client
Request data
via function call
Request data
via AJAX
Slide 20
Slide 20 text
1 week later
Slide 21
Slide 21 text
https://github.com/manicmaniac/ApolloDeveloperKit
Slide 22
Slide 22 text
No content
Slide 23
Slide 23 text
݁
Have problems been solved?
Slide 24
Slide 24 text
Easy to debug
• We don’t need a debugger to know the internal state of Apollo.
• We don’t need frequent communication with server-side developers.
Slide 25
Slide 25 text
Web devs: When does the app perform this query?
Me: You can see it in your browser.
Web devs: I got a weird error. Do you know why?
Me: You can see the reason in your browser.