Friday, November 29, 2013

NDC London: Here we come!

Next week I will not be blogging about my day-to-day development problems. Instead I will share my experiences from NDC London.

Together with 11 other colleagues from Ordina, we will spend 6 days in London with the hope to go home a lot smarter, with new knowledge and maybe some new friends(and certainly a list of great pubs Knipogende emoticon).

image

Thursday, November 28, 2013

Web Essentials Browser Link Integration

Last week I discovered a new feature of the Web Essentials:

When you start debugging your web application, you get an extra toolbar by hitting ctrl:

image

This toolbar gives you the following options:

  • Design: Click on any element and edit its text directly in the browser, the results of the edit are reflected in source code
  • Inspect: Click on any element to jump to the corresponding source code in Visual Studio
  • Save F12 changes: Saves the changes that you did in the IE Developer tools back to the source code
  • F12 auto-sync: Any change to CSS properties in the browser dev tools is reflected in your CSS files in Visual Studio
  • Unused CSS detector: Audit your CSS selectors and see which ones don’t match anything in the page

All these features are based on the new Browser Link feature in Visual Studio 2013.

image

Wednesday, November 27, 2013

Enterprise Library 6 development guide

A few months after the release of Enterprise Library 6, Microsoft announced the second edition of the Enterprise Library development guide. The guide explains the concepts that drove development of the blocks, the kinds of tasks they can accomplish, and how they help you implement many well-known design patterns. And, it explains — by way of code extracts and sample programs — how you can actually use the blocks in your applications.

image

Download the free PDF version.

Tuesday, November 26, 2013

ADFS error: The Federation Service could not fulfill the token-issuance request.

After configuring an ASP.NET MVC application to use WIF and ADFS, authentication failed with the following error message:

The Federation Service could not fulfill the token-issuance request because the relying party 'https://localhost/ADFSSampleApp' is missing a WS-Federation Passive endpoint address.

Relying party: https://localhost/ADFSSampleApp

The problem was that I forgot to configure an endpoint address for the relying party configuration in ADFS. To do this, execute the following steps:

  • Open the ADFS Management snap-in
  • Go to the list of Relying Parties
  • Click on the application you want to configure.
  • Go to the properties and open the Endpoints tab
  • Add the URL of your web app

That should fix the problem…

Monday, November 25, 2013

EmbeddedSTS

Since the release of Windows Identity Foundation, Microsoft always provided us with a development STS that was easy to setup and configure.

However with the release of Visual Studio 2013, the development STS(provided through the Identity and Access Control extension) is gone. A good alternative is the EmbeddedSTS provided by Thinktecture:

EmbeddedSts is intended to be used from an ASP.NET application that is using .NET 4.5 and the Federated Authentication Module (FAM) from WIF. It allows for a simple and easy to use STS instead of a production STS that might require installation and configuration. It does this by embedding itself a proper WS-Federation security token service within the application itself. When the ASP.NET application would normally redirect to the production STS, it will instead redirect to the EmbeddedSts. The EmbeddedSts will provide a list of users that can login and will then issue a SAML token back to the application that contains the selcted user's claims. This list of users and their associated claims is configurable in a JSON file (which can also be checked into your project, which is useful for testing).

Thursday, November 21, 2013

WIF: ID3206: A SignInResponse message may only redirect within the current web application: '/app' is not allowed.

After creating a web application, I configured it to authenticate with ADFS through WIF. However when I browsed to the application, after authenticating, it failed with the following message:

ID3206: A SignInResponse message may only redirect within the current web application: '/app' is not allowed. Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code. Exception Details: Microsoft.IdentityModel.Protocols.FederationException: ID3206: A SignInResponse message may only redirect within the current web application: '/app' is not allowed.

The strange thing is that it works when I add a trailing slash to the application url, e.g. https://localhost/app/ instead of https://localhost/app 

Anyone with a suggestion how to fix it?

Wednesday, November 20, 2013

Make your SQL Server Express 2012 available from the outside

By default when you install a SQL Server Express, it is configured to be only accessible from the local machine.

Here are the steps required to make your SQL Server Express database available from the outside:

  • Run SQL Server Configuration Manager.
  • Go to SQL Server Network Configuration > Protocols for SQLEXPRESS.
  • Enable TCP/IP.
  • In the SQL Server Configuration Manager also verify that SQL Server Browser is running.

Now before you continue you have to know if you want to use a dynamic port range for SQLExpress or not. If you want to use a dynamic port range, you can immediately jump to the firewall configuration, otherwise you’ll have to do some extra configuration first:

  • Right-click on TCP/IP and select Properties.
  • Scroll down to IPAll.
  • Make the TCP Dynamic Ports empty
  • Set the TCP Port value to 1433.

Last step is to configure the firewall and add an exception that allows SQL Server traffic:

  • If you are using the dynamic ports, choose Add a program on the Exceptions tab of the Windows Firewall item.
  • Browse to the location of the instance of SQL Server that you want to allow through the firewall, for example C:\Program Files\Microsoft SQL Server\MSSQL11.<instance_name>\MSSQL\Binn, select sqlservr.exe, and then click Open.
  • If you are using a specific port, add a new inbound rule for TCP traffic on port 1433.

More information here: http://technet.microsoft.com/en-us/library/cc646023.aspx

Tuesday, November 19, 2013

Help, how can I log off in Windows Server 2012?

Years of experience in software development, computers and Windows systems and still sometimes I struggle finding the correct command. This time I was looking for a way to log off from a Windows Server 2012 system. The ‘Modern’ UI paradigm gave me a hard time…

So where is this Log off button?

  • Open the Windows Charms by hovering at the bottom right corner of your screen.

WindowsServer2012-1

  • On the Charms, choose the Start option to open the Metro Style start screen.Click on your User account Icon at the Top Right Corner of your Screen and there it is: the Sign out option!

WindowsServer2012-2

Monday, November 18, 2013

Combining ASP.NET Bundling and Minification and LESS

The ASP.NET bundling and minification framework supports frameworks like LESS but it took me some time to figure out how to use it. What’s important to understand is that although the framework supports other languages like LESS, you have to do some extra work to get this working.

One option is to add your own IBundleTransform  implementation, based on the .less NuGet package:

  • Add some LESS files to your web application(to improve the experience, install the Web Essentials).
  • Add the .less NuGet package dotless to your project.
  • Create a BundleTransform:
  • Create a bundle of LESS files with the LessTransform and the CssMinify transform. Add the following code to the RegisterBundles method in the App_Start\BundleConfig.cs file:

Another option is to use the System.Web.Optimization.Less library available through NuGet.

Friday, November 15, 2013

Azure: Create an Azure package file without using a Cloud Service project

A customer asked me if there was a way to keep their existing solutions intact and still be able to create an Azure package. Normally you have to add a Cloud Service project to your solution. This Cloud Service project contains all the information and required configuration to correctly build your Azure package.

But if you don’t want to do this, there is way around it by using the cspack command line tool for this(available as part of the Windows Azure SDK: http://msdn.microsoft.com/en-us/library/windowsazure/gg432988.aspx )

This tool allows you to create a deployment package from scratch.

Here are the required steps:

  • Create a servicedefinition file(.csdef). Probably the easiest way is to copy it from an existing cloud service project and adapt it to your needs
  • Build the (web) applications that you want to deploy
  • Execute the cspack command line tool using the following parameters:

cspack “c:\<path to the csdeffile>\servicedefinition.csdef” /role:<Name of the role as defined in the csdef file>;<location of the binaries> /sites:<Name of the role>;<name of the site path>;<location of the website files>

If you have multiple roles and sites, you have to add multiple /role & /sites arguments.

An example if you have the following servicedefinition file:

cspack “c:\testazurecloud\sampledefinition.csdef” /role:WebApplicationRole;c:\testazurecloud\MyWebApplication\bin /sites:WebApplicationRole;Web;c:\testazurecloud

Thursday, November 14, 2013

Coded UI Tests: Automatically take screenshots while running your tests

One of the nice things that you can do while running your Coded UI tests, is capturing screenshots of the executed actions.

Doing this is easy, to capture a screenshot of the whole screen, execute the following code:

If you only want to take a screenshot of a specific UI element, call the CaptureImage method on the element:

Wednesday, November 13, 2013

Validate your OData feed: The OData validator

You’ve created your own OData feed and want to check if it is following the OData Specifications? Check out the OData Service Validation Tool, an OData protocol validation tool. It contains a set of rules to validate against a given OData payload.

How does it work?

image

  • Choose the response type that you want to validate(AtomPub/XML, JSON-Verbose, JSON-Min,… )
  • Specify the OData version of your endpoint
  • Click on Validate to send a request to the OData service. The tool will send a request to the service and run the right set of rules against the returned payload.
  • For each rule a result is shown together with a link to the relevant spec section.

image

Tuesday, November 12, 2013

Visual Studio 2013: Where is the Identity and Access tool?

In Visual Studio 2012, you had the Identity and Access tool which gave you an easy way to configure your WIF configuration and integrate with an existing STS.

After installing Visual Studio 2013, I started looking on the Visual Studio Gallery for a new version of the tool. But no luck, only a VS 2012 version was available Bedroefde emoticon. And it seems that a version for Visual Studio 2013 will never appear.

Vittorio  Bertocci shared the following information:

In VS2013 Microsoft added support for claims-based identity directly into the ASP.NET project creation experience (see http://blogs.technet.com/b/ad/archive/2013/06/26/improved-windows-azure-active-directory-integration-with-asp-net-amp-visual-studio.aspx ), hence there are no plans of porting the Identity and Access tool to VS2013. We are aware of the fact that as of today the feature set of the two approaches are not 100% equivalent. VS2012 and VS2013 work well side by side, if you depend on functionality only available on the Identity & Access tool we recommend you keep both available until functional parity is reached (see below).

Here there are some comments on the main differences:

Friday, November 8, 2013

TypeScript: Create a type definition file for a jQuery widget

As I mentioned in a previous blog post, one of the great features of TypeScript is the support for definition files. For most popular JavaScript libraries a definition file exists, but last week I wanted to use a jQuery widget that didn’t had a type definition file(yet).

So I decided to create one myself. The important part is to understand how to link your widget to the existing jQuery type definitions.

If you want to extend the $ sign directly, you have to create an interface JQueryStatic and put your functions in it.

If you want to extend the $(‘’) selector method, you have to create an interface JQuery and put your functions there.

Thursday, November 7, 2013

TypeScript: How to create a static class

One thing that took me some time to figure out is how to create a construct like static classes in TypeScript. I wanted to directly expose some functions without instantiating a class.

Here is how I did it:

It’s not completely the same as a static class in C# but it provides a similar experience.

Wednesday, November 6, 2013

TypeScript: Internal vs External Modules

I only recently started looking at TypeScript, so there are still some concepts that are new to me. One the things I struggle with is the difference between internal and external modules.

As far as I understand it, you can define Namespaces in TypeScript by using internal modules:

By using the ‘module’ keyword I can create a Module. Everything that I put inside this module will only available inside the module itself. If I want to make something available outside the module I should apply the ‘export’ keyword.

So far so good. Now things start to get complex(at least for me) when you bring external modules into the mix. These are modules that use the AMD conventions and make it possible to export an entire module and then import it into another module. This defines a dependency chain that AMD and require.js can manage for you.

Something that took me some time to figure out is that you cannot mix internal and external modules. I wanted to use external modules but split one module out over multiple *.ts files. I had to take a look at the language specification to understand that this is ‘as designed’:

External modules (section 9.4) are separately loaded bodies of code referenced using external module names. An external module is written as a separate source file that contains at least one import or export declaration.

Further down it says that internal modules are open ended and can extend over multiple files:

Internal modules are “open-ended” and internal module declarations with the same qualified name relative to a common root (as defined in section 2.2) contribute to a single module.

If you want to read more about the difference, have a look at following StackOverflow post: http://stackoverflow.com/questions/12882748/how-do-you-put-multiple-external-modules-into-the-same-namespace-in-typescript

Tuesday, November 5, 2013

Visual Studio 2013: Search for TypeScript Typings

One of the nice features that TypeScript offers is the support for declaration files. With these declaration files you get better Intellisense and error detection for many popular JavaScript libraries. On GitHub you can find a long list of libraries that have a declaration file available.

To simplify finding these definition files for a specific JavaScript library, the TypeScript team added a nice feature to the Visual Studio IDE: “Search for TypeScript Typings…”.

image

By right clicking on any JavaScript file inside your project and choosing this option, it will start a search on NuGet for TypeScript-related packages matching the name of the JavaScript file. If you install a typing package, it will automatically be referenced by all of the TypeScript files in your project. You no longer need to explicitly add reference tags in your TypeScript code to each of the declaration files.

image

Monday, November 4, 2013

UI testing using Selenium: The IEDriverServer.exe file does not exist in the current directory or in a directory on the PATH environment variable

In my continuing conquest to find the best tool for UI testing, I also had a look at Selenium, one of the oldest and most well known browser automation frameworks.

I started simple by creating a new Test project, adding references to Selenium through NuGet, and writing a small test(based on a sample on their website):

Unfortunately when I ran the test, it failed with the following error message:

  Initialization method OLASeleniumTestProject.UnitTest1.Setup threw exception. OpenQA.Selenium.DriverServiceNotFoundException: OpenQA.Selenium.DriverServiceNotFoundException: The IEDriverServer.exe file does not exist in the current directory or in a directory on the PATH environment variable. The driver can be downloaded at http://code.google.com/p/selenium/downloads/list..

Result StackTrace:         

at OpenQA.Selenium.DriverService.FindDriverServiceExecutable(String executableName, Uri downloadUrl)

   at OpenQA.Selenium.IE.InternetExplorerDriverService.CreateDefaultService()

   at OpenQA.Selenium.IE.InternetExplorerDriver..ctor()

   at SeleniumTestProject.UnitTest1.Setup() in c:\Projects\Test\SeleniumTestProject\SeleniumTestProject\UnitTest1.cs:line 18

It seems like that just installing the NuGet packages isn’t enough. Behind the scenes Selenium is using a driver executable depending on the browser you want to test on.

To solve the issue, I had to execute 2 steps:

  • Step 1: Download and unpack the correct driver on your system. I am using a 32bit Internet Explorer so I downloaded the related driver. I  unpacked it in the same folders as my tests.
  • Step 2: I changed my code to tell Selenium where it can find the correct driver:

That’s it!