Since SharePoint Client Web Parts are simply iFrames, resizing them from within your App logic (i.e. App.js) can be a little challenging. Fortunately Microsoft provides a way to do this dynamically using postmessages. More info on this can be found on MSDN.
Basically, how this works is, you send a special ‘resize’ message to your iFrames parent (the SharePoint Web containing the App Part). Based on this message, the iFrame is resized according to the supplied dimensions:
window.parent.postMessage(“<message senderId={your ID}>resize(120, 300)</message>”, this.location.hostname);
This only works if your Client Web Parts have the Web Part Title enabled (via the Client Web Part Chrome settings). If you don’t, the resizing function breaks, because it cannot find the Web Parts title DIV:
SCRIPT5007: Unable to get property ‘style’ of undefined or null reference
The code throwing the error:
if (resizeWidth)
{
document.getElementById(webPartDivId + '_ChromeTitle').style.cssText = widthCssText;
cssText = 'width:100% !important;'
}
Unfortunately, there is not much we can do about this. If you really need the App Part title gone and keep the dynamic resizing my choice would be to hide it using CSS. Meanwhile we wait for the fix.
