The Placeholder text is not adopting to the Text Spacing.

[msftedad]

🐛 Bug Report

The Placeholder text is not adopting to the Text Spacing,
Low vision user or dyslexic user who apply text spacing to read the content will be impacted as user will not be able to understand the content/ information present on the page.

💻 Repro or Code Sample

Pre-requisites to enable text spacing:

1. Go to - https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne?hl=en.
2. Click on ‘Add to Chrome’ button.
3. After adding, you should find Stylus icon on the browser tool bar, click it to open drop down menu.
4. Select ‘Manage Styles’ from the menu.
5. On the manage styles screen, click on ‘Create new Style’.

The New style screen would open, here give a suitable name for your new style, e.g. ‘text spacing’.

Add following CSS under ‘Code’ field –

• {

  line-height: 1.5! important;

  letter-spacing: 0.12em !important;

  word-spacing: 0.16em !important;

}

p {

 margin-bottom: 2em !important;

}

Click on ‘Save’.
https://fluentui-blazor-v5.azurewebsites.net/TextArea

Repro-steps:

1. Open URL: TextArea - FluentUI Blazor Components in latest edge browser.
2. Press tab key to reach till "ImmediateDelay' (Example tab).
3. Apply stylus tool on page.
4. Verify whether placeholder text is adopting to the Text Spacing or not.

🤔 Expected Behavior

On applying text spacing tool placeholder text should adapt to text spacing.

😯 Current Behavior

The Placeholder text is not adopting to the Text Spacing

The.Placeholder.text.is.not.adopting.to.the.Text.Spacing.mp4

💁 Possible Solution

🔦 Context

Low vision user or dyslexic user who apply text spacing to read the content will be impacted as user will not be able to understand the content/ information present on the page.
On applying text spacing tool placeholder text should adapt to text spacing.

🌍 Your Environment

• OS & Device: Windows 11 Enterprise Insider Preview Version 24H2(OS Build 26100.4061)
• Browser Edge Version: 136.0.3240.76 (Official build) (64-bit)
• .NET Version 9.0.3 and Fluent UI Blazor library Version 5.0.0-alpha.1+69a52a2b

[MarvinKlein1508]

This has already been fixed in v4 #3706

In v5 this needs to be fixed in the webcomponents itself.

[msftedad]

Hi @MarvinKlein1508, Thanks for the update. We have closed our bug as issue is fixed. So, closing this issue.