I am on .Net 8.0 VS 2022. Created a blank teams tab app as mentioned here and ran it in development mode. However after I [Add] as in step 5 the TAB is empty. It doesn't hit
OnAfterRenderAsync()
in Welcome component which is inside the Tab.razor file.
Funny thing is if I then click on the [About] tab and click on the Website link then it goes to Tab.razor and loads the Welcome component. Again at this point,
MicrosoftTeams.IsInTeams()
is false. I expect it to be true because I am already logged in to MSTeams web app in the same browser. According to the documentation at this point it should show my name since I am logged in to MSTeams.
So above is my first confusion.
Then I went on to develop the blazor app. That goes all ok, but still the Tab is empty and If I go to [About], click website link then my app is loading and work as expected.
Looking at how things are wired up it first loads the _Host.cshtml which loads App component (App.razor) which again loads MainLayout which renders the body. So as to my understanding Tab should not be empty.
This is very easy to recreate, just have to create a new tab app project, Prepare the dependencies and press F5 to debug.
So right now I have the full blazor app completed but not being able to get it inside MS Teams!! very frustrating. What may be the problem?
Thank you for your question. Based on your description, I think you can try logging out of your Teams account in your browser and clearing your browser cache, then logging in again to the same account as in step 2 and trying to debug again.
The Website link you clicked on in the [About] tab and using MicrosoftTeams.IsInTeams() on that page should be wrong because that page opens up a local service that is not in Teams. You can check the url in the Website link again, it should show "https://localhost:44302", and this page will show up correctly, which means your local service is starting correctly.