Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Opening The Black Box

milsyobtaf
November 18, 2017

Opening The Black Box

Trying to tame a modern, fully-featured web application like Drupal can be an exercise in frustration.

Why are you printing that piece of content there?
Why am I seeing a negative integer instead of a string from this function?
What could a PDOException in my Watchdog log possibly mean?
In this session, we will be going over useful debugging tools and techniques that can help you start to see into the inner workings of all versions of Drupal, including the new kid on the block, Drupal 8. You will be better prepared to start building truly custom features into your projects and you’ll be able to remain calm when you get the ineveitable email that your site is showing the dreaded White Screen Of Death at 4:45pm on a Friday afternoon.

Presented at:
NEDCamp 2017
Full Slidedeck with Speaker Notes:
https://github.com/milsyobtaf/prez/blob/primary/2017/NEDCamp/opening-the-black-box_notes.pdf

milsyobtaf

November 18, 2017
Tweet

More Decks by milsyobtaf

Other Decks in Technology

Transcript

  1. NEDCamp 11/18/2017
    Opening
    The
    Black Box

    View Slide

  2. Howdy!
    Dustin Younse
    @milsyobtaf
    I’m an engineer at
    Acquia
    https://github.com/milsyobtaf/prez

    View Slide

  3. What Is Debugging?

    View Slide

  4. View Slide

  5. View Slide

  6. View Slide

  7. View Slide

  8. View Slide

  9. What Is Debugging?

    View Slide

  10. Nothing But Text?

    View Slide

  11. • CSS aggregated but not cached
    • JS blocked in the browser
    • File permissions in sites/default/files
    Nothing But Text?

    View Slide

  12. • Mostly a semantic difference
    • 5 minutes vs 5 hours?
    • “Fixed” vs understood and corrected
    Debugging vs Troubleshooting

    View Slide

  13. What Is The Black Box?

    View Slide

  14. • Non-technical education
    • Self taught web skills
    • Above average Googling abilities
    • Late nights staring at error messages
    A Familiar Story?

    View Slide

  15. What Is Drupal?

    View Slide

  16. Mental Model of Drupal

    View Slide

  17. Mental Model of Drupal

    View Slide

  18. Mental Model of Drupal

    View Slide

  19. Mental Model of Drupal

    View Slide

  20. Mental Model of Drupal

    View Slide

  21. Mental Model of Drupal

    View Slide

  22. Start At The Beginning

    View Slide

  23. When All You Have Is A Hammer
    CC by 2.0 https://www.flickr.com/photos/raindrift/7095238893/

    View Slide

  24. Text Editors
    • “Text Editors”
    • Text Editors
    • IDEs

    View Slide

  25. • Notepad (Windows)
    • Text Edit (Mac)
    • Nano (Linux / Mac)
    “Text Editors”

    View Slide

  26. • Notepad++ (Windows)
    • Dreamweaver (Mac / Windows)
    • Sublime Text (Mac / Linux / Windows)
    • Atom (Mac / Linux / Windows)
    • Microsoft VS Code (Mac / Linux / Windows)
    • vim (Mac / Linux)
    Text Editors

    View Slide

  27. • PHPStorm (Mac / Linux / Windows)
    • Eclipse (Mac / Linux / Windows)
    • Komodo (Mac / Linux / Windows)
    Integrated Development
    Environments

    View Slide

  28. • emacs (Mac / Linux / Unix / Everything else)
    Operating Systems With Built
    In Text Editors

    View Slide

  29. Development Environments
    • On your server
    • On your machine
    • On your machine, but it acts like the server

    View Slide

  30. Development Environments
    • FTP Development
    • “Cowboy coding”
    • Local Environments
    • MAMP / LAMP / Vagrant
    • Next generation
    • Kalabox / Lando CLI (And other Docker setups)
    • DrupalVM (And other Vagrant setups)

    View Slide

  31. • FTP Development
    • “Cowboy coding”
    • No version control up front
    • Little debugging visibility
    • Log files (maybe), debug statements
    • Watchdog logs (maybe)
    FTP Development

    View Slide

  32. • print_r()
    • Raw dump of a variable or context, no formatting
    • print_r($node);

    • dsm() / kint()
    • Formatted dump of a variable or context
    • dsm($node);
    Debug Statements in Code

    View Slide

  33. • MAMP / Dev Desktop / Native LAMP
    • Code runs entirely locally
    • Added bonus of offline work, no internet required
    • print_r(), dsm(), kint(), but also more
    • xdebug
    Local Development

    View Slide

  34. • Kalabox / Lando with Pantheon / Acquia integration
    • DrupalVM and other Vagrant boxes
    • print_r(), dsm(), kint(), xdebug
    • Very accurate performance profiling
    • XHProf
    • Blackfire
    • Tidewater
    Local Development:
    The Next Generation

    View Slide

  35. What’s xdebug?

    View Slide

  36. • Hitting pause on code execution
    • Inspecting the current state of “the stack”
    • Modifying values live
    xdebug:
    Step Through Debugging

    View Slide

  37. The Ever Dangerous
    Live Demo

    View Slide

  38. Something Is Broken!

    View Slide

  39. View Slide

  40. Relax.

    View Slide

  41. View Slide

  42. Relax.

    View Slide

  43. Remember Cobble’s Knot

    View Slide

  44. • Is something not showing up?
    • New content - is it published?
    • Old content - are permissions set properly?
    • Is something showing up that shouldn’t?
    • Raw HTML and Javascript in a WYSIWYG field?
    What’s Broken?

    View Slide

  45. • Log Files
    • You should learn how to find your log files 

    before you need your log files
    • multitail
    • Linux / Mac utility to easily view logs

    with more options than tail
    Work From The Bottom Up

    View Slide

  46. • Custom Module
    • template.php / .theme file
    • Theme Template
    Where Is It Broken?

    View Slide

  47. View Slide

  48. The Scientific Method

    View Slide

  49. • Change one thing at a time
    • Test that change
    • Repeat
    Finally, Debugging

    View Slide

  50. • Save your progress as you work
    • Recreate your Features or config yml
    • Makes rabbit holes manageable
    git Is Your Friend

    View Slide

  51. • Let’s you isolate changes between commits
    git bisect Is Your Friend

    View Slide

  52. git bisect Is Your Friend

    View Slide

  53. git bisect Is Your Friend

    View Slide

  54. • Remove your debug statements
    • Ensure you only changed as much as you 

    needed to change
    • You only commit print_r(‘Butts’); to master once
    git diff Is Your Friend

    View Slide

  55. git blame Finds Your Enemies

    View Slide

  56. git blame Finds Your Enemies

    View Slide

  57. git blame Is Your Friend

    View Slide

  58. • Can help you track down who wrote 

    the offending code
    • This should not be a witch hunt
    • This should be a chance to find 

    context for the issue
    git annotate Is Your Friend

    View Slide

  59. Other Debugging Methods

    View Slide

  60. • Walk away. Seriously.
    • Talk to a coworker.
    • Talk to a rubber duck.
    • Write it down. By hand.
    Debugging Techniques

    View Slide

  61. Make The Future Easier

    View Slide

  62. • watchdog() (D7)
    • \Drupal::logger() (D8)
    • syslog Module
    • https://www.elastic.co/blog/heya-elastic-stack-and-x-pack
    • https://loggly.com
    • https://www.sumologic.com
    • Write a test!
    • Simpletest / PHPUnit / Behat
    Proactive Debugging

    View Slide

  63. • The Art of Troubleshooting by Jason Maxham
    • https://artoftroubleshooting.com/book/
    • Debugging: The 9 Indispensable Rules for Finding Even the Most Elusive
    Software and Hardware Problems by David Agans
    • http://debuggingrules.com
    • Debugging During Development in Drupal 8 by Allie Jones
    • https://www.gitbook.com/book/zivtech/debug-tools-for-drupal8/
    • Using the PhpStorm Debugger by JetBrains
    • https://confluence.jetbrains.com/x/_idqAw
    • Maniac Magee by Jerry Spinelli
    • https://www.worldcat.org/oclc/20422223
    Further

    Reading

    View Slide

  64. Thanks!

    Questions?

    War stories?

    @milsyobtaf
    https://github.com/milsyobtaf/prez

    View Slide