Carousel Page Children.Add not rendering correctly.

I have a strange issue trying to get some of the demos rendering correctly.

public class TestPage : CarouselPage
    {
        public TestPage()
        {
            this.Children.Add(new ContentPage {Content = new BoxView {Color = new Color (1, 0, 0)}, Title = "Page 1"});
            this.Children.Add(new ContentPage {Content = new BoxView {Color = new Color (0, 1, 0)}, Title = "Page 2"});
            this.Children.Add(new ContentPage {Content = new BoxView {Color = new Color (0, 0, 1)}, Title = "Page 3"});
        }
    } 

    public partial class MainPage : PhoneApplicationPage
    {
        public MainPage()
        {
            InitializeComponent();

            Forms.Init();
            FormsMaps.Init();
            this.Content = new TestPage().ConvertPageToUIElement(this); // white screen (but has the children)

            this.Content = new CarouselPage()   // Renders correctly
            {
                Children = {
                            new ContentPage {Content = new BoxView {Color = new Color (1, 0, 0)}, Title = "Page 1"},
                            new ContentPage {Content = new BoxView {Color = new Color (0, 1, 0)}, Title = "Page 2"},
                            new ContentPage {Content = new BoxView {Color = new Color (0, 0, 1)}, Title = "Page 3"}
                }
            }.ConvertPageToUIElement(this);
        }
    }

surely these should result in exactly the same output? The only thing I can think of is that manually adding children is bugged somehow (which is a shame because that's how I want to build my pages). The other examples have them setting the itemssource and templating, which is fine, it's it actually does have a template, but my screens are unique.

Any ideas?