Group Rendering of JavaScript Link Using SharePoint

Scenario
 
When rendering a grouping in a view with JSLink, we normally experience an issue that the item's rendering handler "overrideCtx.Templates.Item" is not being called. Group rendering was working fine in my case but not item-level rendering.
 
Solution
 
Initially I thought something was wrong with the JSLink file but after analyzing and debugging I discovered that the problem was with the grouping configured in the data view. To fix this issue, edit your data view and go to the grouping section of the view. Change "By default, show groupings" setting to "Expanded" and save the view and bingo, it will start working.
 
The following image shows the setting in the data view:
 
 
 
If you are provisioning the data view declaratively then you need to add Collapse=”FALSE” to your <GroupBy node>.
 
 

The possible reason for this problem is, when the group is shown in the collapsed state the item in that group is not loaded initially and once you click to expand the group it will be loaded on demand, hence the item template is not called initially since the items are not loaded.
 
I hope this will help some developers looking for the same kind of answer.
 
Happy coding!