cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Rajesh
Advocate II
Advocate II

Issue with PCF TSImageUploadControl - Default image not found error

Hi

 

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

 

 

10 REPLIES 10
DianaBirkelbach
Super User
Super User

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

 

Kind regards,
Diana
----------
Please click "Accept as Solution" if my post answered your question so that others may find it more quickly. If you found this post helpful consider giving it a "Thumbs Up."

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?

v-xida-msft
Community Support
Community Support

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,

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

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.

 

 

 

DianaBirkelbach
Super User
Super User

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

Kind regards,
Diana
----------
Please click "Accept as Solution" if my post answered your question so that others may find it more quickly. If you found this post helpful consider giving it a "Thumbs Up."

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-Resour...

 

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,

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

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? 

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/getreso...

 

Regards,

Community Support Team _ Kris Dai
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.

@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

Helpful resources

Announcements
UG GA Amplification 768x460.png

Launching new user group features

Learn how to create your own user groups today!

Community Connections 768x460.jpg

Community & How To Videos

Check out the new Power Platform Community Connections gallery!

M365 768x460.jpg

Microsoft 365 Collaboration Conference | December 7–9, 2021

Join us, in-person, December 7–9 in Las Vegas, for the largest gathering of the Microsoft community in the world.

Users online (2,030)