Dev Tip: Debug SAP Fiori Client Application in iOS devices

In case you’ve missed our dev tips in past weeks, we will be posting them in the blog moving forward. To sign up and get your dev tips delivered to your inbox each week, click here!

Tip of the Week: Debug SAP Fiori Client Application in iOS devices

Debug SAP Fiori Client Application in iOS devices.

It is not uncommon that Organizations first start with Fiori Web-Apps and then move to Fiori Mobile Apps as a part of their Fiori journey. The most common practice to embark this journey is using a custom Fiori Client.

For starters, Fiori Client is a Cordova based Hybrid app which renders Fiori Launchpad and the Tiles associated with the Launchpad.

Let’s familiarize ourselves with the lingo:

  • Cordova Hybrid App – An Apache open source software which enables generation of code for multiple target platforms.
  • .IPA files – An iOS Application archive file which must be installed on a device for the App to be working
  • .apk – Equivalent of .IPA files in android work, which install the app on a device

SAP Fiori Developers often use browser based testing to debug their Fiori Applications. At times, they must debug an app running on a physical device.

Here’s the trick…! 

1. Launch the App on your device and login to the Application
2. Connect the iPhone / iPad to a Mac and open a Safari browser. One can see the device (in my case it is Lapi’s iPhone) in the develop menu.
If the device is not appearing, activate developer mode on the iPhone
Activate `Develop` menu in the Safari browser
3. Web Inspector Tools will populate after clicking on the device name in the ‘Develop’ menu
Check the header of the Web Inspector, it should reflect the device name, app name and the URL which is being inspected.4. Now refresh the app or scroll down the page on your device. One can view the calls being made by the app in the network
5. Click on a tile and load the app
6. You can observe your custom JavaScript script files in the resources section. In this example I have filtered for Controller.js files
7. Feel free to place a break-point and reload your app using the ‘Reload’ button on top
Now you have the ability to debug and analyze the JavaScript files which cause the application to work in Cordova Apps.

Watch out next week for Debugging Cordova Apps on Android Devices!
If you have an interest in viewing similar content, visit our blog, here. 

View our LinkedIn, here. 

Naveen R., Principal Architect.
For more information on Celonis at Mindset, please reach out to info@Mindsetconsulting.com

Back To Top