microsoft / powercat-creator-kit

This toolkit helps create well-designed Power App experiences on the web & mobile. It contains a component library; PCF controls and other utilities that increase developer productivity.
MIT License
321 stars 53 forks source link

[BUG]: Icons on Fluent Button and Details Grid not being reflected correctly in play mode of a Canvas app in Google Chrome #497

Open Darina1010 opened 1 month ago

Darina1010 commented 1 month ago

When we open a Canvas app in Edit mode and then press Play and open the Play mode, the icons on Fluent Details list and Fluent Button seem to be working fine (Screenshot 1).

Screenshot 1

However, if we skip the Edit mode and proceed to Play straight away from the solution, the same icons don't seem to be showing up correctly (Screenshot 2).

Screenshot 2

We are using Google Chrome and the same behavior replicated for several users.

Alecarfersa commented 1 month ago

I have the same error! Do you have a solution?

angmz commented 1 month ago

I have the same error. I have tested it on both Edge and Chrome and I am using authoring version 3.24091.13. Do you have an answer?

endub-22 commented 1 month ago

Same issue for me too. seeing it on Edge Version 128.0.2739.79

Masael commented 1 month ago

Same error here, customers are complaining. Editing the app shows all icons OK but at published version fails. Is there any workaround? capture20240918-01 The issue is present even at the details list sorting arrows image

alan-reyes commented 1 month ago

I am also encountering the same issue where the Fluent Button and Details List components are not being rendered correctly.

angmz commented 1 month ago

In the code, specifically in the js CreatorKitCore/SolutionPackage/src/Controls/cat_PowerCAT.CommandBar/platformlibs/fluent_8_29_0.js, there is a reference to https://spoprod-a.akamaihd.net/files/fabric/assets/icons/, and that page is not available.

image

MaheshSripada commented 1 month ago

Thank you for reporting this issue. Our team is currently reviewing the issue and will provide updates as soon as possible.

angmz commented 1 month ago

Thank you for reporting this issue. Our team is currently reviewing the issue and will provide updates as soon as possible.

In the code, specifically in the js CreatorKitCore/SolutionPackage/src/Controls/cat_PowerCAT.CommandBar/platformlibs/fluent_8_29_0.js, there is a reference to https://spoprod-a.akamaihd.net/files/fabric/assets/icons/, and that page is not available.

MaheshSripada commented 1 month ago

Hi @Darina1010,

Can you please check if this is happening

1) By connecting to any other network if it is allowed and possible, sometimes firewall settings might be causing these kind of issues. 2) Also pls check if any errors in the Network tab / console of the browser when loading this screen.

Masael commented 1 month ago

Hello @MaheshSripada.

These are the errors shown in the network panel and console. image image

For these tests I disabled the firewall locally and connected to another network.

MaheshSripada commented 1 month ago

Unfortunately, we are unable to reproduce this issue in our environments.

To troubleshoot further, can you please check if

1) If you are able to access and download the file. https://spoprod-a.akamaihd.net/files/fabric/assets/icons/fabric-icons-0-467ee27f.woff.

2) If the endpoint https://spoprod-a.akamaihd.net/files/fabric/assets/icons/fabric-icons-0-467ee27f.woff is whitelisted.

endub-22 commented 1 month ago

I get the same error on https://spoprod-a.akamaihd.net/files/fabric/assets/icons/ but am able to download the https://spoprod-a.akamaihd.net/files/fabric/assets/icons/fabric-icons-0-467ee27f.woff file image

image

jean-goyat commented 1 month ago

Unfortunately, we are unable to reproduce this issue in our environments.

To troubleshoot further, can you please check if

  1. If you are able to access and download the file. https://spoprod-a.akamaihd.net/files/fabric/assets/icons/fabric-icons-0-467ee27f.woff.
  2. If the endpoint https://spoprod-a.akamaihd.net/files/fabric/assets/icons/fabric-icons-0-467ee27f.woff is whitelisted.

I can download the file as well but still get the same CORS issue when playing the app in apps.powerapps.com.

Weirdly enough, some of my apps are showing some icons but not all when playing the app in apps.powerapps.com (everything still shows fine in make.powerapps.com). I can't exactly pinpoint what the difference between an icon showing up or not though:

image

Is the team currently working on a solution and that's why there are now some icons showing up?

denise-msft commented 1 month ago

Hello, we are currently investigating the issue internally with the engineering team.

It would really help the investigation if anyone experiencing this issue could submit a response to this form with:

Form link: https://forms.microsoft.com/r/XErgLKUZrY

angmz commented 1 month ago

Sent the requested information.

image

denise-msft commented 1 month ago

Thank you for those of you who helped provide session details.

Unfortunately, this issue does not have a clear diagnosis without a repro. Please try some of the following steps to address this issue:

  1. Review endpoint restrictions: It appears that due to the larger audience that can use the Player team’s services, your environments/tenants may have locked down endpoints more strictly. Please ensure that your tenant or environment is following the advice provided in required services. If you have other endpoints blocked, this could be causing the issue.

  2. Short-term mitigation: As a potential short-term solution, you can try allowing the akamihd endpoint. This may help alleviate the blocking issue temporarily.

  3. Future plans: Microsoft is currently working on creating a new platform library that will not use the akamihd endpoint. However, please note that this update will take a few months to roll out and will require a control update on the Creator Kit to be consumed.

We hope these suggestions help resolve the issue. If you are able to try both mitigation steps above and continue to experience the issue, please validate which steps you took and the endpoints you chose to whitelist and let us know what you're still seeing.

jean-goyat commented 1 month ago

Thank you for those of you who helped provide session details.

Unfortunately, this issue does not have a clear diagnosis without a repro. Please try some of the following steps to address this issue:

  1. Review endpoint restrictions: It appears that due to the larger audience that can use the Player team’s services, your environments/tenants may have locked down endpoints more strictly. Please ensure that your tenant or environment is following the advice provided in required services. If you have other endpoints blocked, this could be causing the issue.
  2. Short-term mitigation: As a potential short-term solution, you can try allowing the akamihd endpoint. This may help alleviate the blocking issue temporarily.
  3. Future plans: Microsoft is currently working on creating a new platform library that will not use the akamihd endpoint. However, please note that this update will take a few months to roll out and will require a control update on the Creator Kit to be consumed.

We hope these suggestions help resolve the issue. If you are able to try both mitigation steps above and continue to experience the issue, please validate which steps you took and the endpoints you chose to whitelist and let us know what you're still seeing.

It seems this might have been an issue with akamihd (which, according to one of the sys admins on my team, were having an issue last week). All seems resolved on my end an icons are showing up normally again as of Friday 10/4✅!

Thank you for looking into this!