Cody  Osinski

Cody Osinski


Debug Your Tests in TypeScript with Visual Studio Code

In this article, I show you how to set up Visual Studio Code to get an overview of your tests and debug individual tests.

In this article we use the example project from the  previous article which was about how to set up a new project with jest in Typescript.

As your project continues to grow and increase in complexity, so do the tests grow in number. Let’s just imagine we have a big project with about 100 tests and now one test is failing. You have to know which test it failing, why it’s failing and where in the source code the error occurs.

Getting started

As we did in the previous article, we change the add() function again, causing an error.

Image for post

If we run all tests from the console, we will see something similar to the image below, but it would be very helpful if the IDE could help us to work more efficient.

Image for post

#typescript #javascript #nodejs #debugging

What is GEEK

Buddha Community

Debug Your Tests in TypeScript with Visual Studio Code
Brain  Crist

Brain Crist


A Better Way to Test for Exceptions in Visual Studio

I’ve always argued that the only easier way to test your code than using Visual Studio Test is to not test at all. But that doesn’t mean that I think Visual Studio Test is perfect.

For example, the ExpectedException attribute, when placed on a test method, lets you check to make sure that your code throws the appropriate exception when something goes horribly wrong. The problem with ExpectedException is that it applies to the whole test method, not just the “code under test.” This means that if your test or production code throws that exception anywhere at all, the ExpectedException attribute will tell you that your test has passed. Unfortunately, that exception may or may not have been thrown where you actually expected it to be thrown. That’s not quite what you want to test for.

You have a better alternatives: the Assert object’s ThrowsException and ThrowsExceptionAsync methods. With either of those methods, you specify the exception you expect to get from your method and then pass the code you want to test (as a lambda expression) to the method.

This example checks to see if the GetCustomer method throws a NullReferenceException when the GetCustomer method is called with an empty string:

Customer cust;
Assert.ThrowsException<NullReferenceException>(() => cust = CustomerRepository.GetCustomer(""));

This test will now pass if (and only if) this call to the GetCustomer method throws a NullReferenceException. If any other code in my test method throws that exception (or if my code throws any other kind of exception), my test will be flagged as failed. And that’s exactly what I want.

#visual studio code #visual studio #code #test

Brain  Crist

Brain Crist


Getting the right version of TypeScript in a Visual Studio ASP.NET Core Project

I’m building an ASP.NET Core Angular 2 app. I think I’m using the latest version of TypeScript (2.1 at the moment) but I’m not sure …

If I open a command prompt and type:

tsc --version

it gives me:

Version 2.1.5

So, great, my app must be using the 2.1?

Let’s check this by writing some 2.1 code:

let person1 = { name: "bob", age: 30 };
let person2 = { address: "12 Victoria Road" };
let mergedPerson = { ...person1, ...person2 };

Visual Studio complains straight away, putting a red squiggly line under the ...‘s. If you hover over the complaints, you get a tooltip saying ”property assignment expected“.

Lets try running the app. It runs perfectly fine with mergedPerson correctly outputted to the console.

What’s going on? The visual studio compiler must be using a different version of TypeScript.

For classic ASP.NET projects, TypeScriptToolsVersion in csproj used to define the TypeScript version but that is no longer the case in ASP.NET core. In ASP.NET Core, this appears to be defined in a file called Microsoft.TypeScript.targets at C:\Program Files (x86)\MSBuild\Microsoft\VisualStudio\v15.0\TypeScript:

    <!-- Prefer NuGet tools version -->
    <TypeScriptToolsVersion Condition="'$(TypeScriptNuGetToolsVersion)'!=''">$(TypeScriptNuGetToolsVersion)</TypeScriptToolsVersion>
    <TypeScriptToolsVersion Condition="'$(TypeScriptToolsVersion)'==''">1.8<TypeScriptToolsVersion>
    <!-- Check the default folder for the nuget version of the installer first, if that exists we should use that. -->
    <TscToolPath Condition="'$(TscToolPath)' == '' AND Exists('$(MSBuildThisFileDirectory)tsc\tsc.exe') ">$(MSBuildThisFileDirectory)tsc\</TscToolPath>
    <TscToolPath Condition="'$(TscToolPath)' == ''">$(MSBuildProgramFiles32)\Microsoft SDKs\TypeScript</TscToolPath>
    <TscToolExe Condition="'$(TscToolExe)' == ''">tsc.exe</TscToolExe>
    <TscYieldDuringToolExecution Condition="'$(TscYieldDuringToolExecution)' == ''">true</TscYieldDuringToolExecution>

So, this makes sense - Visual Studio appears to be using v1.8 (line 4).

Unfortunately, simply changing the 1.8 to 2.1 didn’t work for me. I looked in my C:\Program Files (x86)\Microsoft SDKs\TypeScript directory. I only had a folder for 1.8.

Visual studio was obviously missing something, so, I downloaded and installed the latest version of TypeScript for Visual Studio.

Voila! The red squiggly lines disappeared in Visual Studio, my app still ran fine and the version references in C:\Program Files (x86)\MSBuild\Microsoft\VisualStudio\v15.0\TypeScript\Microsoft.TypeScript.targets has been upgraded to 2.1.

#visual studio code #visual studio #code #typescript

COMO USAR e trabalhar com Code Review no Visual Studio Code

Não é todo programador que gosta de compartilhar o seu trabalho ou até mesmo receber feedbacks de como o seu código foi escrito, mas o Code Review é cada vez mais comum em empresas do mundo todo.

Conheça uma extensão para Visual Studio Code e comece a trabalhar com Code Review em seu próximo projeto. Essa é a sua chance de saber COMO USAR e trabalhar com Code Review no Visual Studio Code.

#visual studio code #code review #visual studio #code

Brain  Crist

Brain Crist


Writing Visual Studio Extensions with Mads - Episode 1: Item Templates

Join Mads Kristensen from the Visual Studio team each week as he builds extensions for Visual Studio live!

#visual studio code #visual studio #code #microsoft #visual studio extensions

Brain  Crist

Brain Crist


User Snippets (Code Shortcuts) in Visual Studio Code

Hello, my friends and fellow developers, this video is all about User Snippets. That means the Snippets (Code Shortcuts) that you can make for yourself. It is a really amazing feature. I hope you like this video

Let me know in the comments below if you want more Visual Studio Code videos or any other videos. And like the video, if you like it.

#visual studio code #visual studio #code