Monday, 02 December 2019 05:49

Server side code coverage for SAPUI5

Written by https://blogs.sap.com/2019/12/03/server-side-code-coverage-for-sapui5/
Rate this item
(0 votes)

As part of my blogseries of end to end development environment of UI5-Tooling I got a to add a bit more to a few NPM package. I also ended up creating

my own for code coverage.

Now I thought that’s really cool from a local development point of view. But the setup at my client is that we have Functional consultants doing unit testing of the code as well. Obviously this isn’t covered as part of the code coverage then and also asking them to setup the local tooling could be a bit steep.

So i’ve created yet another package for server side code coverage, that acts as a middleware between an SAP system and the client. This way it will instrument all the javascript files coming from the server for the code coverage.

Let’s try it out.

You need a new app that really just acts as a dummy app for your server.

To get an easy start you can clone my GITHUB repository.

Now open the ui5.yaml file and replace the following:

  • hostname
  • client
  • username
  • password.
  • regular expression

The regular expression searches on agilux to be part of the name and that it ends on .js.

Now run

npm install

And start your server with

npm run serve

When you open up your launchpad via localhost

http://localhost:8080/sap/bc/ui5_ui5/ui2/ushell/shells/abap/FioriLaunchpad.html?sap-ui-debug=true

If you have a namespace for your apps, you can reduce load time by adding that instead of true in the sap-ui-debug part. Have a look here if you are confused

Now when you click through your app the code is instrumented and added to the window.__coverage__ object. Once done open the debugger by pressing F12 and execute the following ajax request

$.ajax({ type: "POST", url: 'http://localhost:3000/coverage/client', data: JSON.stringify(window.__coverage__), headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' } });

And you will get something like this:

You can download the report by http://localhost:3000/coverage/download and use it as part of your QA process. You can execute the ajax request as often as you want to collect more coverage.

Read 9 times

Leave a comment

Make sure you enter all the required information, indicated by an asterisk (*). HTML code is not allowed.