Nicer Debug.log console output

The format of Debug.log can get unreadable for complex or big datastructure and sometimes you can’t use the Elm Debugger so all you can count in is Debug.log.

Meet elm-debug-transformer - https://github.com/kraklin/elm-debug-transformer
It parses Debug.log console messages and returns complex object that can be transformed into nice “Elm Debugger like” structure right in your console. It replaces your console.log() and when it can parse the message (it is in format that Debug.log outputs) it transforms it form this

05

into this nice collapsable output right in your console

17

What’s planned:

  • more colours for types like string number etc.
  • simpler object output so you can use it even with non-Chrome browsers

Ideas, issues, enhancements and PR’s are welcomed.

39 Likes

Nothing to add but that is awesome!

1 Like

Thank you. I hope it would be helpful for you :slight_smile:

Thank you for sharing this! I’m sure I’ll come back to this very soon! :slight_smile:

1 Like

This is great, thanks, will definitely improve my dev experience.

1 Like

image

1 Like