Separator not showing in Adaptive Cards - botframework

Question

I've been trying to get the "separator" property of Adaptive cards to work, but it does not seem to be rendering in the BotFramework Emulator.
Here are images to the Emulator and the Visualizer for the same code: Emulator Visualizer
The code in both places is the same, and is as follows:
{
"contentType": "application/vnd.microsoft.card.adaptive",
"content": {
'$schema': 'http://adaptivecards.io/schemas/adaptive-card.json',
'version': '1.0',
'type': 'AdaptiveCard',
'body': [
{
'type': 'TextBlock',
'text': 'Meeting Title',
'weight': 'bolder'
},
{
'type': 'TextBlock',
'text': 'Location',
'separator': true,
'isSubtle': true,
'size': 'small'
},
{
'type': 'TextBlock',
'text': 'Location',
'spacing': 'none'
},
{
'type': 'TextBlock',
'text': 'Organizer',
'separator': true,
'isSubtle': true,
'size': 'small'
},
{
'type': 'TextBlock',
'text': 'Organizer Name',
'spacing': 'none'
},
{
'type': 'TextBlock',
'text': 'Start Time',
'separator': true,
'isSubtle': true,
'size': 'small'
},
{
'type': 'ColumnSet',
'spacing': 'none',
'columns': [
{
'type': 'Column',
'width': 'auto',
'items': [
{
'type': 'TextBlock',
'text': '05:00 PM',
'isSubtle': false,
'weight': 'bolder'
}
]
},
{
'type': 'Column',
'width': 'auto',
'items': [
{
'type': 'TextBlock',
'text': 'May 21'
}
]
},
{
'type': 'Column',
'width': 'auto',
'items': [
{
'type': 'TextBlock',
'text': '2017',
'isSubtle': true,
'weight': 'bolder'
}
]
}
]
},
{
'type': 'TextBlock',
'text': 'End Time',
'separator': true,
'isSubtle': true,
'size': 'small'
},
{
'type': 'ColumnSet',
'spacing': 'none',
'columns': [
{
'type': 'Column',
'width': 'auto',
'items': [
{
'type': 'TextBlock',
'text': '05:30 PM',
'isSubtle': false,
'weight': 'bolder'
}
]
},
{
'type': 'Column',
'width': 'auto',
'items': [
{
'type': 'TextBlock',
'text': 'May 21'
}
]
},
{
'type': 'Column',
'width': 'auto',
'items': [
{
'type': 'TextBlock',
'text': '2017',
'isSubtle': true,
'weight': 'bolder'
}
]
}
]
}
],
'actions': [
{
'type': 'Action.Submit',
'title': 'Accept',
'data':{
'accept': true
}
},
{
'type': 'Action.Submit',
'title': 'Decline',
'data':{
'accept': false
}
}
]
}
}
As seen, The separators appear only in the visualizer, for the same code. Am I missing something?

Answer 1

Instead of separator you can use
Separation = SeparationStyle.Strong
this is working for me

Answer 2

it might be a little bit tricky because the separator documentation is a little bit vague (at least for me).
Take a look here - the syntax purposed to separator doesn't seem to work anywhere.
What I did find:
The spacing property works just fine (at least with these values "none" | "small" | "default" | "medium" | "large" | "extraLarge" | "padding")
It will only works when using in containers (Container, ColumnSet, Column, etc.)
It is also apply (as the name implies) on the outer area of the container (similar to CSS margin property)
Will not work for the first container
You may go to the adaptive cards classic editor and put spacing (let's say "spacing": "large") on the second Container section (there are only 2 of them) and observe the spacing impact by yourself