Fluent UI Control not work in mobile( Wave 2)

[PCFCrazyDevelop]

Hi,

I created PCF Dataset control using Fluent UI React. All the control works fine in all device previously but after activating wave 2 in my organization most of Fluent UI control stop working in mobile.

Below are the control list that stop working:

• Dropdown
• Modal
• Contextual sub menu

Thanks!

[DianaBirkelbach]

Hi @PCFCrazyDevelop , 

I just checked it on my controls, and seems that I have the same issue (I have also Wave 2, but I cannot say when I've tested the last time). 

The Control using a DropDown from FluentUI shows the values, but cannot be opened to change the value ( in the PowerApps mobile app on IOS).

This could be a serious issue.
I was happy that it worked, but I wondered how can we be sure that it won't break, since the FluentUI adds a DIV on the bottom of the page for showing the options (not in the Div-Area that's reserved for the control).

Hopefully this get fixed.

Kind regards,

Diana

[ScottDurow]

I have the same issue - trying to work out why it's happening. 

It seems to be something to do with the way that the dropdown flight out is handled on the mobile client.

Fluent shows a different experience if you have limited width - it will show a right hand side flyout instead of a drop down.
Wide form factor.

On a narrow form factor it's a right hand side flyout.

The native app experience presents as a mobile friendly drop down:

I'll keep you posted!

[ScottDurow]

Ok - so the work around for now (until we get to the bottom of this) is to set the responsiveMode on the dropdown control:

<Dropdown
    ...
    responsiveMode={ResponsiveMode.unknown}
    ...
/>

This forces the drop down to present as an inline dropdown even on the narrow app form factor.  

[Anonymous]

Hi,

Thanks for your reply.

I tried your suggestion it work my end but if I use below option then it not work in wave 2 for mobile.

responsiveMode={ResponsiveMode.small}

  Can you provide any suggestion for modal and contextual menu(Sub menu) same also not opening in wave 2 for mobile.

Thanks!

[ScottDurow]

Can you show me a screenshot of what's not working on sub menus?

[Anonymous]

Hi,

Thanks for reply.

I notice that contextual menu did not show sub menu. If in mobile I try to open modal as it not visible in mobile and after that if I open contextual menu and click on sub menu then it not visible. Otherwise contextual menu and it sub menu is working.

Can you provide me some suggestion for how to display modal on mobile.

Thanks!

[jolake]

Hi all,

We are tracking this internally and hope to have a fix soon. If someone can provide a control solution with a control they know will reproduce this issue, that would be helpful in expediting the investigation process. Anyone with a before/after screenshot would also be appreciated to confirm we re-establish functionality on par with what it was before the regression.

Thanks,

-John

[ScottDurow]

This issue can be observed with the PCF sample - https://github.com/microsoft/PowerApps-Samples/blob/master/component-framework/TS_ReactStandardContr...

A dropdown would normally show on the mobile as a flyout on the right - but now it just doesn't appear at all.

[HemantG]

Quick update on this. We are able to reproduce the issue and are working on rolling out the fix for the same.

This was regression caused by side effect of react native changes for the Dynamics Mobile client. 

Please reach out to me if there are any questions.  I will update the thread once deployment schedule is determined. 

Thanks for reporting and working with us on the repro and sorry for the inconvenience caused. 

Thanks,

Hemant