VueJs/Axios - Download pdf file in browser from API call - vue.js

Question

I am trying to download an pdf file using VueJs/Axios, but I get an empty file. The stream is 111 kb when created in C# but only 300 bytes when returned to Vue.js.
C#
HttpResponseMessage httpResponse = new HttpResponseMessage(System.Net.HttpStatusCode.OK);
httpResponse.Content = new StreamContent(ms);
httpResponse.Content.Headers.ContentDisposition = new
System.Net.Http.Headers.ContentDispositionHeaderValue("attachment");
httpResponse.Content.Headers.ContentDisposition.FileName = "test";
httpResponse.Content.Headers.ContentType = new
System.Net.Http.Headers.MediaTypeHeaderValue("application/octet-stream");
return httpResponse;
Vue.js
createPdf: function () {
var self = this;
self.ShowSpinner = true;
axios({
method: 'post',
url: self.baseUrl + '/api/ChangeRequestReport/CreatePdf',
responseType: 'blob',
data: {
model: self.ChangeRequestReportModel
}
})
.then(function (response) {
console.log(response);
//self.ChangeRequestReportModel = response.data;
const url = window.URL.createObjectURL(new Blob([response.data], { type: "application/pdf" }));
const link = document.createElement('a');
link.href = url;
link.setAttribute('download', 'test.pdf'); //or any other extension
document.body.appendChild(link);
link.click();
self.ShowSpinner = false;
})
.catch(error => {
console.log(error);
this.error = true;
alert("error");
});