Check developer console in MS teams Tab App - microsoft-teams

I have created a personal Tabs app and deployed the same on MS teams.
Things are working as expected, but at 1 stage of time, my application goes back to the original "contentUrl" page as defined in the manifest.json file.
This might be an issue with my frontend code, so i wanted to understand how can we debug the frontend developer console to check if there's any error being thrown from my application?

The only way to figure out what is going on is to use the DevTools. To use DevTools in the desktop client, you must:
Ensure you have enabled developer preview.
Open up a tab so you have something to inspect with the DevTools.
Open the DevTools one of the following ways:
On Windows, you open DevTools via the Microsoft Teams icon in the
desktop tray.
The following example shows DevTools open and inspecting a tab configuration dialog:
Ref Doc-https://learn.microsoft.com/en-us/microsoftteams/platform/tabs/how-to/developer-tools

Related

Teams applications: Auto-suggestions actions are automatically opened in our chat

When we open the Teams applications with a chat the auto-suggestions menu is automatically opened.
Are there any way to disable it?
We tried it for few different MS Teams apps and it is reproduced for all.
It is reproduced in ~90% cases.
We started facing it recently and didn't remember such behaviour before.
Steps to reproduce:
Open app with chat
Expected result:
Auto-suggestion menu is not opened
Actual result:
Auto-suggestion menu is opened
This seems to be expected behaviour of Bot having commands. These bot commands will pop up automatically. There is no way to disable it

Can't debug my microsoft teams tab using DevTools

I'm trying to get console logs from my tab using DevTools in Microsoft Teams. I can open the console, but my logs are not showed and I'm getting the following error instead:
The Content-Security-Policy directive 'prefetch-src' is implemented behind a flag which is currently disabled.
I tested my application in Chrome and I can see the logs properly.
If you mean in the desktop version of Teams, then when you access via DevTools (sounds like this is what you're doing), try choosing All WebContents. Remember, Teams is an electron app historically, so everything is a "web" content - you'll get multiple DevTools windows and you need to find which is the right one for your tab. Screenshot below shows this option.
But, a better tip, if you're actively developing your tab, is just to run Teams in a browser directly (browse to teams.microsoft.com) - then it's just a single DevTools option and easier to manage.

"App not found, Please verify..." when launching from Visual Studio, but installs normally from Developer Portal

I'm currently learning Teams development and I just installed the Teams Toolkit extension. Following the quickstart guide, launching the app opens my browser with the Teams web app and the message
App not found, Please verify the app and it's[sic] access
permissions.
Fortunately, this app can still be launched when selecting the "Preview in Teams" option in the Developer Portal.
Quoting the GettingStarted.txt:
If you Start Debugging in a browser and Teams shows the message "App not found, Please verify the app and it's access permissions", it means the app hasn't been uploaded to Teams Dev Portal. To resolve this, follow the steps in the Quick start section above. The Project > TeamsFx > Configure for SSO menu command will do this step for you.
Except it was successfully uploaded to Dev Portal.
What I did
Did this "Configure for SSO" thing. No problems with that and the app was successfully added to the Developer Portal.
Where I searched for an answer
VS Marketplace page for Teams Toolkit (Reviews, Q&A)
Github page (issues) for Teams Toolkit
This very site - Stack Overflow.
Obviously, I'm not 100% sure that I haven't missed anything.
Temporary solution
In the meantime, I set the "launchBrowser" property to "false" in launchSettings.json. However, it's a waste of time to constantly go back to the Developer Portal to launch it, especially when the functionality is there.
Visual Studio 2019, Microsoft Development Account.
Thanks in advance.
We tried to repro this issue at our end and it is working fine for us. Could you please make sure app is opened in same tenant with which you configured for SSO. Also please remove all credentials from cache to make sure its not taking another credentials and try again.
Assuming nothing else was changed from the new project template, there are a few things you can try to narrow down the issue.
Open your browsers web dev tools and watch the console after clicking the Add button (before you see the error message). Sometimes a useful error message from the developer portal helps identify the issue.
Verify that when Visual Studio launches the URL, the correct tenant is loaded in Teams.
Run the project in VS, then manually navigate in your browser to the endpoint of your tab that you expect to work. It would be something like https://localhost:44357/tab by default (the value is in the manifest.json). The sample won't work completely because it's not running inside Teams, but you should be able to verify it's working locally.
If none of that helps, please log an issue on the GitHub page and we can investigate a bug.

Cannot start web-simulator on google actions for API.AI project

I am working on Google Cloud Platform to develop a project in API.AI, I have an integration (in API.AI) with Google Actions (for Google Home or Google Assistant), they provide me to see my progress as real time in web-simulator, that you can find here:
https://developers.google.com/actions/tools/web-simulator
I am trying to START the web-simulator clicking on START button, then I get a window pop-up but after open, it closes, I try and try again but I obtain the same result, I cannot open the web-simulator. I have allowed the popup windows in my browser.
Of course I have completed all steps to start web-simulator...
I don't know what is happening. Someone can help me? Thank you, have a good day.
First, are you using a compatible browser? Try it in Chrome if you're
not already using it, as Chrome is a Google product, and so is the
web simulator.
Next, are you using any Ad-Blockers or
Script-Blockers like NoScript? If so, try disabling them, as they
could interfere with the operation of the tool.
If it still doesn't work, try going to an Incognito Windows by pressing the
three dots button and opening a New Incognito Window. Go to the page, and log
in. This will ensure that no cookies are interfering.
At this point, if you're still having issues, try a different browser.
(Either Firefox or Opera)

Visual Studio with Web Essentials, unused CSS is not working

I am working on a .NET 4.5.1 project in Visual Studio and have Web Essentials installed and functioning in all other ways except finding unused CSS. When I test with a new project, it works as expected.
Is there a known situation in which Unused CSS will not work?
Environment:
VS2013 Pro
Win7 Pro
Steps to reproduce:
Start debugging the app in Chrome
Once the site opens in a new tab, select Start Recording in the Browser Link Dashboard
Change content by clicking through the site
Results:
Recording has started and Stop Recording is now available
There are no messages sent to the output window
Clear CSS Usage Data option in the Browser Link toolbar (in the top menu) is disabled. It never is enabled whether recording or not.
Expected:
Messages in the output view
Ability to clear CSS usage data
Attempts to troubleshoot:
Installed prior version of extension - same result
Verified the issue exists on Chrome, Firefox and IE
Other features of Browser Link work as expected
Creating a new project works as expected and "Clear CSS usage data" is not greyed out
Browser Link drop down menu
I know it's a long time since you asked this, but this solution might actually help someone else...You can identify unused CSS using Chrome Dev tools
Open your chrome Dev tools
Click on the Audits tab
Click on Run at the bottom, wait for the audit to finish
You will get unused CSS under Remove unused CSS rules in the Web Page Performance section

Resources