Issue with PCF TSImageUploadControl - Default image not found error

(0) Share

Report

Posted on by Rajesh

104

I've deployed the TSImageUploadControl code from github as per the instructions.

https://github.com/microsoft/PowerApps-Samples/tree/master/component-framework/TS_ImageUploadControl

The upload is working fine. However the default image is not being set. I'm getting the error "Image not found" in this line.

this._context.resources.getResource(DefaultImageFileName, this.setImage.bind(this, false, "png"), this.showError.bind(this));

private setDefaultImage():void
		{
			this._context.resources.getResource(DefaultImageFileName, this.setImage.bind(this, false, "png"), this.showError.bind(this));
			this.controlContainer.classList.add(NoImageClassName);

			// If it already has value, we need to update the output
			if(this._context.parameters.value.raw)
			{
				this._value = null;
				this._notifyOutputChanged();
			}
		}

After the call to getResource, the error function showError is called which displays the image not found message. The image default.png is in the "img" folder. I've tried to debug in developer tools, however I'm unable to find the actual exception that is thrown by getResource. Are you able to help?

Thanks

Categories:

Power Apps Pro Dev & ISV

I have the same question (0)

All responses (11)

Answers (0)

Sort by

Diana Birkelbach 3,072 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!
Hi @Rajesh ,

I think the DefaultImageFileName should include "img/"
const DefaultImageFileName:string = "img/default.png";
Maybe you can have a look in Network Monitor (F12 in Chrome), to see the URL of the image being loaded.

Hope this helps,
Diana

Was this reply helpful? Yes No
Rajesh 104 on at

Like (0)

Report
Copy link

Link copied!

Thanks @DianaBirkelbach for your reply. I had tried what you suggested. Issue doesn't seem to be with that. I can see the file path being sent correctly to the getResource resolve function as "img/default.png", but the function fails to resolve and then throws the error message in showError function. It looks like a bug in getResource function. Could the PCF dev team please look into this?

Was this reply helpful? Yes No
v-xida-msft Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!
Hi @Rajesh ,

Firstly, please make sure you have set up the const variable within your .ts file as below:

const DefaultImageFileName: string = "default.png";

Note: Please type 'default.png' rather than 'img/default.png'

Within your Manifest.xml file, declare your image resource as below:

<resources> <code path="index.ts" order="1" /> <css path="css/TS_ImageUploadControl.css" order="1" /> <img path="img/default.png" /> <resx path="strings/TSImageUploadControl.1033.resx" version="1.0.0" /> </resources>

Please make sure the img folder is located at same Directory level as your Manifest.xml file. Please update the modules installed in your project using npm command:

npm update

then re-build your project

npm run build

then check if the issue is fixed.

If the issue still exists, please consider submit an assisted support ticket through the following link:
https://powerapps.microsoft.com/en-us/support/pro

Regards,

Was this reply helpful? Yes No
Rajesh 104 on at

Like (0)

Report
Copy link

Link copied!

Hi @v-xida-msft

I've mentioned that I've downloaded the code from github and deployed as per instructions which means all that you mentioned are already in place. I've also mentioned where the error is being thrown. I wish you download the code from github and try to reproduce the issue before suggesting anything.

Was this reply helpful? Yes No
Diana Birkelbach 3,072 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!

Hi @Rajesh ,

Are you running the project locally (in the Debug Harness), or have you uploaded the component to your D365 Organization?
I just want to check this, since the "getResource" doesn't work in the local harness.

Kind regards,
Diana

Was this reply helpful? Yes No
v-xida-msft Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!
Hi @Rajesh ,

The User @AndrewLyMVP has faced similar issue with you, please check the following thread for more details:

https://powerusers.microsoft.com/t5/Power-Apps-Pro-Dev-ISV/Is-there-an-example-of-using-Image-Resources-within-PCF-control/td-p/342152

Are your running/debugging your project in test harness? PowerApps Staff has given the conclusion:

1. Direct references to the web resources should not be made via PCF as it breaks the dependencies. 2. You can use getResrouce as pointed above to use the PCF image resources in the product, 3. This is not yet supported in the test harness and is tracked via internal bug 1680472

Currently, the context.resources.getResource function is not supported in test harness, please publish your PCF project, import the corresponding solution into your CDS Environment, then test it in a Model-Driven app, check if the issue is fixed.

Regards,

Was this reply helpful? Yes No
Rajesh 104 on at

Like (0)

Report
Copy link

Link copied!

Thanks @DianaBirkelbach @v-xida-msft

I'v deployed the PCF control into CDS and using the control inside a canvas app and I get the same error. Is the issue because I'm using the control inside a canvas app not a model driven app?

Was this reply helpful? Yes No
v-xida-msft Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!

Hi @Rajesh ,

Yeah, you are right. Currently, the context.resources.getResource function is only available for Model-Driven app, which could not work inside a canvas app.

Please check the following article for more details:

https://docs.microsoft.com/en-us/powerapps/developer/component-framework/reference/resources/getresource

Regards,

Was this reply helpful? Yes No
Rajesh 104 on at

Like (0)

Report
Copy link

Link copied!

@v-xida-msft I'm not sure how far the documentation is correct and updated. It also says getString is available only for model driven apps but works fine inside canvas app. There are many more such references in documentation. I wish a proper resolution was found for this issue

Was this reply helpful? Yes No
v-xida-msft Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!

Hi @Rajesh ,

Actually, the official document mentioned about the PowerApps Component Framework resource is not updated in real time along with the features released within the PowerApps Component Framework.

If you would like to get further help in this issue, please consider submit an assisted support ticket through the following link

https://powerapps.microsoft.com/en-us/support/pro

Regards,

Was this reply helpful? Yes No