November 2017

Volume 32 Number 11

[Visual Studio]

Code Editing and Debugging in Visual Studio for Mac

By Alessandro Del | November 2017

Visual Studio for Mac is the powerful, new native development environment from Microsoft that perfectly embodies the company’s mobile-first, cloud-first vision. It helps you build cross-platform apps with Xamarin and .NET Core—and games with Unity—using your existing .NET skills and your favorite programming languages, such as C# and F#. You’ll find an introduction to Visual Studio for Mac at msdn.com/magazine/mt790182. In this article, I’ll focus on some powerful features in the code editor and the debugging tools that will help you increase your productivity.

A Roslyn-Powered Code Editor

Visual Studio for Mac allows you to write code in C# and F# on macOS. This is possible because the IDE leverages the .NET Compiler Platform, also known as Project “Roslyn” (github.com/dotnet/roslyn). Roslyn provides open source, cross-platform .NET compilers that expose rich code analysis APIs. As in Visual Studio 2015 and 2017 on Windows, Roslyn powers the code editor in Visual Studio for Mac, providing an enhanced coding experience with syntax colorization, IntelliSense, live code issue detection, fixes and refactorings. The official documentation explains how to use code fixes and refactorings in general (bit.ly/2jKt69D), so in this article I’ll focus more specifically on features and capabilities such as generating types, removing redundant code, navigating code, adding support for custom languages and code snippets. All of these features are available to both Xamarin and .NET Core projects.

Generating Types On-the-Fly

One of the nicest productivity features in the code editor is the ability to generate new types while coding, without losing your focus on the active editor. For example, you can write the name of a type that doesn’t exist yet, and when the code editor highlights the type name as a code issue, you can right-click it (or press Alt+Enter), select Quick Fix | Generate Type. Figure 1 shows an example based on generating a type called Person.

Figure 1 Generating a New Type While in the Active Editor

The first option, Generate class ‘Person’ in new file, will generate a new class called Person with the internal modifier inside a new file called Person.cs. The second option, Generate class ‘Person,’ will generate a new class called Person with the internal modifier inside the current file. The third option, Generate nested class ‘Person,’ will generate a new private class called Person nested inside the type that’s currently active in the code editor (in this case the new class would be generated inside the Program class). You can then change the internal or private modifier either manually or by right-clicking the modifier and then still selecting Quick Fix. In all cases, the new class is generated with an empty constructor. The fourth option, Generate new type, instead shows a dialog where you can specify what type you wish to create (class, interface or enumeration), the access modifier and the destination. And you’re not limited to this—you can use the same technique to add members to the newly generated type. You can simply assign or invoke a property, field or method that doesn’t yet exist and leverage quick fixes to add one easily, as demonstrated in Figure 2, which shows how to add a new property called LastName to the Person class. The Generate variable ‘LastName’ option provides different suggestions based on the current context.

Figure 2 Generating a New Member

In this case, the code is making an assignment, so the code editor suggests you generate a new property or field. Based on the code, the code editor will also assign the proper type to the newly generated member, which means it will generate a property (or field) of type string. The code editor can analyze method invocations and generate matching method signatures. This feature is part of the code refactoring tooling and helps you keep your focus on the code while writing.

Removing Redundant Code

The code editor in Visual Studio for Mac also highlights redundant code—code that’s not necessary and not utilized. Redundant code is easily recognizable because it’s grayed out. Behind the scenes, redundant code is highlighted based on some source analysis rules that cause the redundant code to be considered an issue. (You can control these rules, but that’s out of scope here.) Most of the time you’ll find examples of redundant code based on unnecessary using directives, but redundant code recognition isn’t limited to this. For example, an empty constructor and the internal modifier are highlighted as redundant in Figure 3.

Figure 3 Removing Redundant Code

If you right-click some redundant code, which you recognize by its lighter color, you can then select Quick Fix and Visual Studio will show a code fix that will remove the unnecessary code. Additionally, you’ll see a submenu called Options that allows you to:

• Suppress the current issue detection.
• Configure the analysis rule further in the Visual Studio preferences.
• Apply the code fix for multiple issues of the same type at the document, project or solution level.

Similarly, in the earlier example you can easily fix redundant internal modifiers for type definitions (internal is, in fact, the default modifier in C#). This technique applies to any analysis rule that highlights redundant code in the editor.

Navigating Code

Navigating between code files and between members in a code file is extremely common and having built-in, powerful navigation tools significantly aids productivity. Visual Studio for Mac provides a number of robust tools that make it easier to navigate between files, types and members. First of all, you can quickly move between code files by pressing Control+Tab. This action shows a popup where you can see a list of files in your solution. Holding Control and pressing Tab again cycles down the list and then, when you release, the selected file will be opened in the editor. For source code navigation, the next subsections talk about less-known productivity features that are incredibly useful.

The Find All References and Navigate Tools

The Find All References tool allows you to retrieve all the references to a type or member in the solution. To see this tool in action, simply right-click a type or member name in the code editor and then select Find All References. References are shown in the Search Results pad, as shown in Figure 4.

Figure 4 Finding a Type or Member References

In the Search Results pad, you can see (starting from left to right) the project that contains the reference, the code file including the position, the source text that contained the referenced object, and the full pathname of the source file. You can double-click a reference and the code editor will open the appropriate code file and place the cursor on the selected occurrence. Notice how the source code in the Text column has basic syntax colorization. Find All References is very powerful, but sometimes you might want to filter your search based on certain type and member characteristics. To accomplish this, you can use the Navigate tool, which you invoke by right-clicking a type or member and then selecting Navigate. You’ll be presented with a submenu that shows the following search options:

Find References of All Overloads finds all references of a method and its overloads.

Base Symbols allows you to find the list of base types and interfaces that the type on which you invoked Navigate is inheriting from or is implementing. In the case of methods, Navigate will find the list of methods that the current method is overriding.

Derived Symbols allows you to find the list of types that inherit from the type on which you invoked Navigate. In the case of methods, it finds the list of methods that are overriding the one on which you invoked Navigate.

Extension Methods finds all the extension methods for the type on which you invoked Navigate and that are defined in the current solution.

Member Overloads is similar to Extension Methods, but it finds the list of method overloads defined in the current solution.

Implementing Members, if invoked on an abstract class or interface, shows the list of types and members that implement that type or interface.

The Navigate tool shows the search results in the Search Results pad exactly like Find All References.

The Scrollbar and Minimap Mode

The code editor’s scrollbar displays colored markers that represent code issues, such as warnings and errors, breakpoints, ToDo items, and a colored dot at the top that’s red if the active file contains errors, yellow if the active file contains warnings, or green if no issues are detected. In addition, the scrollbar provides the so-called Minimap mode. When this mode is enabled, the scrollbar displays a preview of the source code for easy navigation, as shown in Figure 5.

Figure 5 The Scrollbar Minimap Mode

You enable Minimap mode by right-clicking the scrollbar and selecting Show Minimap. You can click an area on the map and the code editor will move the cursor to the appropriate point. To disable Minimap mode, you right-click the scrollbar again and select Show Tasks. Minimap mode is particularly useful with long files and helps you have a visual representation of the whole file.

Browsing Objects in a Code File

Visual Studio for Mac offers visual ways to easily browse type and members within a code file. Each code editor window shows breadcrumbs that you can click to see a list of the types defined in the active editor; when you select a type, an additional tab allows you to display the list of its members. Additionally, you can use the Document Outline pad to get a visual representation of the type structure in the active file (see Figure 6).

Figure 6 Browsing Objects in a Code File

Notice how different icons represent the different kinds of members. You might already know the Document Outline pad for its capabilities to show the visual hierarchy of the UI, but you can also use it to get a view of a type’s structure, which is very helpful. You can simply double-click an object within Document Outline and the editor will move the cursor to its definition.

Working with Code Snippets

Visual Studio for Mac supports IntelliSense code snippets—pre-written code block templates that can be customized to match your needs. If you have experience with Visual Studio on Windows, you already know what code snippets are. In Visual Studio for Mac, you have two options to insert a code snippet. The first option is right-clicking the code editor and then selecting Insert Template. A list of available code snippets will appear and you just select the one you need. The second option is picking up a code snippet from the IntelliSense completion list as you type. Figure 7 shows an example where a code snippet is highlighted (you press Tab twice to insert the snippet).

Figure 7 Adding a Code Snippet

Code snippets are represented with the (…) icon, which makes them immediately recognizable. In both cases, a tooltip describes the code snippet’s purpose when you hover over its name with the mouse. Visual Studio for Mac also lets you create new custom code snippets and edit existing ones from within the IDE, without the need of external tools. To accomplish this, select Preferences in the Visual Studio menu, then in the Preferences dialog locate and select the Code Snippets item under Text Editor. There you’ll see a list of code snippets grouped by language. If you select an existing snippet, you just press the Edit button to edit the code. If you in-stead click Add, you will have the option to create a new code snippet. This is done in the New template dialog, where you provide a keyboard shortcut, a description, a MIME type, a language group and, of course, the source code. Figure 8 shows an example.

Figure 8 Creating a Custom Code Snippet

Notice that the $ symbol is used to mark identifiers for replacement, whereas the $selected$$end$ expression delimits the current snippet. When you mark identifiers for replacement, you can also provide additional information on the identifier itself, such as its default value and a tooltip that describes its meaning, in the boxes on the right side of the dialog. When you’re done, simply click OK and close the Preferences dialog. At this point, your new code snippet is in the snippet library and ready to be used in the code editor through IntelliSense. It’s worth noting that you can edit existing snippets to assign a keyboard shortcut if one’s not already available. This allows you to type the keyboard shortcut within the code editor and insert a snippet faster. If you’re like me and use code snippets a lot, having the option to create them from within the IDE will save you a huge amount of time.

Adding Custom Languages

One of the things you’ll love in Visual Studio for Mac is the ability to add new languages that aren’t included out of the box, whose grammar is based on the Text­Mate and Sublime Text de facto standards. In fact, Visual Studio for Mac supports both standards and allows adding language bundles offering editing features such as syntax colorization, code snippets and word completion. For example, suppose you want to add syntax support for editing Swift files, which could be very useful on a Mac. In either TextMate or Sublime Text, you install a Swift language bundle and then export the package of the language bundle to disk. Then you can import the language bundle into Visual Studio for Mac. To accomplish this, you use the Language Bundles node of the Preferences dialog. Here you’ll be able to click Add and select the language package exported before. At this point, you’ll be able to open .swift files (or other file types depending on the bundle you imported) and to take advantage of features such as syntax colorization and code blocks folding.

The code editor also lets you insert code snippets if the language bundle you selected contains any. Obviously, Visual Studio for Mac doesn’t support compiling source files or building and publishing applications based on external language bundles. What you can do instead is automate the execution of external tools, such as compilers, with the Edit Custom Tools command in the Options menu.

Debugging Productivity with Pads and the Debug Class

Debugging is tremendously important and Visual Studio for Mac ships with the kind of first-class debugging tools every developer needs to build high-quality applications in a productive way. The official documentation (bit.ly/2xgJkx0) describes the most commonly used tools, such as breakpoints, data visualizers and conditional flow control. I’m going to describe some other nice features you might want to know about, especially if you’re familiar with debugging in Visual Studio on Windows and you expect to see the same tools on the Mac. Let’s start with the System.Diagnostics.Debug class, which lets you print the evaluation of an expression to the Application Output pad from C# code, without breaking the execution of an application. Suppose you have a .NET Core console application that waits for the user input with the following code:

string inputString = Console.ReadLine();
Debug.WriteLine($"The entered string is {inputString.Length} characters long");

The Debug.WriteLine method prints the expression to the Application Output pad, as depicted in Figure 9, without stopping application execution. In this case, the expression is an interpolated string that contains the length of the string entered by the user.

Figure 9 The Result of an Evaluation Printed to the Application Output Pad

And you’re not limited to the WriteLine method; in fact, you can use all the other supported methods, such as Assert, Equals, Fail, Write, WriteIf and WriteLineIf (see bit.ly/2ydS8jO for details).

In Visual Studio for Mac, there are other ways to evaluate expressions and to inspect object values while debugging. You can use breakpoints and data visualizers, but you can also use the Watch pad, whose purpose is to provide a way to visually monitor variables, methods and expressions. While in break mode, the Watch window is automatically enabled and you can click inside it to add a new object to monitor. Figure 10 shows an example based on a property’s value.

Figure 10 Monitoring Objects with the Watch Pad

For each object you monitor, you can see its members and their values. You can also click the value and change it, so you can see how your code behaves with a different object value. The Watch pad still provides shortcuts to the data visualizers, which you can recognize through the eye and pencil icons. You’ll also find other two debugging pads very useful: the Threads pad and the Call Stack pad, both visible in Figure 11.

Figure 11 Monitoring Threads and Method Calls with the Threads and Call Stack Pads

The Threads pad shows the list of running threads and is useful for understanding the code locations in which your app’s various threads are paused. It shows the thread ID, the name and the location of the code that refers to each thread. You can also enter a name for threads if one doesn’t exist already. The Call Stack pad shows the hierarchy of method calls, and you can enable it to also display calls to code that’s not in your solution; for example, interop frames. To accomplish this, you right-click the pad and enable the Show External Code option. By leveraging all of these, you have a complete and powerful suite of debugging tools that, together with breakpoints, the Locals pad, and data visualizer, give you deep control over your .NET Core and Xamarin solutions.

Wrapping Up

Visual Studio for Mac not only helps you build cross-platform applications for mobile devices and the cloud with Xamarin and .NET Core on macOS, it also offers all the productivity tools you need to write high-quality code. This includes productivity features in the code editor and in the debugging tools that will make you feel at home with this IDE, especially if you have experience with Visual Studio on Windows.

Alessandro Del Sole has been a Microsoft MVP since 2008. Awarded MVP of the Year five times, he has authored many books, eBooks, instructional videos and articles about .NET development with Visual Studio. Del Sole works as a senior .NET developer, focusing on .NET and mobile app development, training and consulting. He has recently authored an upcoming book called “Beginning Visual Studio for Mac” (bit.ly/2hsRxYx). You can follow him on Twitter: @progalex.

Thanks to the following Microsoft technical expert for reviewing this article: Mikayla Hutchinson

Discuss this article in the MSDN Magazine forum