Introduction: Test Story Viewer

Wallaby’s Test Story Viewer provides a unique and highly efficient way of debugging your code and inspecting what code your test is executing in a single logical view.

The Test Story Viewer is currently a BETA feature, available for VS Code only (and we are already working on adding the feature to JetBrains IDEs). If you have problems or feedback, please let us know.

Select your editor

The information on this page is adjusted to your editor of choice. Please select your editor by clicking on your editor’s logo below before proceeding with the tutorial:

View Test Story

Every executed test has a story that it can tell. To view a test story in Wallaby for VS Code, you may simply run the Open Test Story command for any line of your code or test.

When you open a test story from a line other than the start of your test, the opened test story view automatically reveals that line. If you open a test story from a line of code that is covered by multiple tests, you will be prompted to select which test you want to view.

The Open Test Story Beside command opens the Test Story View beside your active code editor. When this mode is used, any debugger navigation will be reflected both in the test story and in the original files. This view may be useful if you are planning to edit your code/test at the same time as you are reading/checking its story.

The opened test story view shows the full execution history of the selected test. Executed lines of code are highlighted while lines that are displayed only to provide context are faded out. Whenever the execution jumps to a new file, the file name is displayed. When the execution jumps within the file, “…” is displayed.

Initially, the line that you ran the View Test Story command on will be highlighted, and you are free to scroll to the very end of the story to see the test error/last executed statement, or to the beginning of the story where test dependencies are imported. You may also search within the test story view to find a point of interest and start from there.

Time Travel Debugger and Value Explorer

Wallaby’s Time Travel Debugger is also fully available when a Test Story is displayed. This means that you can:

Step in/out/over back and forth, or run to a specific code line.

Select any expression in the executed code to inspect its value. All you need to do is select the object, object property, parameter, expression or variable that you want to view. When you do this, Wallaby will display the value that you selected. In addition to displaying selected expression values beside your code, selected expressions are also available in Wallaby’s Value Explorer in an easy-to-navigate, real-time tree view. Nested properties can be expanded to any depth, and values/paths may be copied to the clipboard.

Opening original code

At any time you may use VS Code’s built-in Go To Definition or Peek Definition commands to open or view the original source code.