Blog, CanvasApps, Troubleshooting

Canvas Apps: Watch PCF Component

Historically, I had no projects where I could work with CanvasApps/Custom Pages. The basics that I learned during the App-in-the-day classes didn’t give me a full understanding of where such apps can be used and how to architect and build them. A few months back I was looking for a new project (if you have a project you want me to help you with don’t hesitate to reach out to me) and I was lucky to find a wonderful project where my main duty was to enhance existing and develop new custom pages.

When I needed to build and, especially, troubleshoot an app I found out that the “watch” that I as a developer used to have either in Visual Studio or Browser Developer Tools was quite limited. Here is an example of OOB tools from “maker experience”:

So what does that “?” mean? After a few attempts to use OOB debugging tools (and if I’m missing something please forgive my ignorance), I created my own “watch” for Canvas Apps. Check out what I achieved so far:

If you want to use this tool here is the instruction:

  • Download the solution from the GitHub repository.
  • Import solution to the Dataverse instance.
  • Double-check that the “PowerApps Component Framework for Canvas Apps” feature is enabled.
  • Import the component into the App and add it to the screen:

  • In the properties pane look for the “Observables” property and populate it with the object that will contain all the variables/collections like the following:

  • Run the app and click “Ctrl-Shift-B” to open “Watch”:

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.