UNO Windows and WASM do not render consistently

Question

There are difference between how xaml is rendered in my UNO cross-platform app between Windows UI Desktop and WASM.

Here is a Windows UI Desktop render:

And in a WASM Render, the Time Pickers are missing:

The code look like:

<ListView Name="scheduleList" ItemsSource="{x:Bind VM.Schedules}" SelectedItem="{x:Bind VM.SelectedSchedule}"
     Header="Scheduled Appearances:" SelectionMode="Single" >
    <ListView.ItemTemplate>
        <DataTemplate x:DataType="data:Schedule">
            <Grid Margin="4">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <StackPanel Orientation="Horizontal" Grid.Row="0">
                     <CalendarDatePicker x:Name="locDate"  Header="Location Date:"  HorizontalAlignment="Stretch"
                            PlaceholderText="Location Date" Date="{Binding LocationOffsetDate, Mode=TwoWay}" 
                             DateFormat = "{}{dayofweek.full},{month.full} {day.integer}, {year.full}"/>
                    <CheckBox x:Name="okToDelete" Content="Can Delete" IsChecked="{Binding Selected,Mode=TwoWay}"
                               Margin="10,0,0,0" FontSize="18"/>
                </StackPanel>

                <StackPanel Orientation="Horizontal" Grid.Row="1" >
                    <TimePicker x:Name="stTime" Header="Start Time" SelectedTime="{Binding StartTime, Mode=TwoWay}" MinuteIncrement="15"/>
                    <TimePicker x:Name="enTime" Header="End Time" SelectedTime="{Binding EndTime, Mode=TwoWay}" MinuteIncrement="15"/>
                </StackPanel>
            </Grid>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

In a second example, Windows show data in the fields:

But in WASM, the data is missing:

The code looks like this:

<StackPanel Grid.Row="3" x:Name="editLocation" Margin="0,4" HorizontalAlignment="Stretch">
    <TextBlock x:Name="createNewLocation" Text="Define a new location" FontSize="18" Foreground="{StaticResource NavigatorBkgColor}"
               HorizontalAlignment="Center" />
    <controls:FTNTextBox Description="Location Name:"  IsRequired="true"
           InputValue="{x:Bind VM.SelectedLocationClone.Name, Mode=TwoWay}" />
    <controls:FTNTextBox Description="Location Address, include city:"  IsRequired="true"
           InputValue="{x:Bind VM.SelectedLocationClone.Address, Mode=TwoWay}" />
    <controls:FTNTextBox Description="Zip code"  IsRequired="true"
           InputValue="{x:Bind VM.SelectedLocationClone.Postal, Mode=TwoWay}" />
    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
        <Button x:Name="addLocation" Content="Add Location" Margin="10,0,10,0"  
                Command="{x:Bind VM.InsertLocationCommand}"/>
        <Button x:Name="updateChanges" Content="Update Changes" Margin="10,0,5,0" 
                Command="{x:Bind VM.UpdateLocationCommand}"/>
        <Button x:Name="deleteLocation" Content="Delete Location" Margin="5,0,10,0" 
                Command="{x:Bind VM.DeleteLocationCommand}"/>
    </StackPanel>
</StackPanel>

and the FTNTextBox looks like:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <!-- This column takes all available horizontal space -->
        <ColumnDefinition Width="Auto" />
        <!-- This column adjusts to fit its content -->
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
<!-- Description Label -->

    <TextBlock Grid.Row="0" Grid.Column="0" x:Name="descriptionBlock" Text="{x:Bind Description}" 
            Style="{StaticResource FTN_TextBoxDescriptionStyle}" 
            VerticalAlignment="Bottom" HorizontalAlignment="Left"  />
    <TextBlock Grid.Row="0" Grid.Column="1" x:Name="requiredBlock" Text="*required" 
            Style="{StaticResource FTN_TextRquiredStyle}"
            VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="0,0,10,0" />             
    
    <!-- Input TextBox -->
    <TextBox Grid.Row="1" Grid.ColumnSpan="2" x:Name="inputTextBox" 
             TextChanged="OnTextChanged"  Text="{x:Bind InputValue, Mode=TwoWay}"
             Style="{StaticResource FTN_TextInputStyle}" Margin="10,0,10,10" />
</Grid>

I have looked to see if anything resolves the differences, but haven't found anything. I would appreciate any thoughts on this. I haven't found a way to make it work yet.

Answer 1

I believe there are two issues. Apparently TimerPicker isn't supported in WASM (at least that is what I have concluded). The second issue is binding. I'm thinking that my page had a mixture of Binding and x:Bind that must have caused some confusion.