{"id":25678,"date":"2020-11-20T13:12:55","date_gmt":"2020-11-20T13:12:55","guid":{"rendered":"https:\/\/www.inogic.com\/blog\/?p=25678"},"modified":"2020-11-23T05:45:02","modified_gmt":"2020-11-23T05:45:02","slug":"how-to-debug-an-app-using-canvas-app-monitor","status":"publish","type":"post","link":"https:\/\/www.inogic.com\/blog\/2020\/11\/how-to-debug-an-app-using-canvas-app-monitor\/","title":{"rendered":"How to Debug an App using Canvas App Monitor"},"content":{"rendered":"<h1><strong>Introduction<\/strong><\/h1>\n<p>The PowerApps is an application development service to build custom and business applications. Using custom business apps, users can connect to data and work on the web and mobile. After the development of business applications, some users want to identify where they are getting the error from or want to just check the performance. For this, Canvas App has introduced the Monitor tool which will provide a way to view the stream of events from the user sessions and help them to diagnose the issues.<\/p>\n<p>In this blog, I have used the Patch request to update the status of the record but somehow it does not seem to be working. To check this issue, I am going to use the Monitor tool.<\/p>\n<p><strong><em>Note: This command checker can be seen only on the UI. <\/em><\/strong><\/p>\n<p><strong>Working:<\/strong><\/p>\n<p>Here, I have created the app \u2018My App\u2019. After creating the App, I selected it for editing as shown in the below screenshot:<\/p>\n<p><a href=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-1.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter wp-image-25679 size-full\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-1.png\" alt=\"How to Debug an App using Canvas App Monitor\" width=\"1365\" height=\"657\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-1.png 1365w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-1-300x144.png 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-1-768x370.png 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-1-1024x493.png 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-1-660x318.png 660w\" sizes=\"(max-width: 1365px) 100vw, 1365px\" \/><\/a><\/p>\n<p>Here, I have created a \u2018Patch\u2019 request to update the status of the record on click of the button, as shown below:<\/p>\n<p>Patch(Accounts,BrowseGallery1.Selected, {Status:&#8217;Status (Accounts)&#8217;.Inactive})<\/p>\n<p>A plugin is also created to throw errors when the status is updated. Here, I have used the below code to throw errors from the plugin:<\/p>\n<p>thrownewException(&#8220;Canvas App error&#8221;)<\/p>\n<p>Now to monitor\/debug the \u2018App\u2019, select the Advanced Tool on the left pane of the App, as shown in the below screenshot:<\/p>\n<p><a href=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-2.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter wp-image-25680 size-full\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-2.png\" alt=\"How to Debug an App using Canvas App Monitor\" width=\"1363\" height=\"659\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-2.png 1363w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-2-300x145.png 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-2-768x371.png 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-2-1024x495.png 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-2-660x319.png 660w\" sizes=\"(max-width: 1363px) 100vw, 1363px\" \/><\/a><\/p>\n<p>On clicking the \u2018Advanced Tool\u2019 icon, it will open the window which will show the Monitor option. Now click on the option \u2018Open Monitor\u2019 as shown in the below screenshot:<\/p>\n<p><a href=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-3.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter wp-image-25681 size-full\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-3.png\" alt=\"How to Debug an App using Canvas App Monitor\" width=\"945\" height=\"645\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-3.png 945w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-3-300x205.png 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-3-768x524.png 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-3-660x450.png 660w\" sizes=\"(max-width: 945px) 100vw, 945px\" \/><\/a><\/p>\n<p>It will open the Monitor page, click on the \u2018Play Published App\u2019 as shown in the below screenshot. This will open the published app in a new browser tab and will connect it to the current Monitor session. It will now immediately show events in the Monitor such as loading of the app in the web player and our interactions with the published app.<\/p>\n<p><a href=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-4.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter wp-image-25682 size-full\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-4.png\" alt=\"How to Debug an App using Canvas App Monitor\" width=\"1353\" height=\"409\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-4.png 1353w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-4-300x91.png 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-4-768x232.png 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-4-1024x310.png 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-4-660x200.png 660w\" sizes=\"(max-width: 1353px) 100vw, 1353px\" \/><\/a><\/p>\n<p>The created events of the user session will be shown as per the below screenshot. In the below sessions, you can see where it\u2019s getting failure, success, and where it\u2019s taking time.<\/p>\n<p><a href=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-5.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter wp-image-25683 size-full\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-5.png\" alt=\"How to Debug an App using Canvas App Monitor\" width=\"1361\" height=\"607\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-5.png 1361w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-5-300x134.png 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-5-768x343.png 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-5-1024x457.png 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-5-660x294.png 660w\" sizes=\"(max-width: 1361px) 100vw, 1361px\" \/><\/a><\/p>\n<p>Here, when I get the error, I will click on the Bad request row and then I will be able to monitor from where I am getting the error as shown in the below screenshot:<\/p>\n<p><a href=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-6.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter wp-image-25684 size-full\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-6.png\" alt=\"How to Debug an App using Canvas App Monitor\" width=\"1363\" height=\"659\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-6.png 1363w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-6-300x145.png 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-6-768x371.png 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-6-1024x495.png 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-6-660x319.png 660w\" sizes=\"(max-width: 1363px) 100vw, 1363px\" \/><\/a><a href=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-7-1.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter wp-image-25687 size-full\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-7-1.png\" alt=\"How to Debug an App using Canvas App Monitor\" width=\"1365\" height=\"657\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-7-1.png 1365w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-7-1-300x144.png 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-7-1-768x370.png 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-7-1-1024x493.png 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-7-1-660x318.png 660w\" sizes=\"(max-width: 1365px) 100vw, 1365px\" \/><\/a><\/p>\n<p>After monitoring, I removed the plugin for the \u2018Account\u2019 entity from where it was purposely throwing the error. And now it is showing a success message.<\/p>\n<p>To monitor the Published app, go to the Created Apps page, select the App, and then you will see the Monitor option on the ribbon bar as shown in the below screenshot:<\/p>\n<p><a href=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-8.png\" target=\"_blank\" rel=\"noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter wp-image-25686 size-full\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-8.png\" alt=\"How to Debug an App using Canvas App Monitor\" width=\"1361\" height=\"477\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-8.png 1361w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-8-300x105.png 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-8-768x269.png 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-8-1024x359.png 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-8-660x231.png 660w\" sizes=\"(max-width: 1361px) 100vw, 1361px\" \/><\/a><\/p>\n<h1><strong>Conclusion<\/strong><\/h1>\n<p>In this way, by using Canvas App Monitor you can easily verify the error in the code and find out why it is not working properly, thereby helping you to rectify the same.<\/p>\n<p><a href=\"https:\/\/www.inogic.com\/product\/productivity-apps\/undo-restore-recover-deleted-dynamics-365-crm-records\" target=\"_blank\" rel=\"noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter wp-image-25708 size-full\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor.jpg\" alt=\"How to Debug an App using Canvas App Monitor\" width=\"800\" height=\"200\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor.jpg 800w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-300x75.jpg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-768x192.jpg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2020\/11\/How-to-Debug-an-App-using-Canvas-App-Monitor-660x165.jpg 660w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Introduction The PowerApps is an application development service to build custom and business applications. Using custom business apps, users can connect to data and work on the web and mobile. After the development of business applications, some users want to identify where they are getting the error from or want to just check the performance.\u2026 <span class=\"read-more\"><a href=\"https:\/\/www.inogic.com\/blog\/2020\/11\/how-to-debug-an-app-using-canvas-app-monitor\/\">Read More &raquo;<\/a><\/span><\/p>\n","protected":false},"author":13,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[1954,16,19,38,2053],"tags":[1867,246,488,545,592],"class_list":["post-25678","post","type-post","status-publish","format-standard","hentry","category-canvas-apps","category-dynamics-365","category-dynamics-crm","category-microsoft-powerapps","category-power-apps-portals","tag-canvas-app","tag-canvas-app-in-powerapps","tag-debugging","tag-dynamics-365-crm","tag-dynamics-crm"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/25678","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/comments?post=25678"}],"version-history":[{"count":0,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/25678\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/media?parent=25678"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/categories?post=25678"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/tags?post=25678"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}