jQTouch detail style

I’m working on a mobile application for the iPhone and I am using jQTouch to make the UI look like an iPhone app. jQTouch seriously helps you to quickly create a nice looking UI  but sometimes you need to write your own css to create the layout you want.

I needed a detail page with data shown like the contact details do on the iPhone. Since none of the jQTouch themes had some class that I could use, I sat down and finally came up with this little piece of css:

Now all you need to do is apply the detail class to your li element and place the name and the value inside two divs like so

And the result will look like

Technorati Tags: jQTouch

TDD Workshop

#shamelessplug

Last month I gave a very successful TDD workshop. If you are interested in a TDD workshop, know about C# or Java and happen to be in the Netherlands, have a look at our schedule here (in Dutch) and read the blog about our workshop (also in Dutch).

I’m also in the process of creating a 2 day WatiN training. I’ll blog about this as soon as more info is available.

Browser.AttachTo<T> and IAttachTo

In WatiN RC1 the functionality to attach to a browser instance has had a complete redo. This had two reasons:

1. Being able to attach to a browser in a browser agnostic way.
2. Being able to return your custom browser type.

Download the example code here

From the old way to a browser agnostic way

If you don’t intend to run your tests with different browsers, you still need to make a small change in your code when upgrading to WatiN RC1.

needs to be changed into

which is the same as

and the same as

As you can see in the last example, you can pass in a type which should inherit WatiN.Core.Browser. The following example shows you how to utilize this method in situations where you get a browser instance injected into your test code. In the example the link that is clicked on will open up a new browser instance and we want to verify the text in this newly opened browser instance.

Thanks to this new AttachTo(type, findBy) method there is no knowledge at all of the used browser type inside my test code.

Returning a custom Browser type from AttachTo()

Many of us who use WatiN will probably use their own custom super duper version of WatiN.Core.IE. Providing new or different behavior then the default IE implementation does. See here for example  (and yes this part of the post was also a little bit sparked by their need to write their own AttachTo methods).

Here is my great MyIE class which overrides the ToString method and returns the Title and Url of the shown page (it’ll surf just as an example).

And now I want to be able write

When I run this piece of code, WatiN will throw this exception:

WatiN.Core.Exceptions.WatiNException: 
No AttachToHelper registered for type WatiN.Examples.Tests.MyIE.

That does sound like Ican register an AttachToHelper for a browser Type, doesn’t it. The Browser class provides a method RegisterAttachToHelper doing just that.

So we need to create our own AttachToMyIEHelper class. Since MyIE is inheriting IE, AttachToMyIEHelper will inherit AttachToIEHelper. And then it is just a matter of overriding the CreateBrowserInstance method, return a new instance of MyIE and we are done. Here is the implementation:

And this code shows you how to register the new AttachToMyIEHelper and use it in your tests.

Enjoy testing with WatiN.

Technorati Tags: WatiN

Combine WatiN and White to test Silverlight

Googling the web for stuff written about WatiN, I came across this very interesting article to combine forces between WatiN and White.

http://leobartnik.net/blog/2010/01/silverlight-uiautomation-testing-using.html

It also sparked this idea:

var  silverlightControl = browser.Control<SilverlightControl>(Find.ByFirst());

silverlightControl.Button(Find.ById(“someButton”)).Click;

Interesting.

Technorati Tags: WatiN