[Question]: Do you consider supporting a 320px viewport

[smhigley]

(moving this over from an issue to a discussion; original issue from @wanghe2015: #33364)

Area

React Components (@fluentui/react-components)

Describe the feature that you would like added

Hi team,

When our A11y team test 320 px view, they found multidimensional scroll. But based on https://learn.microsoft.com/en-us/microsoftteams/hardware-requirements-for-the-teams-app, the document shows that the suggested display is 1024x768. The min width supported by web and desktop version of MS Teams is 768px,

Are you going to support 320 px view?

[smhigley]

Hi @wanghe2015! I moved your issue over here since it was a question and not an active bug with a Fluent control.

The answer is pretty straightforward -- yes, we do support and test for the Reflow WCAG requirement down to a viewport of 320px for our controls. I'm not sure why you cited the Teams app's Windows hardware requirements, but they have no bearing on what we support for Fluent UI, which is a separate product & codebase, and is not Teams.

Since Fluent is a control library, we just ensure that each control will individually work at a viewport of 320px. Generally Reflow is going to be much more dependent on how the entire web page or app is laid out and the higher-level structural styles, rather than individual components. However, if you do find a bug with an individual component not meeting Reflow requirements, please feel free to log a bug on this repo.

There is also new internal guidance on the specifics of testing Reflow that will be coming out soon (it's been underway for around a year, it's a complicated requirement 😅). However, those updates also are more concerned with page- or app-level structure than individual components.

Hope that answers your question!

[smhigley]

edit -- oops, looks like two of us converted this to a discussion at the same time 😅