I got asked for help with an issue in some QA test the other day, and it struck me as a fun one that others might encounter. A nice little side effect of how literal computers can be...
I was asked to look at a page where a tester had set up some components but only one of them had appeared on the page. I rattled off the usual litany of stuff you have to check when you're debugging missing stuff: publishing, workflow, correct settings etc. But none of those were the problem. Looking at the presentation details, the components appeared to be set up correctly.
As an example (because I can't easily show the original site's issue), here's the presenation details for the default Sitecore page exhibiting the same issue:
And that looks correct. Editing the settings of that root component looks fine too:
But the published web page is definitely not right. With the data above it looks like:
Something is wrong with the root component in the "main" placeholder - and that means it's not rendering that or the child components.
It took me a surprising amount of time to work out what was up. But eventually (after looking for a variety of deployment-related issues because the issue came up not too long after some code was deployed) I looked at the raw XML for the presentation details. In the
Renderings
field, the XML looked like:
<?xml version="1.0" encoding="utf-8"?> <r xmlns:xsd="http://www.w3.org/2001/XMLSchema" > <d id="{FE5D7FDF-89C0-4D99-9AA3-B5FBD009C9F3}" l="{14030E9F-CE92-49C6-AD87-7D49B50E42EA}"> <r ds="" id="{885B8314-7D8C-4CBB-8000-01421EA8F406}" par="" ph="main " uid="{43222D12-08C9-453B-AE96-D406EBB95126}" /> <r ds="" id="{CE4ADCFB-7990-4980-83FB-A00C1E3673DB}" par="" ph="/main/centercolumn" uid="{CF044AD9-0332-407A-ABDE-587214A2C808}" /> <r ds="" id="{493B3A83-0FA7-4484-8FC9-4680991CF743}" par="" ph="/main/centercolumn/content" uid="{B343725A-3A93-446E-A9C8-3A2CBD3DB489}" /> </d> </r>
Can you see the issue now? No? Well it is subtle...
The issue is here, in this
<r/>
element from above:
<r ds="" id="{885B8314-7D8C-4CBB-8000-01421EA8F406}" par="" ph="main " uid="{43222D12-08C9-453B-AE96-D406EBB95126}" />
In the binding data for that first control, the "placeholder" field has the name
main
in it - but it's got a trailing space after it too!
And that explains everything.
When you're looking at the control binding properies or device properties dialogs, trailing whitespace isn't obvious. You'd need to explcitly select all the content in the placeholder name texbox to highlight it - so it's not obvious that there is trailing space there if you're just looking at the data. And computers are very literal unless they're told not to be. Hence "main " is not the same as "main" to the layout engine's code. So it won't find the "main " placeholder to put components on the page, causing it to not render the component at all.
So to verify that, selecting and deleting that extra space:
Then publishing the item, leads to a fixed page:
Bingo!
So there you go - watch out for your trailing whitespace.
Why might this be an issue? Well in a scenario where someone is setting up presentation details by copying and pasting stuff from instructions it's not too difficult to suffer from Windows' desire to be "helpful" and automatically select and copy stuff for you - including whitespace you didn't necessarily expect.
And once that extra space is in there, it's not easy to spot...
↑ Back to top