Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
cancel
Showing results for 
Search instead for 
Did you mean: 
michal_keidar
Active Contributor

Introduction


Ah… Automated testing… What a bless!
Remember when we had to manually test the application we developed?
And with every single change we did, we had to execute them again to make sure nothing got broken?
Soon enough we had a “testing day”, which turned into a “testing week” before each release, which turned into a time-consuming nightmare.

Well, you are in luck, those days are over 🙂
Nowadays we have automated tests that are executed with a click of a button (and with a proper CI/CD solution, automatically on every “push” to Git).
They also run on different browsers and on different release versions, so we no longer need to test every possibility manually!

You would have thought everyone was doing automated testing these days, right?
Unfortunately, we discovered that it’s still considered too much time-consuming and therefore costly and that is why a lot of Fiori apps are still being tested manually.

I decided to write this blog to explain why automated testing for your SAP Fiori app is so important, so you could use it to convince your customer it’s worth investing time in!
I will also showcase what are the tools provided by SAPUI5 and SAP Web IDE in this area that can significantly help you.

Why automated testing?



  1. Quality.
    Bugs will always find a way into your application. However, with good automated tests, they should be found prior to the release.
    Even your best QA engineer can’t test every single possible combination of steps, with every configuration, in a reasonable amount of time, with no mistakes along the way.
    Yet, an automated test can run on various configurations in parallel, for as many times as needed, compare the results to the expected behavior, and report the results.
    This means an automated test covers more code and more flows, without mistakes. It finds more bugs and by doing so, increases the quality of your app!

  2. Time and money.
    Every time the source-code changes, tests should be executed.
    Doing this manually is very time-consuming and costly.
    An automated test, once created, can be repeated over and over with no additional cost, and you know computers are much faster than humans (I’m afraid we already lost this war).
    Any amount of time you save translates directly to cost.

  3. Load testing.
    Even the largest QA department can’t perform a test with thousands of users.
    Automated testing can simulate tens, hundreds or thousands of virtual users interacting with your application.
    This can help build your confidence before your go-live…

  4. Everyone is happy!
    Ok maybe it’s a bit of a stretch but think of the poor person that used to test the same steps over and over again. With automated testing he is free! He can concentrate on creating new automated tests, or on complex features or other challenging tasks, which improve his skills and confidence.


Continuous Integration/Delivery


Having automated tests is the basis for a useful and productive CI/CD process.

With automated tests as part of your CI/CD pipeline, you can move from a state where you are too afraid to do any change in your application and therefore change it rarely and cautiously, to a state where you make changes frequently, safely and quickly, because your tests increase your confidence.

Also, we see that automated testing is highly integrated into existing enterprise-grade CI/CD toolsets.

For more information, check this white paper about Automated Testing: The Glue that Holds DevOps Together.

 

How to get started


Let’s say you’re ready to let go of your manual testing and join the beautiful world of automation. How should you start?

The first step is to become familiar with the basics of JavaScript unit testing with QUnit, which is a powerful and easy-to-use JavaScript unit-testing framework.
Then, you should become familiar with One Page Acceptance (OPA), which is an API for SAPUI5 controls, helpful for testing user interactions, integration with SAPUI5, navigation, and data-binding.

Lucky for you, SAPUI5 created an excellent tutorial that demonstrates how to write tests using QUnit, OPA, and the mock server. Additionally, you will learn about testing strategies, Test Driven Development (TDD), and much more. Highly recommended!

 

SAP Web IDE


Developers can use one of the provided templates in SAP Web IDE as a starting point for their app.

Not many developers are aware that the SAP Fiori templates already contain a vast number of automated tests, both unit tests with QUnit and integration tests with OPA!

These tests cover much of the existing functionality to make sure it won’t break, and can also be used as a reference for your future tests, since they are written according to SAPUI5’s guidelines and best-practices.


 

You can find all the test information per template in the SAPUI5 documentation:

Worklist Template

Master-Detail Template

In addition to these great templates, SAP Web IDE offers commands to help you quickly create empty QUnit Test, OPA Page, and OPA Journey.





 

And if you're using the SAPUI5 Application template, you can right-click it and choose to create a new Test Structure. This will create a "test" folder with Qunit and OPA resources.



 

So these can also be used to assist with the creation of automated tests!

We know it seems to take a lot of time at first but once you get the hang of it you are going to write tests much faster. Just like coding.

Do you have more ideas for improvements in this area?

Use the power of the community and share your thoughts in the comments section.

 

Happy testing 🙂
13 Comments
former_member201114
Participant
Hi Michal,

 

great blog 🙂 It would be nice to have the qunit and opa tests integrated into
@sap/grunt-sapui5-bestpractice-build

Right now this grunt task only provide "clean", "lint" and "build" functionality and to run the tests there is no official way or tutorial how to achieve this. I know there is the openui5-sample-app repository, but it is using a self written grunt task to integrate everything.

 

Have a nice day ✌
JeremyCoppey
Explorer
0 Kudos
Hi Michal,

Thank you for this blog.

I have a question, do you run your test on data retrieved from a backend or do you advise to use a mockserver for the Integration testing?

Thanks

Jérémy

 
michal_keidar
Active Contributor
0 Kudos
Hi Jeremy,

That is your choice.

Running your tests against live data has its disadvantages as it makes your test dependent on your system, which means that if your service is down or acting up for any reason, your test will fail, even though the functionality is working.

Also, testing against live data will probably impact the performance of the test and will make it run for longer time, which is also not recommended.

I recommend to use mock data.

Regards,
Michal.
carsten_buechert
Contributor
0 Kudos
Hi Michal, thanks for your blog entry! Like Nils I'm interested in automated testing integrated in the best grunt build of WebIDE. Do you know of any provided solution or hint?
michal_keidar
Active Contributor

Hi,

This is still a work in progress. We have a new module that supports the execution of unit and integration tests via Grunt task “@sap/grunt-sapui5-bestpractice-test”.

The following is copied from its README.md file:

1. The following command will add the grunt-sapui5-bestpractice-test to your package.json:

    npm install –save-dev @sap/grunt-sapui5-bestpractice-test


2. Add the following script to your package.json to enable running the unit and integration tests via npm:

“scripts”: {
“test”: “grunt unit_and_integration_tests”
    }


3. Add the following to your Gruntfile.js file:

    grunt.loadNpmTasks(“@sap/grunt-sapui5-bestpractice-test”);

grunt.registerTask(“unit_and_integration_tests”,
      [
“test”
      ]
);

grunt.config.merge({
coverage_threshold: {
statements: 0,
branches: 100,
functions: 0,
lines: 0
}
});

 

4. Run the following command to run the unit and integration tests:

    npm test

 

You can add this task together with the "clean", "lint" etc. but currently in SAP Web IDE this doesn't work (known bug that we're working on).

Regards,
Michal.

former_member201114
Participant
0 Kudos
Thanks for that information. Unfortunately this is not working on local environment due to missing npm packages.

 

Will this @sap/grunt-sapui5-bestpractice-test grunt task be officially released in the near future? So that we can get more detail informations on how to structure tests (folder structure), which additional grunt packages are needed and so on.

 

Anyway very good direction to get the full development cycle supported by official SAP UI5 grunt tasks 🙂 ?
0 Kudos
Hi Nils,

 

Please try:

  1. Delete the package-lock.json file

  2. verify that you .npmrc file contains only the following:
    @sap:registry=https://npm.sap.com/

  3. In your package.json, Change you devDependencies to

    "devDependencies": {
    "@sap/grunt-sapui5-bestpractice-build": "1.3.58",
    "@sap/grunt-sapui5-bestpractice-test": "0.0.1"
    },

  4. npm install


Thanks,
Lior
mmcisme1
Active Contributor
0 Kudos
Very nice.   I know my friend bfeeb8ed7fa64a7d95efc21f74a8c135  will love this.  It is a continuation of ABAP unit tests into our new environment.  OK new environment for me.

If anyone else like me is struggling on what to use for Fiori development - this is different than a programming language.  SAP Web IDE seems the way to go.  Along with some cool tools - like this one.

I always love step by step how to do things!

Michelle
WRoeckelein
Active Participant
0 Kudos
Hi michal.keidar ,

thanks for the info to this module. I noticed that the version is now 1.0.0. Should this work in the WebIDE now? I currently get
ERROR [phantomjs.launcher]: /tmp/webide.y0H.build/proj/node_modules/phantomjs-prebuilt/lib/phantom/bin/phantomjs: error while loading shared libraries: libfontconfig.so.1: cannot open shared object file: No such file or directory

Regards,

Wolfgang
yuval_morad
Employee
Employee
Hi

We plan to move to chrome headless in the next month and hope it will solve the issues
Hi michal.keidar,

are there any news on that matter?  Your comment is the only reference I could find about automated testing with grunt.

Best regards

Lucas
WRoeckelein
Active Participant
Hi yuval.morad ,

any update here? Is there a documentation of the @sap/grunt-sapui5-bestpractice-test including prerequisites somewhere available?

 

Regards,

Wolfgang
0 Kudos
hi ,
I am unable to run qunit via grunt inspite of having all the necessary node modules.

Gruntfile :

module.exports = function (grunt) {
'use strict';
grunt.initConfig({
qunit: {
all: ['/webapp/test/unit/unitTests.qunit.html']
}
});
grunt.loadNpmTasks('grunt-contrib-qunit');
grunt.registerTask('default', ['qunit']);
};

Command : grunt qunit
Results :

D:\QUnit\SAPUI5-master\SAPUI5-master>grunt
Running "qunit:all" (qunit) task
>> 0 tests completed with 0 failed, 0 skipped, and 0 todo.
>> 0 assertions (in 0ms), passed: 0, failed: 0

I have two test cases and it runs over SAP WEB IDE but not here.

Please help.