From 7f352d86483c456f6059048d0b212522033634bf Mon Sep 17 00:00:00 2001
From: T Paine <30241445+teaP@users.noreply.github.com>
Date: Wed, 11 Dec 2019 08:52:39 -0800
Subject: [PATCH] Fix to sizing issue when TabView is aligned left. (#1744)

Fix to sizing issue when TabView is aligned left. Added test.
---
 dev/TabView/InteractionTests/TabViewTests.cs | 32 ++++++++
 dev/TabView/TabView.cpp                      | 13 ++--
 dev/TabView/TabView.h                        |  1 -
 dev/TabView/TestUI/TabViewSizingPage.xaml    | 80 +++++++++++++++++++-
 dev/TabView/TestUI/TabViewSizingPage.xaml.cs | 16 ++++
 5 files changed, 132 insertions(+), 10 deletions(-)

diff --git a/dev/TabView/InteractionTests/TabViewTests.cs b/dev/TabView/InteractionTests/TabViewTests.cs
index ce6fd1cb09..9e4f3b679c 100644
--- a/dev/TabView/InteractionTests/TabViewTests.cs
+++ b/dev/TabView/InteractionTests/TabViewTests.cs
@@ -510,6 +510,38 @@ public void CloseButtonDoesNotShowWhenVisibilityIsToggled()
             }
         }
 
+        [TestMethod]
+        public void SizingTest()
+        {
+            using (var setup = new TestSetupHelper("TabView Tests"))
+            {
+                Button sizingPageButton = FindElement.ByName<Button>("TabViewSizingPageButton");
+                sizingPageButton.InvokeAndWait();
+                Wait.ForMilliseconds(200);
+                ElementCache.Refresh();
+
+                Button setSmallWidthButton = FindElement.ByName<Button>("SetSmallWidth");
+                setSmallWidthButton.InvokeAndWait();
+
+                Button getWidthsButton = FindElement.ByName<Button>("GetWidthsButton");
+                getWidthsButton.InvokeAndWait();
+
+                TextBlock widthEqualText = FindElement.ByName<TextBlock>("WidthEqualText");
+                TextBlock widthSizeToContentText = FindElement.ByName<TextBlock>("WidthSizeToContentText");
+
+                Verify.AreEqual("400", widthEqualText.DocumentText);
+                Verify.AreEqual("400", widthSizeToContentText.DocumentText);
+
+                Button setLargeWidthButton = FindElement.ByName<Button>("SetLargeWidth");
+                setLargeWidthButton.InvokeAndWait();
+
+                getWidthsButton.InvokeAndWait();
+
+                Verify.AreEqual("700", widthEqualText.DocumentText);
+                Verify.AreEqual("700", widthSizeToContentText.DocumentText);
+            }
+        }
+
         public void PressButtonAndVerifyText(String buttonName, String textBlockName, String expectedText)
         {
             Button button = FindElement.ByName<Button>(buttonName);
diff --git a/dev/TabView/TabView.cpp b/dev/TabView/TabView.cpp
index 1abd70efca..aa0aaad4eb 100644
--- a/dev/TabView/TabView.cpp
+++ b/dev/TabView/TabView.cpp
@@ -31,7 +31,6 @@ TabView::TabView()
     SetDefaultStyleKey(this);
 
     Loaded({ this, &TabView::OnLoaded });
-    SizeChanged({ this, &TabView::OnSizeChanged });
 
     // KeyboardAccelerator is only available on RS3+
     if (SharedHelpers::IsRS3OrHigher())
@@ -311,11 +310,6 @@ void TabView::OnScrollViewerLoaded(const winrt::IInspectable&, const winrt::Rout
     UpdateTabWidths();
 }
 
-void TabView::OnSizeChanged(const winrt::IInspectable&, const winrt::SizeChangedEventArgs&)
-{
-    UpdateTabWidths();
-}
-
 void TabView::OnItemsPresenterSizeChanged(const winrt::IInspectable& sender, const winrt::SizeChangedEventArgs& args)
 {
     UpdateTabWidths();
@@ -534,7 +528,12 @@ void TabView::OnScrollIncreaseClick(const winrt::IInspectable&, const winrt::Rou
 
 winrt::Size TabView::MeasureOverride(winrt::Size const& availableSize)
 {
-    previousAvailableSize = availableSize;
+    if (previousAvailableSize.Width != availableSize.Width)
+    {
+        previousAvailableSize = availableSize;
+        UpdateTabWidths();
+    }
+
     return __super::MeasureOverride(availableSize);
 }
 
diff --git a/dev/TabView/TabView.h b/dev/TabView/TabView.h
index ce84707404..c2d3c93c05 100644
--- a/dev/TabView/TabView.h
+++ b/dev/TabView/TabView.h
@@ -120,7 +120,6 @@ class TabView :
     void OnAddButtonClick(const winrt::IInspectable& sender, const winrt::RoutedEventArgs& args);
     void OnScrollDecreaseClick(const winrt::IInspectable& sender, const winrt::RoutedEventArgs& args);
     void OnScrollIncreaseClick(const winrt::IInspectable& sender, const winrt::RoutedEventArgs& args);
-    void OnSizeChanged(const winrt::IInspectable& sender, const winrt::SizeChangedEventArgs& args);
     void OnItemsPresenterSizeChanged(const winrt::IInspectable& sender, const winrt::SizeChangedEventArgs& args);
 
     void OnListViewLoaded(const winrt::IInspectable& sender, const winrt::RoutedEventArgs& args);
diff --git a/dev/TabView/TestUI/TabViewSizingPage.xaml b/dev/TabView/TestUI/TabViewSizingPage.xaml
index 164e48ed01..a002ba1c9d 100644
--- a/dev/TabView/TestUI/TabViewSizingPage.xaml
+++ b/dev/TabView/TestUI/TabViewSizingPage.xaml
@@ -9,9 +9,17 @@
     mc:Ignorable="d"
     Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
 
-    <Grid>
+    <Grid x:Name="LayoutRoot" >
+
+        <StackPanel Margin="50" Background="Silver">
+            <StackPanel Orientation="Horizontal">
+                <Button x:Name="SetSmallWidth" AutomationProperties.Name="SetSmallWidth" Content="Small Width" Click="SetSmallWidth_Click" Margin="0,0,12,0"/>
+                <Button x:Name="SetLargeWidth" AutomationProperties.Name="SetLargeWidth" Content="Large Width" Click="SetLargeWidth_Click" Margin="0,0,12,0"/>
+                <Button x:Name="GetWidthsButton" AutomationProperties.Name="GetWidthsButton" Content="Get Widths" Click="GetWidthsButton_Click" Margin="0,0,12,0"/>
+                <TextBlock x:Name="WidthEqualText" AutomationProperties.Name="WidthEqualText" Margin="0,0,12,0"/>
+                <TextBlock x:Name="WidthSizeToContentText" AutomationProperties.Name="WidthSizeToContentText"/>
+            </StackPanel>
 
-        <StackPanel Margin="50" Background="Silver" >
             <TextBlock Text="SizeToContent, Auto Column Width" />
             <Grid>
                 <Grid.ColumnDefinitions>
@@ -128,6 +136,74 @@
                 </controls:TabView>
             </Grid>
 
+            <TextBlock Text="HorizonalAlignment = Left, Equal tab widths" />
+            <Grid>
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="*" />
+                </Grid.ColumnDefinitions>
+                <controls:TabView x:Name="TabViewEqual" AutomationProperties.Name="TabViewEqual" HorizontalAlignment="Left" TabWidthMode="Equal" TabCloseRequested="Tabs_TabCloseRequested" AddTabButtonClick="Tabview_AddTabButtonClick" >
+                    <controls:TabView.TabItems>
+                        <controls:TabViewItem Header="Tab A">
+                            <TextBlock>TabA</TextBlock>
+                        </controls:TabViewItem>
+                        <controls:TabViewItem Header="Tab B">
+                            <TextBlock>TabB</TextBlock>
+                        </controls:TabViewItem>
+                        <controls:TabViewItem Header="Tab C">
+                            <TextBlock>TabC</TextBlock>
+                        </controls:TabViewItem>
+                        <controls:TabViewItem Header="Tab D">
+                            <TextBlock>TabD</TextBlock>
+                        </controls:TabViewItem>
+                    </controls:TabView.TabItems>
+                    <controls:TabView.TabStripFooter>
+                        <Grid>
+                            <Grid.ColumnDefinitions>
+                                <ColumnDefinition Width="Auto"/>
+                                <ColumnDefinition Width="*"/>
+                                <ColumnDefinition Width="Auto"/>
+                            </Grid.ColumnDefinitions>
+                            <TextBlock Grid.Column="0" Text="Middle" Margin="6,3,6,0" VerticalAlignment="Center"/>
+                            <TextBlock Grid.Column="2" Text="Right" Margin="6,3,6,0" VerticalAlignment="Center"/>
+                        </Grid>
+                    </controls:TabView.TabStripFooter>
+                </controls:TabView>
+            </Grid>
+
+            <TextBlock Text="HorizonalAlignment = Left, SizeToContent tabs" />
+            <Grid>
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="*" />
+                </Grid.ColumnDefinitions>
+                <controls:TabView x:Name="TabViewSizeToContent" AutomationProperties.Name="TabViewSizeToContent" HorizontalAlignment="Left" TabWidthMode="SizeToContent" TabCloseRequested="Tabs_TabCloseRequested" AddTabButtonClick="Tabview_AddTabButtonClick" >
+                    <controls:TabView.TabItems>
+                        <controls:TabViewItem Header="Tab A Long Name">
+                            <TextBlock>TabA</TextBlock>
+                        </controls:TabViewItem>
+                        <controls:TabViewItem Header="Tab B Even Longer Name">
+                            <TextBlock>TabB</TextBlock>
+                        </controls:TabViewItem>
+                        <controls:TabViewItem Header="Tab C Super Super Long Name">
+                            <TextBlock>TabC</TextBlock>
+                        </controls:TabViewItem>
+                        <controls:TabViewItem Header="Tab D Reasonably Long Too">
+                            <TextBlock>TabD</TextBlock>
+                        </controls:TabViewItem>
+                    </controls:TabView.TabItems>
+                    <controls:TabView.TabStripFooter>
+                        <Grid>
+                            <Grid.ColumnDefinitions>
+                                <ColumnDefinition Width="Auto"/>
+                                <ColumnDefinition Width="*"/>
+                                <ColumnDefinition Width="Auto"/>
+                            </Grid.ColumnDefinitions>
+                            <TextBlock Grid.Column="0" Text="Middle" Margin="6,3,6,0" VerticalAlignment="Center"/>
+                            <TextBlock Grid.Column="2" Text="Right" Margin="6,3,6,0" VerticalAlignment="Center"/>
+                        </Grid>
+                    </controls:TabView.TabStripFooter>
+                </controls:TabView>
+            </Grid>
+
         </StackPanel>
         
     </Grid>
diff --git a/dev/TabView/TestUI/TabViewSizingPage.xaml.cs b/dev/TabView/TestUI/TabViewSizingPage.xaml.cs
index 8dc2584d04..7d8579dfff 100644
--- a/dev/TabView/TestUI/TabViewSizingPage.xaml.cs
+++ b/dev/TabView/TestUI/TabViewSizingPage.xaml.cs
@@ -22,6 +22,22 @@ public TabViewSizingPage()
 
         int _newTabNumber = 1;
 
+        private void SetSmallWidth_Click(object sender, object args)
+        {
+            LayoutRoot.Width = 500;
+        }
+
+        private void SetLargeWidth_Click(object sender, object args)
+        {
+            LayoutRoot.Width = 800;
+        }
+
+        private void GetWidthsButton_Click(object sender, object args)
+        {
+            WidthEqualText.Text = TabViewEqual.ActualWidth.ToString();
+            WidthSizeToContentText.Text = TabViewSizeToContent.ActualWidth.ToString();
+        }
+
         private void Tabview_AddTabButtonClick(TabView sender, object args)
         {
             TabViewItem item = new TabViewItem();