Image with datasource="salesforce" plus ONLY a UI-only model causes error

  • 1
  • Problem
  • Updated 1 year ago
  • Not a Problem
This is a pretty specific, probably rare, situation that I accidentally found while previewing a page early in the process of building it.  The gist is that when a page contains an image and the only model is a ui-only model, the page content will not load.  However, either adding a model with Salesforce as the data source OR removing datasource="salesforce" from the image tag XML fixes it.

Given that this issue is limited to pages using only a UI model, I am guessing it won't come up much, but figured I'd share in case anyone else gets stuck on this.  Or in case there is a need to have a page with an image that only contains UI models.

Some details:
I found this when I started building a page with an image in the header and without any models; checked the preview and it loaded fine.  When I added a UI-only model, the preview page loaded, but did not display any content and there were no error messages in version 9.5.6.

Thinking maybe it was fixed in a later version, I tested this in a sandbox upgraded to version 10.0.5 and it still would not load the content, but in the later version, I got the following error message: "There was a problem rendering a component of type image: Cannot read property 'getImageSource' of undefined."  This occurred when the image source was either a static resource or URL.  When I change the Data Source Type in the page builder from "salesforce" to "Ui-Only" the error message went away, but the image did not show up from a URL.

Found the solution after some testing -- either adding a Salesforce-sourced model or removing datasource="salesforce" from the image tag XML.
Photo of and thorough

and thorough

  • 736 Points 500 badge 2x thumb

Posted 1 year ago

  • 1
Photo of Stephen Sells

Stephen Sells, Official Rep

  • 16,856 Points 10k badge 2x thumb
After building exactly what I interpretted as described: I was able to have this build work in 10.0.5. What am I missing:


<skuidpage unsavedchangeswarning="yes" personalizationmode="server" showsidebar="false" useviewportmeta="true" showheader="false">    <models>        <model id="UIOnly" query="true" createrowifnonefound="true" datasource="Ui-Only" processonclient="true">            <fields/>            <conditions/>            <actions/>        </model>    </models>    <components>        <image source="url" uniqueid="sk-fExCJ-102" datasource="Ui-Only" behavior="none" model="UIOnly" url="http://cdn.earthporm.com/wp-content/uploads/2015/10/XX-Proud-Mommies5__605.jpg">            <styles>                <styleitem type="itemsize"/>                <styleitem type="border"/>            </styles>        </image>    </components>    <resources>        <labels/>        <javascript/>        <css/>    </resources>    <styles>        <styleitem type="background" bgtype="none"/>    </styles></skuidpage>