Cannot find a Resource … but it works on my dev machine

Today I received a message on Slack from one of my colleagues who manning our booth at an IoT convention. Our booth setup exists out of a lot of devices, including several Raspberry Pi 2/3s, Arduinos, Waspmotes, a heap of sensors, some screens and a Windows 10 companion app running on the phone. Cool stuff, but the more you bring, the bigger the chance something breaks. So back to the message:

While remote debugging the app on the phone, I get following error:
Cannot find a Resource with the Name/Key ButtonBackground [Line: 10 Position: 39]

And as a picture says a thousand words, the pretty exception window followed soon after.

You often get a XamlParseException combined with “Cannot find a Resource” when you forget to define a new style or simply make a typo.

But as ButtonBackGround is a default style in the Windows 10 SDK, there’s not much you could do wrong writing this piece of code. And I knew the app ran on my developer machine and on his phone, so I started throwing some questions and SDK build numbers at his head. Turned out the app was deployed to another phone as well and guess twice … that phone wasn’t updated to the Anniversary Update yet.

So what went wrong?

When you define your own style, you usually start from a copy of the default control template and work from there on. If the changes are minimal, I usually just do it in Visual Studio, removing all default values and keeping only changed properties and the changed template. But for this change, I used Blend and thus some of the default properties were still on my new style, one of them being ButtonBackGround. But Bart, it’s a default style, so what could go wrong?

This is the default button template on the Anniversary Update, SDK version 14393.

<Style TargetType="Button">
    <Setter Property="Background" Value="{ThemeResource ButtonBackground}" />
    <Setter Property="Foreground" Value="{ThemeResource ButtonForeground}" />
    <Setter Property="BorderBrush" Value="{ThemeResource ButtonBorderBrush}" />
    <Setter Property="BorderThickness" Value="{ThemeResource ButtonBorderThemeThickness}" />
    <Setter Property="Padding" Value="8,4,8,4" />
    <Setter Property="HorizontalAlignment" Value="Left" />
    <Setter Property="VerticalAlignment" Value="Center" />
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter Property="FontWeight" Value="Normal" />
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
    <Setter Property="UseSystemFocusVisuals" Value="True" />
    <Setter Property="FocusVisualMargin" Value="-3" />
    <Setter Property="Template">
        ... removed for simplicity
    </Setter>
</Style>

And this is the default button template on SDK version 10586 which was selected as the minimum version in the project’s properties.

<Style TargetType="Button">
  <Setter Property="Background" Value="{ThemeResource SystemControlBackgroundBaseLowBrush}" />
  <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
  <Setter Property="BorderBrush" Value="{ThemeResource SystemControlForegroundTransparentBrush}" />
  <Setter Property="BorderThickness" Value="{ThemeResource ButtonBorderThemeThickness}" />
  <Setter Property="Padding" Value="8,4,8,4" />
  <Setter Property="HorizontalAlignment" Value="Left" />
  <Setter Property="VerticalAlignment" Value="Center" />
  <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
  <Setter Property="FontWeight" Value="Normal" />
  <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
  <Setter Property="UseSystemFocusVisuals" Value="True" />
  <Setter Property="Template">
      ... removed for simplicity
  </Setter>
</Style>

How do I know? I simply looked up the default styles in the generic.xaml file of both SDK version.

As you can see, these default styles changed and ButtonBackground is a new resource key introduced in the Anniversary Update that wasn’t around yet on SDK version 10586.

Update: Corrado Cavalli also wrote a post on this topic, named Beware of generated XAML in UWP. He deals with a similar problem, be it with the Foreground style of a ComboBox.