System Requirement:
This documentation is for windows system. I am using windows 10
Steps:
Installation and visualization in Kibana:
Please refer :
https://praveendavidmathew.medium.com/visualization-using-kibana-and-elastic-search-d04b388a3032
Pre-requisite:
- we can delete the previous index by doing a DELETE request to http://localhost:9200/testresults
Now lets come to Protractor:
So from the previous article , you understand how to send data and visualize it in Elastic search
We have observed that we are just sending json data using rest API and then visualizing it in Kibana by setting x and y axis with the fields we are interested in.
so to visualize the protractor result we just have to send the result to ELastic search , this can be done using jasmine customreporter listeners .
in the protractor config file add : (do npm install axios)
onPrepare: async function() {
jasmine.getEnv().addReporter({
//adding results to an array for each spec
specDone: function(result) {
console.info(JSON.stringify(result, null, 2))
array.push(result)
},
//iterating through each result and sending it to elastic search
jasmineDone: function() {
date = new Date(Date.now())
var axios = require('axios');
array.forEach((result) => {
result.date = date
var data = JSON.stringify(result);
var config = {
method: 'post',
url: 'http://localhost:9200/testresults/protractorresults',
headers: {
'Authorization': 'Basic dGVzdDp0ZXN0MTIz',
'cache-control': 'no-cache',
'APIC-Cookie': 'apicCookie',
'Postman-Token': 'ae18aba5-b962-44d4-9a1e-5684f43318d3',
'Content-Type': 'application/json'
},
data: data
};
axios(config)
.then(function(response) {
console.log(JSON.stringify(response.data));
})
.catch(function(error) {
console.log(error);
});
})
}
})
}
This will send the results to elastic search after the test is done .
Visualized result:
- Goto stack management>kibana>index pattern and create new index testresults
- Click next and add date as time field
- Create new dashboard with horizontal axis as ‘date’ , vertical has ‘keyword.status’ , and breakdown by ‘keyword.status’. Set color code as status.
we have visualized keyword.status in y axis and date field in x axis
Learn with praveen 