Javascript Debugging

Date: 
Wednesday, March 11, 2015

Announcements

UA Digital (Web Branding) - "Cat-a-thon" all-day session last Friday

  • Shared Assets group working on Drupal theme and getting close. Target date for alpha version is March 31. It may take a bit longer. CALS is volunteering to be the prototype for the project. If you want to see something now, the faculty governance site is close to what the group is working on.
  • UX group has been working on personas and use cases that CALS can use for testing the design. The personas and use cases should be able to be taken and modified to fit the needs of departments across campus. Two student workers joined the group on Friday to assist with work on prospective student persona and use cases.

ISO has taken over all network operations. Announced last Monday.

April meeting topic for this group is TBD. May's topic will be Accessible Forms with ARIA presented by Jeff Bishop

Presentation

Javascript Debugging
by Mark Fischer

Covered using the browser-based JavaScript console: REPL (exectuing JavaScript in the console directly), alert(), console.log, sources/debugger (set breakpoints, stepping through code, scope variables & watch expressions).

Additional tips for debugging:

  • If the error message you get in the JavaScript console is vague, try a different browser: you may get a clearer message.
  •  jQuery debugging can be tricky since multiple steps are often combined into one line of code separated with dots. You can break up the steps represented in a line of jQuery code into simpler statements on several lines so you can set breakpoints.
  • If you cable your iOS device to computer, you can select the device in the Develop menu of Safari on the computer. Then you can use the console in the browser to debug code running on the device. This works similarly on Android if you have Chrome on device and the computer.

Q: Does an emulator work?
A: A lot of times, yes; but not always. Emulators are lot better than they used to be. However touch events are difficult to emulate.

Q: Is there a good method for stepping through minimized files?
A: Not really, it's better to get the source. There are de-obsfucators but they won’t give you anything easy to work with.