Search code examples
azuretemplatesazure-devopsrelease-notes

Is there any way to order/group work item type in Azure DevOps release notes

I'm setting up a release notes step in my build pipeline, and I want to group/order work items by type.

In build task for generating release notes step, I add task "Generate Release Notes for Pipeline Builds or Releases" from the market place The task is successfully configured by instruction that is given in https://marketplace.visualstudio.com/items?itemName=richardfennellBM.BM-VSTS-GenerateReleaseNotes-Task. With the current template, I am able to create a release note in the .htm file. Also, I can create a .md file if I use markdown template.

In the current template try to add javascript function for ordering types, but when release note is generated, it just prints javascript function body, and not result.

Currrent template:

<h1>Release notes for build $defname</h1>  
@@BUILDLOOP@@
<h3>$($build.definition.name) </h3>  
<b>Build number</b>  : $($build.buildnumber)     <br />
<b>Build started</b> : $("{0:dd/MM/yy HH:mm:ss}" -f [datetime]$build.startTime)     <br /> 
<b>Source branch</b> $($build.sourceBranch)  

<h3>Associated work items  </h3>

@@WILOOP@@
<li> <b>$($widetail.fields.'System.WorkItemType') $($widetail.id)</b> [Assigned by: $($widetail.fields.'System.AssignedTo'.'displayName')] $($widetail.fields.'System.Title')  <br />
$($widetail.fields.'System.Description') </li>
@@WILOOP@@

@@BUILDLOOP@@

I want to order/group work items by type (like features, product backlog items, tasks, bugs), but the actual output is ordering by work item id.

Solution

  • I've managed to resolve the problem. The javascript function is added in template, but not for creating DOM elements, as I initially start, but as a reorder list item elements.

    Below is a template that works for me:

    <!DOCTYPE html>
<html>
<head>
<script type="text/javascript">

function sortByWorkItemType(arr, isReverse = false) {
 var worItemType = ["epi", "fea","pro", "tas", "bug"];

 const directionFactor = isReverse ? -1 : 1;
  const comparator = (a, b) => {
    if (!a && !b) return 0;
    if (!a && b) return -1 * directionFactor;
    if (a && !b) return 1 * directionFactor;

    const comparableA = a.innerText.toLowerCase().substring(0, 3);
    const comparableB = b.innerText.toLowerCase().substring(0, 3);
    const comparisonResult = worItemType.indexOf(comparableA) - worItemType.indexOf(comparableB);
    return comparisonResult * directionFactor;
  };
  const safeCopyMonthNames = [...arr.children];
  safeCopyMonthNames.sort(comparator);
  return safeCopyMonthNames;
 }


function sortList() {
  var list, i, switching, b, shouldSwitch;
  list = document.getElementById("workItemList");

   switching = true; 

  while (switching) { 

    switching = false; 
     b = list.getElementsByTagName("LI"); 

     for (i = 0; i < (b.length - 1); i++) { 

      shouldSwitch = false; 

      if (b[i].innerHTML.toLowerCase() > b[i + 1].innerHTML.toLowerCase()) { 

        shouldSwitch = true; 
         break; 
       } 
     } 
    if (shouldSwitch) { 
      b[i].parentNode.insertBefore(b[i + 1], b[i]); 
      switching = true;
   } 
 }
var result = sortByWorkItemType(list);
document.getElementById("workItemList").innerHTML = "";
for(i = 0; i <  result.length;  i++) {
document.getElementById("workItemList").insertAdjacentHTML("beforeend", result[i].outerHTML.valueOf());
}

}
</script>
</head>

<body onload="sortList()">
<h1>Release notes for build $defname</h1>  
@@BUILDLOOP@@
<h3>$($build.definition.name) </h3>  
<b>Build number</b>  : $($build.buildnumber)     <br />
<b>Build started</b> : $("{0:dd/MM/yy HH:mm:ss}" -f [datetime]$build.startTime)     <br /> 
<b>Source branch</b> $($build.sourceBranch)  

<h3>Associated work items  </h3>


<ul id="workItemList">
@@WILOOP@@

<li> <b>$($widetail.fields.'System.WorkItemType') $($widetail.id)</b> [Assigned by: $($widetail.fields.'System.AssignedTo'.'displayName')] $($widetail.fields.'System.Title')  <br /> $($widetail.fields.'System.Description') </li>

@@WILOOP@@
</ul>

@@BUILDLOOP@@


</body>
</html>