Team Development Series–Part 3: Leveraging Team Build in LightSwitch (Saar Shen)

What is Team Build? Team build lets you create and manage build processes that automatically analyze, compile and test your applications. Refer to the MSDN topic Build the application for more details on setting up team builds with Team Foundation Service (TFS) and Visual Studio. With LightSwitch in Visual Studio 2013 Preview, we've made it a lot easier to perform automated team builds with LightSwitch solutions. In this post, I am going to show you how to leverage TFS and Visual Studio 2013 Preview with your LightSwitch apps. I'll use TFS online for this example, but you should be able to use the same steps for TFS on-premises.

I strongly encourage you to sign up for a free TFS online account at http://tfs.visualstudio.com for Source Code Control (SCC). Refer to Get started with Team Foundation Service for more details about how to use TFS.

With a team build, there are generally 3 steps to set everything up.

1. Set up a team project and connect to it with Visual Studio
2. Create a LightSwitch application and check it into source control
3. Create a build definition for the project and trigger the build

Let's walk through these steps one by one.

Setup a Team Project and Connect to it to Visual Studio

After you login to your TFS online web portal (something like https://givenname.visualstudio.com), there will be a button that lets you create a team project. Click on it then give the project a name, a description, and choose a process template. Then click the 'Create project' button.

I created a team project named Team Build LightSwitch Project.

Once the project is created, you can connect to it using Visual Studio. Just open Visual Studio, switch to the 'Team Explorer' window, and click on the 'connect' button on top of the Team Explorer. A link for 'Select Team Projects…' will appear. Click it to bring up the 'Connect to Team Foundation Server' dialog. 

Click on the 'Servers …' button and you will see the Add Team Foundation Server dialog.

Once you type in your Team Foundation Service address the connection details will become disabled. Verify the address is correct in the Preview field and then click OK to add a TFS server.

Visual Studio may prompt you for your credentials again to connect to the server. If the server has been added correctly, you will see the server information in 'Connect to Team Foundation Server' dialog and the team project we just created.

Click on the Connect button. Now that you’re connected to the TFS server, you can do a workspace mapping. Click on the 'Configure Workspace' prompt of Team Explorer to map the server workspace to your local workspace.

You will then get a prompt that workspace was mapped successfully.

Create a LightSwitch App and Check it into Source Control

I am going to assume you understand the basics of LightSwitch development and focus on showing you how to get the project into source control. If you are just getting started developing LightSwitch apps, I encourage you to visit the Develop Center (http://msdn.com/lightswitch).

First, create a LightSwitch application. I will create an HTML application and name it CustomerManager.

Next, add the whole solution into Source Control by right-clicking on the project and selecting "Add Solution to Source Control...".

Back in the Solution Explorer, you will now see a '+' sign in front of the file / folder names.

This indicates that these files are not on the source control server yet -- we will need to check them in. Switch from Solution Explorer to Team Explorer and click the 'Pending Changes' icon. Team Explorer will list all the files that will be checked in. Provide a check in comment and click the 'Check In' link. All the files in the category of 'Included Changes' will then be checked in to the source control. After the check in, the Solution Explorer will show a lock icon next to the files that are checked into source control.

Create a Build Definition for the Project and Trigger the Build

To get TFS to build a LightSwitch project, we'll need to create a build definition. A build definition tells TFS when, what, and how to build your project. In Team Explorer, switch to the Build tab and create a build definition.

In the Build Definition dialog there will be several tabs on the left hand side that let you create or edit the build definition. Let’s go through some of the more important settings.

On the General tab, you can set the name and description of the build definition. Let’s name our build definition CustomerManagerCI, where, CI stands for continuous integration.

On the Trigger tab, you decide when the build will be triggered. TFS provides several types of triggers. For this example, we will choose continuous integration so that every new check in will queue a build:

In the Source Settings tab, we set the source mapping between source control servers and build agents. This is where you specify the version-control folders that contain the files that your build process requires. For this example, we specify the solution directory like this:

In Build Defaults, we need to decide what kind of machine we want the build to happen on by choosing the the build controller. I’ll use Windows 8.1 Preview Controller for this example.

In Process tab, there are a lot of options that allow us to customize how our solution is built. For example, we can change MSBuild verbosity, we can decide whether to execute test cases after build, as well as many other options. Although we can keep most of the settings default, it is required to set the MSBuild Platform explicitly to 'X86' instead of 'Auto' for Lightswitch projects since LightSwitch projects won't build with X64 MSBuild.

Once we save the build definition, we will see it immediately on Team Explorer:

The icon to the left indicates it’s a continuous integration triggered build definition. Well, what if I want to test the build now? The most convenient way to test a build definition is to queue it manually. Right-click on the build definition and queue a build through the context menu.

After queuing the build, a build will show up in the 'My Build' list. Double-click on it to view the build results.

You should see a big green build of success! :)

Now you can add a data source, screen, etc. to build upon your LightSwitch application. After you check in the changes, switch to Team Explorer and you will see a build triggered by the changeset in the queue.

Note: There’s a known issue for Visual Studio 2013 preview in that a first time build may fail with TFS online when you have intrinsic database. If you select Retry Build the build should turn out successfully.

Reference

If you want to learn more about TFS and team builds, I encourage you to check out these resources.

• Get started with Team Foundation Service
• Create a Build Definition
• Using Version Control

Also please visit our forums for troubleshooting and feedback on Visual Studio 2013 Preview. We look forward to hearing from you!

- Saar Shen, Tester, LightSwitch Team