Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
A powerful feature of debugging with Chrome is the ability to edit the code being executed on the fly and seeing your experiments without saving any files or restarting servers.
We found the problem by
jumping inside a function and
0:00
experimented by changing
the options in the debug console.
0:03
But there's another way you can
experiment while debugging and
0:07
that's by editing the code life.
0:11
If we trigger the break-point
again by refreshing the page,
0:13
on line 42 we can see that
the reversed variable
0:17
is being passed into the local variables
that are accessed by the template.
0:20
This is where we should be passing
in the original variable too.
0:26
I can directly edit the line
on 42 to test it out.
0:31
This doesn't save the file to disk,
0:38
it's editing the code running
in the computer's memory.
0:40
When we hit Resume, it works.
0:45
We can temporarily disable the breakpoints
with the Deactivate Breakpoints button.
0:50
And we can test out some other routes.
0:57
And it works, great.
1:04
You still have to use your code editor
to include your fix there too, and save.
1:07
I hope you enjoyed seeing some of
the debugging tools available to you, and
1:13
how they can improve
your development cycle.
1:17
You need to sign up for Treehouse in order to download course files.
Sign up