Using Expensify Windows Phone Test Framework to trigger an ApplicationBar button - windows-phone-7

Question

I've just started using the Expensify Windows Phone Test Framework and it seems to fit my requirements for automated testing of Windows Phone 7.1 quite well. I can get it to trigger a normal button on the screen but cannot get it to trigger either of my ApplicationBar buttons.
The XAML for this test page is ...
<phone:PhoneApplicationPage x:Class="SampleApp1.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
xmlns:AppBarUtils="clr-namespace:AppBarUtils;assembly=AppBarUtils"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait"
Orientation="Portrait"
mc:Ignorable="d"
d:DesignWidth="480"
d:DesignHeight="768"
shell:SystemTray.IsVisible="True"
DataContext="{Binding Main, Source={StaticResource Locator}}">
<!--LayoutRoot contains the root grid where all other page content is placed-->
<Grid x:Name="LayoutRoot"
Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel"
Grid.Row="0"
Margin="24,24,0,12">
<TextBlock x:Name="ApplicationTitle"
Text="{Binding ApplicationTitle}"
Style="{StaticResource PhoneTextNormalStyle}" />
<TextBlock x:Name="PageTitle"
Text="{Binding PageName}"
Margin="-3,-8,0,0"
Style="{StaticResource PhoneTextTitle2Style}" />
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentGrid"
Grid.Row="1">
<StackPanel Margin="24,20,0,123" Orientation="Vertical">
<TextBlock Text="{Binding Welcome, Mode=OneWay}"
Style="{StaticResource PhoneTextNormalStyle}"
HorizontalAlignment="Center" VerticalAlignment="Center"
Margin="6,0,19,0" TextWrapping="Wrap" Width="431" />
<TextBlock Text="Enter first number"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="6,20,0,0" TextWrapping="Wrap" />
<TextBox TextChanged="OnTextBoxTextChanged"
Text="{Binding EnteredAmount1, Mode=TwoWay, UpdateSourceTrigger=Explicit}"
x:Name="txtValue1"
HorizontalAlignment="Left" Height="72" VerticalAlignment="Top" Width="456"
TextWrapping="Wrap" InputScope="Number"/>
<TextBlock Text="Enter second number"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="6,0,0,0" TextWrapping="Wrap" />
<TextBox TextChanged="OnTextBoxTextChanged"
Text="{Binding EnteredAmount2, Mode=TwoWay, UpdateSourceTrigger=Explicit}"
x:Name="txtValue2"
HorizontalAlignment="Left" Height="72" VerticalAlignment="Top" Width="456"
TextWrapping="Wrap" InputScope="Number"/>
<TextBlock Text="Result"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="6,20,0,0" TextWrapping="Wrap"/>
<TextBlock Text="{Binding Total, Mode=OneWay}"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="15,0,0,0" TextWrapping="Wrap"
Width="422" Height="45"/>
<Button x:Name="btnAdd" Command="{Binding AddCommand}" Content="Add" Margin="240,0,0,0" />
</StackPanel>
</Grid>
</Grid>
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True" IsMenuEnabled="False">
<shell:ApplicationBarIconButton x:Name="AddAppBarBtn" IconUri="/Images/ApplicationBar.Check.png" Text="add"></shell:ApplicationBarIconButton>
<shell:ApplicationBarIconButton x:Name="SubtractAppBarBtn" IconUri="/Images/ApplicationBar.Cancel.png" Text="subtract"></shell:ApplicationBarIconButton>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
<i:Interaction.Behaviors>
<AppBarUtils:AppBarItemCommand Id="add" Command="{Binding AddCommand}"/>
<AppBarUtils:AppBarItemCommand Id="subtract" Command="{Binding SubtractCommand}"/>
</i:Interaction.Behaviors>
<i:Interaction.Triggers>
<AppBarUtils:AppBarItemTrigger Type="Button" Id="add" Text="add" />
<AppBarUtils:AppBarItemTrigger Type="Button" Id="subtract" Text="subtract" />
</i:Interaction.Triggers>
</phone:PhoneApplicationPage>
The SpecFlow features are defined as follows ...
Scenario: AppBar Add Two Numbers
Given my app is uninstalled
And my app is installed
And my app is running within 20 seconds
Then I enter "34" into the control "txtValue1"
Then I enter "23" into the control "txtValue2"
Then I press the control "AddAppBarBtn"
Scenario: Button Add Two Numbers
Given my app is uninstalled
And my app is installed
And my app is running within 20 seconds
Then I enter "34" into the control "txtValue1"
Then I enter "23" into the control "txtValue2"
Then I press the control "btnAdd"
The ButtonAddTwoNumbers scenario fully works. The AppBarAddTwoNumbers fills in the text box values but refuses to press the button, The error I get is "Failed to set focus to control 'AddAppBarBtn'".
Any help on this would be appreciated.

Answer 1

I think you are working one level too high. Personally I wouldn't normally test the UI itself as in the long term it just leads to brittle tests that constantly need changing. Instead I would normally come down to the ViewModels.
So given that your txtValue1 is bound to EnteredAmount1, txtValue2 is EnteredAmount2 and AddAppBarBtn is AddCommand, you can test your business logic as
Scenario: AppBar Add Two Numbers
Given I enter 34 into Amount1
And I enter 23 into Amount2
When I add them #Calls AddCommand
Then Total should be 57
This means that you can redesign your UI very easily, so say for example if we wanted to use sliders instead of textboxes, there would be NO changes to the above logic tests.
In addition you can still test your UI features as seperate features
Scenario: Check startup
Given my app is uninstalled
When my app is installed
Then my app should be running within 20 seconds
And if you really want you can still check your bindings too
Scenario: Check bindings
Given I enter 34 into Amount1
Then control txtValue1 should be 34
In this way you'll break your tests into smaller chunks of the application and give yourself more targetted failures, which is really useful when tracking down any problems.