Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

TabViewItem: Background/Foreground APIs are now respected #3216

Closed
wants to merge 11 commits into from
Closed

TabViewItem: Background/Foreground APIs are now respected #3216

Show file tree
Hide file tree
Changes from 10 commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
137a796
TabViewItem's Foreground/Background APIs are now respected.
Felix-Dev Aug 27, 2020
cb0cc0b
Moved now obsolete TabViewItemIconForeground* theme resources into ne…
Felix-Dev Aug 27, 2020
fb66593
Added API tests.
Felix-Dev Aug 30, 2020
c235895
forgot to remove comment syntax outcommenting code
Felix-Dev Aug 30, 2020
d3ef257
Update winui placeholder version used by MUXControlsReleaseTest.
Felix-Dev Sep 24, 2020
005592c
(partial) update with master
Felix-Dev Sep 24, 2020
983dc90
Merge branch 'user/Felix-Dev/MUXReleaseTestApp-update-nuget-package' …
Felix-Dev Sep 24, 2020
8180c1b
Add test page to MUXControlsReleaseTest app to consume deprecated res…
Felix-Dev Sep 24, 2020
9590297
Move remaining deprecated TabView theme resources into new global res…
Felix-Dev Sep 24, 2020
47f46fc
fix merge conflicts
Felix-Dev Sep 24, 2020
6ee5daf
Fix merge conflict.
Felix-Dev Nov 23, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions MUXControlsInnerLoop.sln
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -342,6 +342,8 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "TabView", "TabView", "{B3E6
EndProject
Project("{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}") = "TabView", "dev\TabView\TabView.vcxitems", "{B9F81FEF-1E8D-4FE1-A46B-7002D4C109D2}"
EndProject
Project("{D954291E-2A0B-460D-934E-DC6B0785DB48}") = "TabView_APITests", "dev\TabView\APITests\TabView_APITests.shproj", "{2F4E95E9-F729-481C-B9AA-C9BEC91AE395}"
EndProject
Project("{D954291E-2A0B-460D-934E-DC6B0785DB48}") = "TabView_InteractionTests", "dev\TabView\InteractionTests\TabView_InteractionTests.shproj", "{D1E297B4-5E5B-4807-8624-4141C817A98A}"
EndProject
Project("{D954291E-2A0B-460D-934E-DC6B0785DB48}") = "TabView_TestUI", "dev\TabView\TestUI\TabView_TestUI.shproj", "{1D87AAC7-1E11-40FC-90A7-B6CE1C4567AE}"
Expand Down Expand Up @@ -511,6 +513,7 @@ Global
dev\SplitButton\TestUI\SplitButton_TestUI.projitems*{280c91f4-96b5-4bde-9e02-e573e1def583}*SharedItemsImports = 13
dev\Repeater\TestUI\Repeater_TestUI.projitems*{2ed883f5-20db-4445-8c96-517a21e5e657}*SharedItemsImports = 13
dev\MenuFlyout\TestUI\MenuFlyout_TestUI.projitems*{2ef860e2-8766-41fc-bde2-e6b18bb8c206}*SharedItemsImports = 13
dev\TabView\APITests\TabView_APITests.projitems*{2f4e95e9-f729-481c-b9aa-c9bec91ae395}*SharedItemsImports = 13
dev\ParallaxView\ParallaxView.vcxitems*{3095445a-afcd-5154-ac36-9770e6ec1aa5}*SharedItemsImports = 9
dev\RadioMenuFlyoutItem\RadioMenuFlyoutItem.vcxitems*{3353a4a7-87b3-4e43-8f8d-43c7380d1d56}*SharedItemsImports = 9
dev\Lights\Lights.vcxitems*{3479a3ae-2854-4bec-80ab-eab0772cb90a}*SharedItemsImports = 9
Expand Down Expand Up @@ -1042,6 +1045,7 @@ Global
{BA914F48-E924-4FD2-AEE1-264F67DB6C9F} = {807E57C8-F3E8-4049-AB88-BE3D3285B441}
{B3E64837-A5E4-49CB-97FF-A365307B9191} = {67599AD5-51EC-44CB-85CE-B60CD8CBA270}
{B9F81FEF-1E8D-4FE1-A46B-7002D4C109D2} = {B3E64837-A5E4-49CB-97FF-A365307B9191}
{2F4E95E9-F729-481C-B9AA-C9BEC91AE395} = {B3E64837-A5E4-49CB-97FF-A365307B9191}
{D1E297B4-5E5B-4807-8624-4141C817A98A} = {B3E64837-A5E4-49CB-97FF-A365307B9191}
{1D87AAC7-1E11-40FC-90A7-B6CE1C4567AE} = {B3E64837-A5E4-49CB-97FF-A365307B9191}
{CFAFD6A7-FC7B-4C96-B292-A440C7C65D89} = {67599AD5-51EC-44CB-85CE-B60CD8CBA270}
Expand Down
2 changes: 1 addition & 1 deletion build/AzurePipelinesTemplates/MUX-NugetReleaseTest-Job.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ jobs:
nugetConfigPath: test\MUXControlsReleaseTest\nuget.config
packageSaveDirectory: $(Build.SourcesDirectory)\packages\muxreleasetest
artifactDownloadPath: $(Build.SourcesDirectory)\Artifacts
currentPackageVersion: 2.1.190606001
currentPackageVersion: 2.4.3
buildOutputDir: $(Build.SourcesDirectory)\BuildOutput

steps:
Expand Down
4 changes: 4 additions & 0 deletions dev/CommonStyles/CommonStyles.vcxitems
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,10 @@
<Type>ThemeResources</Type>
<Priority>1</Priority>
</Page>
<Page Include="$(MSBuildThisFileDirectory)Deprecated_themeresources.xaml">
<Version>RS1</Version>
<Type>ThemeResources</Type>
</Page>
<Page Include="$(MSBuildThisFileDirectory)RadioButton_themeresources.xaml">
<Version>RS1</Version>
<Type>ThemeResources</Type>
Expand Down
42 changes: 42 additions & 0 deletions dev/CommonStyles/Deprecated_themeresources.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
<!-- Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT License. See LICENSE in the project root for license information. -->
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Microsoft.UI.Xaml.Controls">

<!-- The resources listed in this file are no longer used by WinUI and have been retained for backward compatibility.
They will be removed in a future major WinUI update. -->

<ResourceDictionary.ThemeDictionaries>
<ResourceDictionary x:Key="Light">
<StaticResource x:Key="TabViewItemIconForeground" ResourceKey="SystemControlForegroundBaseMediumBrush" />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

TabViewItemIconForeground [](start = 35, length = 25)

Can we verify that this change doesn't break apps? Basically that an app that references this resource continues to work after this change. I suspect it does but we should confirm

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tested that locally here and and apps still work fine using these resources. Can create a test for this if required.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@stmoy would it be possible to make XCG reference one of these resources so that we can validate that it still works when we update the release version?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Felix-Dev I think better than using the xcg would be to add something to the IXMP test app that references these moved resources.

Copy link
Contributor Author

@Felix-Dev Felix-Dev Sep 3, 2020 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@StephenLPeters I'm having troubled adding the IXMP test projects to my VS solution. While I can add the IXMPTestApp and IXMPTestApp.TAEF projects seemingly fine, adding the shared IXMPTestApp.Shared project seems to work not correctly:
image

These two top-level folders (3c184...., da296....) - I assume - should not be shown in the Solution explorer and I have no idea why VS just decides to add them. They do not exist on the file system.

I suspect these are causing issues here because while I can build the IXMPTestApp project, I cannot run it. The run process is terminated with error message

The program '[0x5548] IXMPTestApp.exe: Program Trace' has exited with code 0 (0x0).
The program '[0x5548] IXMPTestApp.exe' has exited with code -1073740791 (0xc0000409).

before even the Application constructor is called (no breakpoint hit).

Thoughts here?

Copy link
Contributor Author

@Felix-Dev Felix-Dev Sep 24, 2020 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@StephenLPeters Would something like this look okay for now?

image

(I am using a 2px gray border around the theme resource value here to act as a visual border in case the page background has the same color as the theme resource value.)

This is a new page in the MUXControlsReleaseTest apps which for now tests one of the now deprecated tabview theme resources (so this single resource test is meant to act as a test for all theme resources in question here).

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What exactly are we testing through this? What would happen if the resource disappears/breaks, would we be able to notice that through the CI?

Copy link
Contributor Author

@Felix-Dev Felix-Dev Sep 24, 2020 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We are testing here that moving the resources into the new deprecated theme resource file will not break apps. It is my understanding that the CI will then run the tests (launch the app and navigate to the different test pages,...) on the newest available WinUI nuget package and that a missing resource will thus be noticed because the app will crash after navigating to the page consuming said resource.

@StephenLPeters to confirm though.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think that is more than enough, I wouldn't really expect anyone to look at it so as long as the page load the resource I think its sufficient.

Copy link
Contributor Author

@Felix-Dev Felix-Dev Sep 24, 2020 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added the proposed new page to the MUXControlsReleaseTest app now (and updated the WinUI placeholder version).

<StaticResource x:Key="TabViewItemIconForegroundPressed" ResourceKey="SystemControlForegroundBaseMediumBrush" />
<StaticResource x:Key="TabViewItemIconForegroundSelected" ResourceKey="SystemControlForegroundBaseMediumBrush" />
<StaticResource x:Key="TabViewItemIconForegroundPointerOver" ResourceKey="SystemControlForegroundBaseMediumBrush" />
<StaticResource x:Key="TabViewItemIconForegroundDisabled" ResourceKey="SystemControlDisabledBaseMediumLowBrush" />
<StaticResource x:Key="TabViewButtonBackgroundActiveTab" ResourceKey="SystemControlTransparentBrush" />
<StaticResource x:Key="TabViewButtonForegroundActiveTab" ResourceKey="SystemControlBackgroundBaseMediumBrush" />
</ResourceDictionary>

<ResourceDictionary x:Key="Dark">
<StaticResource x:Key="TabViewItemIconForeground" ResourceKey="SystemControlForegroundBaseMediumBrush" />
<StaticResource x:Key="TabViewItemIconForegroundPressed" ResourceKey="SystemControlForegroundBaseMediumBrush" />
<StaticResource x:Key="TabViewItemIconForegroundSelected" ResourceKey="SystemControlForegroundBaseMediumBrush" />
<StaticResource x:Key="TabViewItemIconForegroundPointerOver" ResourceKey="SystemControlForegroundBaseMediumBrush" />
<StaticResource x:Key="TabViewItemIconForegroundDisabled" ResourceKey="SystemControlDisabledBaseMediumLowBrush" />
<StaticResource x:Key="TabViewButtonBackgroundActiveTab" ResourceKey="SystemControlTransparentBrush" />
<StaticResource x:Key="TabViewButtonForegroundActiveTab" ResourceKey="SystemControlBackgroundBaseMediumBrush" />
</ResourceDictionary>

<ResourceDictionary x:Key="HighContrast">
<StaticResource x:Key="TabViewItemIconForeground" ResourceKey="SystemControlForegroundBaseMediumBrush" />
<StaticResource x:Key="TabViewItemIconForegroundPressed" ResourceKey="SystemControlHighlightAltBaseHighBrush" />
<StaticResource x:Key="TabViewItemIconForegroundSelected" ResourceKey="SystemControlHighlightAltBaseHighBrush" />
<StaticResource x:Key="TabViewItemIconForegroundPointerOver" ResourceKey="SystemControlHighlightAltBaseHighBrush" />
<StaticResource x:Key="TabViewItemIconForegroundDisabled" ResourceKey="SystemControlDisabledBaseMediumLowBrush" />
<StaticResource x:Key="TabViewButtonBackgroundActiveTab" ResourceKey="SystemControlTransparentBrush" />
<StaticResource x:Key="TabViewButtonForegroundActiveTab" ResourceKey="SystemControlBackgroundBaseMediumBrush" />
</ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>

</ResourceDictionary>
112 changes: 110 additions & 2 deletions dev/TabView/APITests/TabViewTests.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@
using Windows.UI.Xaml.Automation.Peers;
using Windows.UI.Xaml.Automation;
using Windows.UI.Xaml.Automation.Provider;
using Windows.UI.Xaml.Controls;

#if USING_TAEF
using WEX.TestExecution;
Expand Down Expand Up @@ -142,15 +143,15 @@ public void VerifyTabViewItemUIABehavior()
RunOnUIThread.Execute(() =>
{
var selectionItemProvider = GetProviderFromTVI(tvi0);
Verify.IsTrue(selectionItemProvider.IsSelected,"Item should be selected");
Verify.IsTrue(selectionItemProvider.IsSelected, "Item should be selected");

selectionItemProvider = GetProviderFromTVI(tvi1);
Verify.IsFalse(selectionItemProvider.IsSelected, "Item should not be selected");

Log.Comment("Change selection through automationpeer");
selectionItemProvider.Select();
Verify.IsTrue(selectionItemProvider.IsSelected, "Item should have been selected");

selectionItemProvider = GetProviderFromTVI(tvi0);
Verify.IsFalse(selectionItemProvider.IsSelected, "Item should not be selected anymore");

Expand All @@ -167,6 +168,113 @@ static ISelectionItemProvider GetProviderFromTVI(TabViewItem item)
}
}

[TestMethod]
public void TabViewItemBackgroundTest()
{
TabView tabView = null;
TabViewItem tabViewItem1 = null;
TabViewItem tabViewItem2 = null;
RunOnUIThread.Execute(() =>
{
tabView = new TabView();

tabViewItem1 = CreateTabViewItem("Tab1", Symbol.Home);
tabViewItem2 = CreateTabViewItem("Tab2", Symbol.Document);

tabView.TabItems.Add(tabViewItem1);
tabView.TabItems.Add(tabViewItem2);

Content = tabView;
});

IdleSynchronizer.Wait();

RunOnUIThread.Execute(() =>
{
// Verify that the TabViewItem we use for background API testing here is unselected
Verify.IsFalse(tabViewItem2.IsSelected, "TabViewItem should have been unselected");

bool testCondition = !IsBrushUsingSolidColor(tabViewItem2.Background, Colors.Blue);
Verify.IsTrue(testCondition, "Default TabViewItem background color should have not been [blue]");

var tabContainer = VisualTreeUtils.FindVisualChildByName(tabViewItem2, "TabContainer") as Grid;

testCondition = !IsBrushUsingSolidColor(tabContainer.Background, Colors.Blue);
Verify.IsTrue(testCondition, "TabViewItem's [TabContainer] background color should have not been [blue]");

Log.Comment("Set the background color of the TabViewItem to [blue]");
tabViewItem2.Background = new SolidColorBrush(Colors.Blue);

testCondition = IsBrushUsingSolidColor(tabViewItem2.Background, Colors.Blue);
Verify.IsTrue(testCondition, "TabViewItem's background color should have been [blue]");

testCondition = IsBrushUsingSolidColor(tabContainer.Background, Colors.Blue);
Verify.IsTrue(testCondition, "TabViewItem's [TabContainer] background color should have been [blue]");

bool IsBrushUsingSolidColor(Brush brush, Color color)
{
return brush is SolidColorBrush scBrush && scBrush.Color == color;
}
});
}

[TestMethod]
public void TabViewItemForegroundTest()
Felix-Dev marked this conversation as resolved.
Show resolved Hide resolved
{
TabView tabView = null;
TabViewItem tabViewItem1 = null;
TabViewItem tabViewItem2 = null;
RunOnUIThread.Execute(() =>
{
tabView = new TabView();

tabViewItem1 = CreateTabViewItem("Tab1", Symbol.Home);
tabViewItem2 = CreateTabViewItem("Tab2", Symbol.Document);

tabView.TabItems.Add(tabViewItem1);
tabView.TabItems.Add(tabViewItem2);

Content = tabView;
});

IdleSynchronizer.Wait();

RunOnUIThread.Execute(() =>
{
// Verify that the TabViewItem we use for foreground API testing here is unselected
Verify.IsFalse(tabViewItem2.IsSelected, "TabViewItem should have been unselected");

bool testCondition = !IsBrushUsingSolidColor(tabViewItem2.Foreground, Colors.Blue);
Verify.IsTrue(testCondition, "Default TabViewItem foreground color should have not been [blue]");

var iconControl = VisualTreeUtils.FindVisualChildByName(tabViewItem2, "IconControl") as ContentControl;
var headerPresenter = VisualTreeUtils.FindVisualChildByName(tabViewItem2, "ContentPresenter") as ContentPresenter;

testCondition = !IsBrushUsingSolidColor(iconControl.Foreground, Colors.Blue);
Verify.IsTrue(testCondition, "TabViewItem's [IconControl] foreground color should have not been [blue]");

testCondition = !IsBrushUsingSolidColor(headerPresenter.Foreground, Colors.Blue);
Verify.IsTrue(testCondition, "TabViewItem's [ContentPresenter] foreground color should have not been [blue]");

Log.Comment("Set the foreground color of the TabViewItem to [blue]");
tabViewItem2.Foreground = new SolidColorBrush(Colors.Blue);

testCondition = IsBrushUsingSolidColor(tabViewItem2.Foreground, Colors.Blue);
Verify.IsTrue(testCondition, "TabViewItem's foreground color should have been [blue]");

testCondition = IsBrushUsingSolidColor(iconControl.Foreground, Colors.Blue);
Verify.IsTrue(testCondition, "TabViewItem's [IconControl] foreground color should have been [blue]");

testCondition = IsBrushUsingSolidColor(headerPresenter.Foreground, Colors.Blue);
Verify.IsTrue(testCondition, "TabViewItem's [ContentPresenter] foreground color should have been [blue]");

bool IsBrushUsingSolidColor(Brush brush, Color color)
{
return brush is SolidColorBrush scBrush && scBrush.Color == color;
}
Felix-Dev marked this conversation as resolved.
Show resolved Hide resolved
});
}

private static void VerifyTabWidthVisualStates(IList<object> items, bool isCompact)
{
foreach (var item in items)
Expand Down
Loading