FAB is showing a white border, but it shouldn't

[iurycarlos]

Current behavior

SmallFabStyle, FabStyle and LargeFabStyle are showing a white border around its content, which is separating / highlighting the shadow.

Question is that accordingly specs, FAB shouldn't have a border by default.

Expected behavior

Shouldn't present a border.

How to reproduce it (as minimally and precisely as possible)

Just use a material style of FAB.  Uno Figma Plugin v2.8.0-dev.3 Uno.UI v5.0.19 Uno.Themes v4.0.3 Uno.Toolkit.WinUI v5.0.13 Uno.Extensions v3.0.9

Nuget Package:

Uno Figma Plugin v2.8.0-dev.3 Uno.UI v5.0.19 Uno.Themes v4.0.3 Uno.Toolkit.WinUI v5.0.13 Uno.Extensions v3.0.9

Package Version(s):

Affected platform(s):

• [ ] WebAssembly
• [ ] Android
• [ ] iOS
• [ ] macOS (AppKit)
• [ ] Mac Catalyst
• [ ] Skia
  • [ ] WPF
  • [ ] GTK (Linux)
  • [ ] Linux Framebuffer
  • [ ] Tizen
• [ ] Windows

IDE:

• [ ] Visual Studio 2022
• [ ] Visual Studio 2019
• [ ] Visual Studio Code
• [ ] Visual Studio for Mac
• [ ] Rider Windows
• [ ] Rider macOS

Relevant plugins:

Anything else we need to know?

[iurycarlos]

Maybe a clue or not related:

<Page xmlns:uen="using:Uno.Extensions.Navigation.UI" xmlns:uer="using:Uno.Extensions.Reactive.UI" xmlns:utu="using:Uno.Toolkit.UI" xmlns:utum="using:Uno.Toolkit.UI.Material" xmlns:muxc="using:Microsoft.UI.Xaml.Controls" xmlns:um="using:Uno.Material" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="using:DevQA20231009" x:Class="DevQA20231009.FAB_Overrides_Light" mc:Ignorable="d" Background="{ThemeResource BackgroundBrush}" NavigationCacheMode="Required" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
  <Page.Resources>
    <x:String x:Key="Icon_Add">F1 M 16 9.142857142857142 L 9.142857142857142 9.142857142857142 L 9.142857142857142 16 L 6.857142857142857 16 L 6.857142857142857 9.142857142857142 L 0 9.142857142857142 L 0 6.857142857142857 L 6.857142857142857 6.857142857142857 L 6.857142857142857 0 L 9.142857142857142 0 L 9.142857142857142 6.857142857142857 L 16 6.857142857142857 L 16 9.142857142857142 Z</x:String>
  </Page.Resources>
  <utu:AutoLayout Background="{ThemeResource BackgroundBrush}" Spacing="20" Padding="10">
    <Button utu:AutoLayout.CounterAlignment="Center" CornerRadius="10,0,0,0" Style="{StaticResource SmallFabStyle}">
      <um:ControlExtensions.Icon>
        <PathIcon Data="{StaticResource Icon_Add}" />
      </um:ControlExtensions.Icon>
    </Button>
    <Button Content="This is a Floating Action Button" utu:AutoLayout.CounterAlignment="Center" Width="405" CornerRadius="20" Style="{StaticResource SmallFabStyle}">
      <um:ControlExtensions.Icon>
        <PathIcon Data="{StaticResource Icon_Add}" />
      </um:ControlExtensions.Icon>
    </Button>
  </utu:AutoLayout>
</Page>

[kazo0]

I'm assuming this is due to the ElevatedView?

@Youssef1313 could this be a result of the recent work on the ElevatedView?

[Youssef1313]

This is for Wasm?

Do we have a repro in a new UnoApp?

[iurycarlos]

Yes! Wasm. It is the Figma Plugin. No, i didn't try it on a new app. But it happens at canary:

https://playgroundcanary.z19.web.core.windows.net/#2c878a17

[Darsh0307]

@Youssef1313 I did created a new Uno app , It was showing me the white background which lury mentioned about

[Darsh0307]

Its working completely fine on windows but its showing the white background on wasm

[Darsh0307]

This issue is for Uno core.