Protractor Jasmine Reporter + BDD + Azure DevOps - jasmine

Question

I would like to write Jasmine End 2 End Tests in a BDD style. From what I've learned, this means, I have pretty much 4 areas:
Feature
Scenario
stimulus or event
Outcomes to ensure
From my naive view, I would create a test for the "Individual Details" feature like this:
// Feature
describe('Showing Individual Details', () => {
let individualDetailsPage: IndividualDetailsPage;
beforeEach(() => {
individualDetailsPage = new IndividualDetailsPage();
});
// Scenario - New Individual
describe('Given a new Individual', () => {
beforeEach(async () => {
await individualDetailsPage.navigateToDetails('-1');
});
// Incoming Event
describe('When the Details are loaded', () => {
// Ensure outcome
it('Then all Controls are empty', async () => {
expect(individualDetailsPage.firstNameInput.text).toBe('');
expect(individualDetailsPage.lastNameInput.text).toBe('');
expect(individualDetailsPage.birthdateInput.text).toBe('');
});
// Ensure outcome
it('Then the save button is disabled', () => {
expect(individualDetailsPage.saveButton.isEnabled).toBe(false);
});
});
});
});
Therefore, for the Individual Details feature, if a new Individual is set, then the Controls should be empty and the save button disabled.
Still from a naive view, this seems alright. Also running the tests, I see:
Which seems alright. Now the interesting part: I would like to publish this changes to Azure DevOps, therefore I'm using the following code in the protractor config:
onPrepare() {
require('ts-node').register({
project: require('path').join(__dirname, './tsconfig.e2e.json')
});
var jasmineReporters = require('jasmine-reporters');
var junitReporter = new jasmineReporters.JUnitXmlReporter({
savePath: 'testresults',
filePrefix: 'e2e-tests',
consolidateAll: true
});
jasmine.getEnv().addReporter(junitReporter);
}
Unfortunately, the XML is looking like this:
<testsuite name="Showing Individual Details" timestamp="2019-02-04T18:23:33" hostname="localhost" time="2.035" errors="0" tests="0" skipped="0" disabled="0" failures="0">
</testsuite>
<testsuite name="Showing Individual Details.Given a new Individual" timestamp="2019-02-04T18:23:33" hostname="localhost" time="2.033" errors="0" tests="0" skipped="0" disabled="0" failures="0">
</testsuite>
<testsuite name="Showing Individual Details.Given a new Individual.When the Details are loaded" timestamp="2019-02-04T18:23:33" hostname="localhost" time="2.033" errors="0" tests="2" skipped="0" disabled="0" failures="0">
<testcase classname="Showing Individual Details.Given a new Individual.When the Details are loaded" name="Then all Controls are empty" time="1.106" />
<testcase classname="Showing Individual Details.Given a new Individual.When the Details are loaded" name="Then the save button is disabled" time="0.927" />
</testsuite>
Since Azure DevOps only seems to check for the name, I then see:
My problem: I don't know exactly, where my problem lies. I didn't find any good resources regarding "real" BDD with Jasmine, also it seems like the Jasmine Reporter can't be configured that much: https://github.com/larrymyers/jasmine-reporters
Is therefore my code totally wrong, or is it in fact the reporter? And if this is the case, are there alternatives or would I need to "flatten" the XML somehow?

Answer 1

I agree with the comment above, creating your own reporter sound like the way to go. You can format the contents however you like.
I recently responded to another question regarding Jasmine reporter here. I was reformatting my test results into a JSON object and storing them in amazons dynamoDB after each test completed.
Any more questions let me know.

Answer 2

you can use the useFullTestName property:
jasmine.getEnv().addReporter(new jasmineReporters.JUnitXmlReporter({
consolidateAll: true,
useFullTestName:true,
savePath: 'e2e/output',
filePrefix: 'xmlresults'
}));

Answer 3

I would like to recommend using the Jasmine TRX Reporter instead of the JUnit XML Reporter.
The TRX Reporter also supports adding screenshots to the published test results, which is a big plus in a CI/CD environment.
The screenshot will be available in Azure Devops under the attachments tab of the test case result:
You can add it to your project with:
npm install jasmine-trx-reporter --save-dev
And add it to you protractor config like so:
const TrxReporter = require('jasmine-trx-reporter');
...
onPrepare() {
...
jasmine.getEnv().addReporter(new TrxReporter({
folder: require('path').join(__dirname, './testresults/'),
takeScreenshotsOnlyOnFailures: true
}));
...
And last but not least, change the Publish Test Result step in your Release to use VSTest instead of JUnit and the exported .trx file instead of the .xml file.