Failed to execute ‘json’ on ‘Response’: body stream is locked


I am following this article and get the following error in the console.log

Uncaught (in promise) TypeError: Failed to execute 'json' on 'Response': body stream is locked     at e.json (sp-pages-assembly_en-us_5d8862cf2c0cc1538b9ce027f59ea4e9.js:1133) 

The code from the article is as below

 **this.context.aadHttpClientFactory       .getClient('https://tenant.onmicrosoft.com/6b347c27-f360-47ac-b4d4-af78d0da4223')       .then((client: AadHttpClient): void => {         client           .get('https://myfunction.azurewebsites.net/api/CurrentUser', AadHttpClient.configurations.v1)           .then((response: HttpClientResponse): Promise<JSON> => {             return response.json();           })           .then((responseJSON: JSON): void => {             //Display the JSON in a table             var claimsTable = this.domElement.getElementsByClassName("azFuncClaimsTable")[0];             for (var key in responseJSON) {               var trElement = document.createElement("tr");               trElement.innerHTML = `<td class="$  {styles.azFuncCell}">$  {key}</td><td class="$  {styles.azFuncCell}">$  {responseJSON[key]}</td>`;               claimsTable.appendChild(trElement);             }           });** 

In the second .then chain the JSON object is undefined and also the response.json() is empty.

Is there something I am missing.