GetRelatedTasks.js

/*
Author: Kit Menke (@kitmenke)
Description:
   Put the script on the EditForm of a list. When editing an item, the script will query
   the tasks list in the site for any associated Workflow Items.
   
SharePoint functions used:
   JavaScript Client Object Model
   String.format
   byid
   Function.createDelegate
   ExecuteOrDelayUntilScriptLoaded
   SP.Utilities.UrlBuilder
   GoToPage(url, onlyUseExistingSource). 
      Redirect to specified url. onlyUseExistingSource  allows you to specify your own source parameter: 
      If onlyUseExistingSource is false, and the specified url doesn’t contain a source parameter, a source parameter is added pointing to the current page.
*/
function GetRelatedTasks(id) {
   var self = this;
   
   // get current item 
   self.itemId = id;
   self.context = SP.ClientContext.get_current();
   self.taskList = self.context.get_web().get_lists().getByTitle('Tasks');
   var camlQuery = new SP.CamlQuery();
   camlQuery.set_viewXml(
      String.format('<View><Query><Where><Eq><FieldRef Name="WorkflowItemId"/><Value Type="Number">{0}</Value></Eq></Where></Query><RowLimit>10</RowLimit></View>', self.itemId)
   );
   self.taskListItems = self.taskList.getItems(camlQuery);
   self.context.load(self.taskList, "DefaultEditFormUrl");
   self.context.load(self.taskListItems);
      
   self.onQuerySucceeded = function(sender, args) {
      console.log('Request succeeded!', sender, args);
      console.log('task list items', self.taskListItems);
      var elem = byid('ehi-approval-tasks');
      var html = "";
      var listItemEnumerator = self.taskListItems.getEnumerator();
      while (listItemEnumerator.moveNext()) {
         // TODO: add source
         var urlBuilder = new SP.Utilities.UrlBuilder(self.taskList.get_defaultEditFormUrl());
         var taskListItem = listItemEnumerator.get_current();
         urlBuilder.addKeyValueQueryString('ID', taskListItem.get_id().toString());
         html += String.format('<div><a href="#" onclick="GoToPage(\'{0}\', false); return false;">{1}</a></div>', urlBuilder.get_url(), taskListItem.get_item('WorkflowLink').get_description());;
      }
      elem.innerHTML = html;
   };

   self.onQueryFailed = function(sender, args) {
      console.log('Request failed. ', args.get_message(), args.get_stackTrace());
   };
   
   self.load = function() {
      self.context.executeQueryAsync(self.onQuerySucceeded, self.onQueryFailed);
   };
}

SP.SOD.executeFunc('sp.js', 'SP.ClientContext', function() {
   var currentId = GetUrlKeyValue('ID');
   console.log("GetRelatedTasks", currentId);
   var obj = new GetRelatedTasks(currentId);
   obj.load();
});

stuff to put in script editor webpart.html

<h1>Approval Tasks</h1>
<div id="ehi-approval-tasks">
</div>

<script>
/* replace me with the stuff from above */
</script>

Awesome job! Here's a modified CAML query that will only display tasks that are Status = 'Not Started' and AssignedTo = [Me]:

<View><Query><Where><And><Eq><FieldRef Name="WorkflowItemId"/><Value Type="Number">{0}</Value></Eq><And><Eq><FieldRef Name="Status"/><Value Type="Choice">Not Started</Value></Eq><Eq><FieldRef Name="AssignedTo" /><Value Type="Integer"><UserID Type="Integer" /></Value></Eq></And></And></Where></Query><RowLimit>10</RowLimit></View>