Loading...

How to Enable PCF Components for Older Canvas Apps

How to Enable PCF Components for Older Canvas Apps

The Backstory

I wanted to try and embed a browser into one of my existing canvas apps but ran into a snag.  I followed the instructions in the docs on enabling PCF components (https://docs.microsoft.com/en-us/powerapps/developer/component-framework/component-framework-for-canvas-apps) but I could only input Canvas based components, not PCF components because the "Import Components" "Code (experimental)" tab wasn't showing up even after I turned on the components preview option for the app:

I was able to eventually get the PCF Components to show up, but that required me to turn on every single preview/experimental feature of the app.  I was concerned that maybe this was because my app was running on an old version of Canvas Apps, so I upgraded by App to the latest version of the app, and PCF components were still not showing up (Again, never had any problem with Canvas components showing up).  I then proceeded to add every single experimental feature in the app settings, and again, the PCF components tab showed up, but when I imported the app into a new environment, the "Explicit Column Selection" feature broke the app.  Turning off this feature removed my PCF control from the app, so I was in a no-win situation.

To test my theory that the issue was because my app had some legacy bloat which was causing it to fail, I created a brand new app, and the PCF components showed up exactly as expected.  I then extracted my app using the CanvasApp Packager (https://github.com/daryllabar/CanvasAppPackager) and compared the differences in the extract json and found the fix!


Actual How To

To get get the PCF Controls experimental feature to show up in your older canvas app follow these steps:

  1. Export your app from the make.powerapps.com site to your machine.
  2. Unpack the app using the CanvasApp Packager (https://github.com/daryllabar/CanvasAppPackager).
  3. Open the Extract\Apps\<App Name>\Properties.json file.
  4. Search for the AppPReviewFlagsKey array.
  5. Add "nativecdsexperimental" to the end of the array e.g. "AppPreviewFlagsKey":["delayloadscreens","componentauthoring", "nativecdsexperimental"]
  6. Pack the app using the CanvasApp Packager.
  7. Import back into your make.powerapps.com environment.
  8. Enjoy being able to select your PCF components in your older Canvas App!

Published on:

Learn more
.Net Dust
.Net Dust

NULL

Share post:

Related posts

PowerFx Formatting If Statement Idiosyncrasies

Disclaimer: This entire blog is an opinion, and opinions are like butts, we all have one.  This is not doctrinal truth that must be obser...

1 year ago

Separating Plugin Logic: A Guide to Testing Dataverse Plugins with IOC

I’m not a pure TDD developer.  I frequently take my best guess at a Dataverse plugin, then apply TDD until everything works.  This c...

3 years ago

How to Filter Dates in Canvas Apps Using Greater Than/Less Than Operators

Defining the ProblemRecently I was attempting to filter an on-premise SQL table by a DateTime field using a “greater than” operator, and displ...

3 years ago

Enabling or Disabling All Plugin Steps In Dataverse

If you are facing an issue with a recent bug in PowerPlatform.BuildTools version 0.0.81 that caused your plugin steps to become disabled, fret...

4 years ago

Using AutoFixture To Create Early Bound Entities

AutoFixture is an open source library that is used in testing to create objects without having to explicit set all the values.  I recentl...

4 years ago

Long Functions Are Always A Code Smell

This article is in response to fellow MVP Alex Shelga’s recent article Long functions in dataverse plugins – is it still ” code smell”?. ...

4 years ago

Handle All Your Plugin Exceptions In One Place, And Then Hide It!

In coding, one of the recommended best practices is to avoid creating duplicate code as it leads to maintenance issues. Therefore, it is advis...

6 years ago

Newsletter

Get the latest Dynamics 365 and Power Platform content in your inbox

A curated digest of community blogs, product news, videos, and podcasts — delivered without the noise.

Weekly updates Unsubscribe anytime Fresh community picks
We use your email only for the newsletter and you can unsubscribe at any time.
By subscribing, you agree to the privacy policy.