microsoft-graph-toolkit icon indicating copy to clipboard operation
microsoft-graph-toolkit copied to clipboard

[BUG] Getting error in Microsoft Teams Tab App by Using latest version of mgt-msal2-provider": "^4.3.0"

Open sabeehsharif opened this issue 1 year ago • 4 comments

Bug: I have added mgt-msal2 in spfx react project for teams tab app, after deployment working fine in SharePoint page but not working in teams tab.

Describe the bug Getting this error Y at J. (https://res-1.cdn.office.net/files/sp-client/ms-graph-v3-bundle_none_af6d1c33c0715ed87fd9.js:3:34896) at Generator.next ()

image

To Reproduce

Screenshots screenshot added.

Environment (please complete the following information):

  • Framework [react]
  • Context [Microsoft Teams, SharePoint]
  • Node Version [v18.20.4]
  • Provider [Msal2Provider]

Additional context

Following is my pacakge.json { "name": "chatbot", "version": "0.0.1", "private": true, "engines": { "node": ">=18.17.1 <19.0.0" }, "main": "lib/index.js", "scripts": { "build": "gulp bundle", "clean": "gulp clean", "test": "gulp test" }, "dependencies": { "@fluentui/react": "^8.120.7", "@fortawesome/fontawesome-svg-core": "^6.6.0", "@fortawesome/free-solid-svg-icons": "^6.6.0", "@fortawesome/react-fontawesome": "^0.2.2", "@microsoft/mgt-components": "^4.3.0", "@microsoft/mgt-element": "^4.3.0", "@microsoft/mgt-msal2-provider": "^4.3.0", "@microsoft/sp-component-base": "1.19.0", "@microsoft/sp-core-library": "1.19.0", "@microsoft/sp-lodash-subset": "1.19.0", "@microsoft/sp-office-ui-fabric-core": "1.19.0", "@microsoft/sp-property-pane": "1.19.0", "@microsoft/sp-webpart-base": "1.19.0", "@pnp/sp": "^2.11.0", "react": "17.0.1", "react-dom": "17.0.1", "tslib": "2.3.1" }, "devDependencies": { "@microsoft/eslint-config-spfx": "1.20.1", "@microsoft/eslint-plugin-spfx": "1.20.1", "@microsoft/rush-stack-compiler-4.7": "0.1.0", "@microsoft/sp-build-web": "1.20.1", "@microsoft/sp-module-interfaces": "1.20.1", "@rushstack/eslint-config": "2.5.1", "@types/react": "17.0.45", "@types/react-dom": "17.0.17", "@types/webpack-env": "~1.15.2", "ajv": "^6.12.5", "eslint": "8.7.0", "eslint-plugin-react-hooks": "4.3.0", "gulp": "4.0.2", "typescript": "4.7.4" } }

sabeehsharif avatar Oct 06 '24 12:10 sabeehsharif

Hi @sabeehsharif, thank you for opening this issue. Would you please share a small repro of your code? Have you included TeamsTab in your suppportedHosts in the manifest.json file?

Mnickii avatar Oct 08 '24 09:10 Mnickii

Thanks for your reply @Mnickii yes i have added supported host in manifest file. i think issue is in my manifest.json, which required for teams tab deployment following is manifest.json

  1. I'm not replacing {teamSiteDomain}, {teamSitePath} and with any value it should be automatically populated after deployment. right?
  2. From app catalog i synced with teams it synced successfully but when im trying to add in teams tab giving something went wrong without any console error.
  3. before deployment gulp bundle --ship and gulp package-solution --ship i have added TeamsSPFxApp.zip in pacakge. still getting same issue.
  4. a73d8653-4957-469d-a9c6-0deccc05efff this one this sppkg id.

{ "$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.11/MicrosoftTeams.schema.json", "manifestVersion": "1.11", "version": "1.0.0", "id": "a73d8653-4957-469d-a9c6-0deccc05efff", "packageName": "Teams-Tab-Dev-update", "developer": { "name": "Your Company", "websiteUrl": "https://www.microsoft.com", "privacyUrl": "https://www.microsoft.com/privacy", "termsOfUseUrl": "https://www.microsoft.com/terms" }, "name": { "short": "Teams Tab Dev", "full": "Teams Tab Dev" }, "description": { "short": "Teams Tab Dev", "full": "Teams Tab Dev" }, "icons": { "color": "a73d8653-4957-469d-a9c6-0deccc05efff_color.png", "outline": "a73d8653-4957-469d-a9c6-0deccc05efff_outline.png" }, "accentColor": "#FFFFFF", "permissions": [ "identity", "messageTeamMembers" ], "validDomains": [ ".login.microsoftonline.com", ".sharepoint.com", "*.sharepoint-df.com", "spoppe-a.akamaihd.net", "spoprod-a.akamaihd.net", "resourceseng.blob.core.windows.net", "msft.spoppe.com" ], "webApplicationInfo": { "resource": "https://{teamSiteDomain}", "id": "00000003-0000-0ff1-ce00-000000000000" }, "configurableTabs": [ { "configurationUrl": "https://{teamSiteDomain}{teamSitePath}/_layouts/15/TeamsLogon.aspx?SPFX=true&dest={teamSitePath}/_layouts/15/teamshostedapp.aspx%3FopenPropertyPane=true%26teams%26componentId=a73d8653-4957-469d-a9c6-0deccc05efff%26forceLocale={locale}", "canUpdateConfiguration": true, "scopes": [ "team", "groupchat" ], "context": [ "channelTab", "privateChatTab", "meetingChatTab", "meetingDetailsTab", "meetingSidePanel" ] } ] }

sabeehsharif avatar Oct 09 '24 12:10 sabeehsharif

Thank you for your reply @sabeehsharif , do you have a github repo with the webparts code I could look at?

Mnickii avatar Oct 14 '24 09:10 Mnickii

This issue has been automatically marked as stale because it has been marked as requiring author feedback but has not had any activity for 4 days. It will be closed if no further activity occurs within 3 days of this comment.