Chutzpah configuration for running TypeScript tests in both Visual Studio and Visual Studio Team Services build

0 votes

We have a Visual Studio 2013 solution for an AngularJS application, written in TypeScript. There is a separate test project for the Jasmine unit tests, also written in TypeScript.

What we are having trouble with is finding a build/Chutzpah configuration that allows us to run the tests on development machines via the Chutzpah test adapter, and also as part of our CI build on Visual Studio Team Services.

When we run the tests on dev machines, it appears that by default the tests run in the source tree, so the dependencies on .d.ts and application .ts files are set up relative to the source directory. So far so good. However when we run the Visual Studio Team Services build (set up following this blog post) the tests seem to run in the bin directory (looking at the Visual Studio Team Services logs). This means the references for dependencies are wrong, so the tests fail as they cannot find the required .d.ts or application .ts files.

The best solution to this we have found so far is this:

  • Have Chutzpah.json set to 'Copy always' so it copies to bin dir
  • Have all test .ts files set to TypeScriptCompile/Copy always
  • Have all test .d.ts file set to Content/Copy always (e.g. jasmine.d.ts)
  • Have all .ts files in the application project set to TypeScriptCompile/Copy always
  • Update test file dependencies to include additional chutzpah_reference that will be correct for bin dir (using chutzpah_reference means that the VS local build will still complete without errors)

We can then run the tests in VS in two ways:

  1. from the VS test runner as normal
  2. by showing all files, locate the bin/Tests directory and right click and 'Run JS Tests' (this is a pretty good indicator that the tests will run correctly on TFS assuming the build def, CI & .runsettings are correctly set up).

We also tried redirecting the JS output to the bin dir, which worked ok in VS, however the VS Team Services build failed to copy the .js files for some reason.

Ideally we would like:

  • to avoid having to copy .ts files to the output dir
  • to avoid having to add in additional references specifically for the bin dir.
  • to use the Chutzpah Compile Mode External (as VS already compiles our TypeScript)
Jun 15, 2022 in TypeSript by Logan
• 2,140 points

1 answer to this question.

0 votes

I'm not sure if this response is still applicable to you, but it might be helpful to others. To begin, let's look into TypeScript and Team Services. Only your TypeScript files should be checked into Team Services. Team Services must convert TypeScript to JavaScript, which may be done easily by adding a Visual Studio Build step to the appropriate project. Note that TypeScript-enabled projects have additional TypeScript settings in their csproj file. This holds true for your unit tests as well. Unit tests in Team Services should be written in standard JavaScript.

The second thing you got to do it to set up the test environment right. That means that you have to download 2 extensions, namely the Chutzpah Test Adapter and Chutzpah Test Runner. These extensions allow you to run(with code coverage) and debug your unit tests. Chutzpah uses PhantomJS as a in memory browser to run your unit tests. Well these extensions got nothing to do with Team Services. These extensions only apply on your local dev environment. Well thats a problem. We can fix that by installing the Chutzpah NuGet package. This NuGet package downloads all the depedencies into your package folder, that means that it downloads PhantomJS, but also QUnit, Jasmine and code coverage libraries. That means that you don't have to reference them in your project anymore. Just delete them from your project. You can then add a chutzpah.json configuration file. In that file you can setup your test framework(jasmine, qunit, etc) and the referenced files for your unit tests. But also files that should be excluded for code coverage, mostly your libraries such as jQuery and Angular. When you've done that you should still be able to run your unit tests on your dev environment, so far so good. We didn't setup anything for unit testing in Team Services.

That concludes the final section. You should include a phase for JavaScript unit testing in your build pipeline. Because a different adapter is used and other assemblies are referenced as test assemblies, you can't combine it with.NET unit testing. You must define three items in that build step: the Test assembly, the VS Test version, and the Path to custom Test adapters. The following values should be entered:

***.tests.js ***.tests.js ***.tests.js ***.tests.js ***.

All files ending in .tests.js are considered test files.

Latest version of VS Test

The new Test adapters are only supported by the most recent test version of Team Services.

$(Build.SourcesDirectory)packages $(Build.SourcesDirectory)packages $(Build.SourcesDirectory)packages $(Build.SourcesDirectory)pack

That's all there is to it; hoping this was helpful.

answered Jun 16, 2022 by Nina
• 3,060 points

Related Questions In TypeSript

0 votes
1 answer

What is TypeScript and why would I use it in place of JavaScript?

TypeScript is a superset of JavaScript which primarily ...READ MORE

answered May 31, 2022 in TypeSript by Nina
• 3,060 points
0 votes
1 answer

How to declare and initialize a Dictionary in Typescript

Apparently this doesn't work when passing the ...READ MORE

answered May 31, 2022 in TypeSript by Nina
• 3,060 points
0 votes
0 answers

TypeScript: for-in statement

TypeScript docs say nothing about loop like ...READ MORE

Jun 3, 2022 in TypeSript by Logan
• 2,140 points
0 votes
1 answer

How to install and run Typescript locally in npm?

It took me a while to figure ...READ MORE

answered Jun 8, 2022 in TypeSript by Nina
• 3,060 points
0 votes
2 answers

Which is better azure devops or aws devops?

Azure DevOps, a part of Microsoft's cloud ...READ MORE

answered Jan 8 in Cloud Computing by anonymous
• 700 points
0 votes
1 answer
0 votes
1 answer

What is the Difference between VSO, VSTS and Azure Devops

Azure DevOps was previously known as VSO ...READ MORE

answered Mar 8, 2022 in Azure by Edureka
• 13,620 points

edited Jun 27, 2023 by Khan Sarfaraz 1,337 views
0 votes
1 answer

Where to find TypeScript version in Visual Studio?

If you only have TypeScript installed for ...READ MORE

answered Jun 7, 2022 in TypeSript by Nina
• 3,060 points
0 votes
1 answer
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP