SharePoint / sp-dev-docs

SharePoint & Viva Connections Developer Documentation
https://docs.microsoft.com/en-us/sharepoint/dev/
Creative Commons Attribution 4.0 International
1.24k stars 1.01k forks source link

[MSIgnite] embeded teamshostedapp.aspx doesn't load in mobile #6312

Closed mgwojciech closed 2 years ago

mgwojciech commented 4 years ago

Category

Describe the bug

If I embed teamshostedapp.aspx in iframe in my spfx web part it doesn't fully load in mobile client (works in web and desktop client)

Steps to reproduce

1) Develop custom spfx web part and add iFrame with src="/_layouts/15/teamshostedapp.aspx?componentId=" 2) Allow this wp to be personal app in supportedHosts 3) Open this wp as a personal app in teams 4) In web and desktop client the embedded wp is rendered 5) Mobile client never loads web part

Expected behavior

Mobile client loads embedded web part

Environment details (development & target environment)

Additional context

Thanks in advance!

ghost commented 4 years ago

Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.

mgwojciech commented 3 years ago

Any update on this one? I also noticed that links ( elements) won't work as teams framework cannot authenticate to check page type for any links in a embedded frame

mpowney commented 3 years ago

We're now seeing very similar behaviour to this bug in the Teams app for iOS only. Ever since the introduction of Teams for iOS v3.14.0, a teams hosted web part doesn't load. Instead, the fluent ui spinner from teamslogon.aspx remains on screen, with no error handling.

The version of the app prior, Teams for iOS v3.13.1, didn't have this behaviour.

Intercepting the iOS calls with a tool like "Fiddler", or "BurpSuite" has enabled us to go deeper

There's no UI that handles the error in teamslogon.aspx, but we have extracted the message. The following error is returned by a call to the Teams SDK in teamslogon.aspx: microsoftTeams.authentication.getAuthToken(authTokenRequest) returns the failureCallback with a message:

App is neither whitelisted nor app resource matches current domain

All other platforms with this same SPFx teams hosted web part app, in the same tenant (Teams for Android, Teams for Desktop, Teams for iPadOS, and web) all successfully navigate past teamslogon.aspx

lucabandMSFT commented 2 years ago

There was a regression introduced on Teams Mobile for iOS build that we believe have been fixed now. Part of the resolution process might require for an user that has both SPO Tenant Admin and AAD Global Admin roles to simply navigate to the API Access page in SPO tenant admin to trigger code that will change some parameters in AAD.

Could you please do that and see if that solves the issue in Temas in iOS?

mpowney commented 2 years ago

Thanks Luca. I've performed the steps in my own environments where the problem has been observed, so far so good, will keep an eye on things as the problem seems to now be intermittent (or perhaps it requires a yet-to-be determined sequence of steps to reproduce).

We've asked our partners to check in with environments affected by this to do the same and provide feedback.

mpowney commented 2 years ago

Hi @lucabandMSFT it seems the behaviour is still seen in environments where the steps to fix have been actioned. Both directly observed myself, and reports from our partners.

We have a conversation thread in a Teams channel with our partners going on this issue with feedback from 2 partners since highlighting the API access fix. We also have some experience from our own internal testing.

Some further detail I can pass on from there:

Behaviour is intermittent on iOS

Browse to the SPFx app in Teams for iOS, it will some times render the app as expected, but other times (more often), will not, and instead remain on the teamshostedapp.aspx spinner page. It seems more likely to work when you open the Teams app, browser to the SPFx app, navigate to another app in the app bar, then navigate back to the SPFx app

Similar experience on Teams for Android

Wer're getting consistent reports that the SPFx app doesn't load at all in Teams for Android, after completing the steps of browsing to the API access page as an SPO / AAD admin.

lucabandMSFT commented 2 years ago

@mpowney , thanks. I assume you did visit the API Access page with an user that is both SPO Tenant admin and AAD Global admin, right? If that's the case, could you please take a trace in Teams rich client for the failing SPFx app / tab and send it to us?

mpowney commented 2 years ago

Can do. Is there a tool you recommend to take the trace from the rich iOS app? Likewise for the Android app?

lucabandMSFT commented 2 years ago

for Android, I would use "Android Studio" and the emulator on a PC.. for iOS.. not sure. I will ask but it is public holidays here in US so it might take a couple of days for me to come up with an answer.

lucabandMSFT commented 2 years ago

There are some more information for Android here: https://docs.microsoft.com/en-us/microsoftteams/platform/tabs/how-to/developer-tools

mpowney commented 2 years ago

I have an HAR file of the Android Emulator session, which I can send through. What's the best way of sharing it?

Some observations from the Chrome devtools attached to an emulator:

lucabandMSFT commented 2 years ago

Thanks a lot @mpowney , can you attach the file here in the reply text box?

lucabandMSFT commented 2 years ago

Downloaded, thanks. you can remove it if you want.

Just to be clear on the behavior: you say that even if you log in to SharePoint first (in the web browser) with the same user, it still doesn't work in Teams Mobile, correct?

mpowney commented 2 years ago

Yes confirmed using Chrome on the same Android OS emulator device, authenticating to the same site as the SPFx web part works as expected

mpowney commented 2 years ago

Further testing with different Teams app manifests shows replacing a {teamsSiteDomain} placeholder in the webApplicationInfo section of the manifest enables the SPFx web part to work as a Teams app.

App manifest that doesn't work:

  ...
  "webApplicationInfo": {
    "id": "00000003-0000-0ff1-ce00-000000000000",
    "resource": "https://{teamSiteDomain}"
  }
  ...

App manifest that works:

  ...
  "webApplicationInfo": {
    "id": "00000003-0000-0ff1-ce00-000000000000",
    "resource": "https://xxx.sharepoint.com"
  }
  ...
lucabandMSFT commented 2 years ago

ok, thanks @mpowney , let me check internally and we will be back here in a couple of days (most likely Monday next week as there's a big week end here in US due Thanksgiving holiday)

mpowney commented 2 years ago

Hopefully this doesn't add to the confusion, however my observations today with the same tenant, same staticTabs values and webApplicationInfo values inside the Teams app manifest, loading the app on Teams for Android is now successful.

lucabandMSFT commented 2 years ago

@mpowney , thanks. Which one is working thou? the one with {teamSiteDomain}? or the one with "resource": "https://xxx.sharepoint.com"?

mpowney commented 2 years ago

Both now work, including the one with {teamSiteDomain} and the other with https://xxx.sharepoint.com

lucabandMSFT commented 2 years ago

seem this has been solved now according to the last comment. Closing

ghost commented 2 years ago

Issues that have been closed & had no follow-up activity for at least 7 days are automatically locked. Please refer to our wiki for more details, including how to remediate this action if you feel this was done prematurely or in error: Issue List: Our approach to locked issues