[ TOP & MOST ASKED ] SAP UI5 Interview Questions and Answers

Last updated on 10th Nov 2021, Blog, Interview Questions

If you’re looking for SAP UI5 Interview Questions and Answers for Experienced & Freshers, you are at right place. There are lot of opportunities from many reputed companies in the world. According to research SAP UI5 has a market share of about 45.8%. So, You still have opportunity to move ahead in your career in SAP UI5. ACTE offers advanced SAP UI5 Interview Questions 2021 that helps you in cracking your interview & acquire dream career as SAP UI5 Developer.

1. What is SAPUI5?

Ans:

Just like any other HTML5 client-side rendering library SAPUI5 is also one. SAPUI5 strictly follows RIA (Rich Internet Application) standards. It is based on JavaScript which provides a lightweight programming model for desktop as well as mobile applications.

2.Why we use SAPUI5?

Ans:

As HTML5 world is the new age front technology across all aspect of internet applications SAP was kind of trailing in this age because SAP was using age old WebDynpro for building SAP Web Applications which lacks in rich and user friendly UI. SAP identified this and came up with its own custom HTML5 library i.e. SAPUI5.

3. When and How to use formatter in SAPUI5?

Ans:

We need to use formatter when we need to perform some changes on the back end property data on the front end.

we can use formatter while data binding to a property like as follows:

• oControl = new sap.ui.commons.TextField({
• value : {path : “/path”, formatter : function(oEvent){
• return “Value:”+oEvent;
• }}});

4. What all design patterns are recommended/available in SAPUI5?

Ans:

SAP recommends following application design patterns keeping in mind design consistency of the applications:

• Master – Detail
• Master-Master-Detail
• Full Screen
• Full Screen-Full Screen-MasterDetail (Multi Flow)

5. What all types of views are available in SAPUI5?

Ans:

There are following predefined three types of view available in SAPUI5:

• JSON view
• JavaScript View(JS View)
• HTML View

6. How Navigation Works In Sapui5?

Ans:

TypeScript has the following disadvantages:

7.What All Events/life Cycle Are Available In Sapui5’s Views Controller?

Ans:

There are 4 lifecycle available in SAPUI5’s views controller, they are:

• onInit() – it is called when a view is instantiated and its controls have already been created.
• onExit() – it is called when the view is destroyed, used to free resources and finalize activities.
• onAfterRendering() – when the view has been rendered and, therefore, its HTML is part of the document.
• onBeforeRendering() -It is called before the controller view is re-rendered and not before the first rendering.

8. What Is The Benefit Of Data Binding Within Sapui5?

Ans:

SAPUI5 uses data binding to bind two data sources or information sources together to keep them in sync. This means: All changes in one source are also reflected in the other one.

9. Name Some Types In Sapui5?

Ans:

• sap.ui.model.type.Float
• sap.ui.model.type.DateTime?
• sap.ui.model.type.Currency

10. What Is Mvc?

Ans:

As HTML5 world is the new age front technology across all aspect of internet applications SAP was kind of trailing in this age because SAP was using age old WebDynpro for building SAP Web Applications which lacks in rich and user-friendly UI. SAP identified this and came up with its own custom HTML5 library i.e. SAPUI5.

11. What Are Dialogs In Sapui5?

Ans:

• They are rendered into a specific area (the static area) in the DOM.
• They needo be added to the “dependent” aggregation of the view to get access to the models.

12. What is the syntax to define a control in UI5?

Ans:

13. What is the difference between HTML5 and SAPUI5?

Ans:

HTML5	SAPUI5
HTML5 is a markup language, It doesn’t have programming capabilities.	SAPUI5 is a framework that is based on the MVC approach to building web applications.
HTML5 is mainly for the purpose of creating a simple webpage without formatting and logic	SAPUI5 provides standard style and components to build rich UIs.

14. What are the Metadata Annotations?

Ans:

The service metadata document describes the structure of all resources in the service. This structural metadata makes it easy to understand a service. We can explore service metadata at the address “$metadata” relative to the service root.

15. What are common Metadata Annotations?

Ans:

Following are some of the service metadata annotations which are common and a front end developer must know these in order to understand the service and integrate it: -EDM: EntityContainer -EDM: EntitySet -EDM: EntityType -EDM: Property -EDM: Nav Navigation Property -EDM: AssociationSet

16. How many types of Fiori applications are there?

Ans:

There are 3 types of Fiori applications:

• Transactional
• Analytical
• Fact Sheets

17. Is Native Javascript supports modules?

Ans:

It is a home page for all the FIORI applications provided. There is more than five hundred custom app provided by SAP. This shows tile-based UI where every UI redirects to assigned FIORI application. This Launchpad is fully customizable according to your needs like theming and all.

18. How can you get the web browser of the client on which the SAP Fiori application is running?

Ans:

SAPUI5 library provides a special API “sap.ui.Device“which can be used for device and its feature detection. This API provides flags like “chrome”, “firefox”, “Mozilla”, “edge” etc. in “sap.ui.Device.browser” API which returns boolean values.

19. What are Fiori Design Principles?

Ans:

There are 5 design principles we need to keep in mind while designing SAP Fiori applications.

• Role-Based
• Delightful
• Simple
• Responsive
• Coherent

20. Mention the major difference between Json model and ODATA?

Ans:

JSON	ODATA
These models are client-side models	These models are server-based
Communication with the services in this model is complex	This model is easy to use to communicate with ODATA services.
It can manage small data sets available on the client-side.	Here the datasets are available on the server-side
It supports two-way binding	It supports one-way binding
Its syntax is sap.ui.model.json.JSONModel. () ;	Its syntax is Sap.ui.model.odata. ODataModel () ;

21. What is SAP Fiori?

Ans:

SAPUI5 is a client-side HTML5 rendering framework or library and SAP FIORI is collection of and released as waves of applications that are completely based on SAPUI5 framework. It means we can create applications using the SAPUI5 framework and SAP FIORI is the final product i.e. application. In SAPUI5 we have to code from scratch, but in Fiori Application the custom application is already built and enhancements can be done on those custom apps.

22. Which Open Standards And Tools Are The Foundation Of Sapui5 Technology?

Ans:

• D3.js for visualization
• ARIA for accessibility standards and keyboard handling
• jQuery for managing DOM elements and abstracting browser difference

23. What is the syntax to define a control in UI5?

Ans:

24. What are the types of Components?

Ans:

There are two types of components:

• Faceless components: Mainly without UIs, Used for business logic and helper methods e.g. Formatters.
• UI Component: typically component.js file which is made by extending sap.ui.core.UIComponent class.

25. When and How to use formatter in SAPUI5?

Ans:

We need to use formatter when we need to perform some changes on the back end property data on the front end.

26. Can we add our own controls to UI5?

Ans:

Yes, we can add custom controls by creating definition of it from scratch. To define a custom control we use sap.ui.control.extend and to enhance a standard SAP UI5 control we use sap.ui.commons.controlname.extend.

27. What are SAPUI5 Fragments?

Ans:

Fragments are very light weight UI controls and part of another UI. Fragments are not completely like views but they act like a view. Fragments are defined similar like views and are names like “myFragment.fragment.xml“.

28. What is Metadata Annotations?

Ans:

The service metadata document explains the structure of all resources in the service. This structural metadata makes it easy to understand a service. We can explore service metadata at the address “$metadata” relative to the service root.

29. What are the common Metadata Annotations?

Ans:

Following are some of the service metadata annotations which are common and a front end developer must know these in order to understand the service and integrate it:

• edm:EntityContainer
• edm:EntitySet
• edm:EntityType
• edm:Property
• edm:NavigationProperty
• edm:AssociationSet

30. What is the difference between SAP Fiori and SAPUI5?

Ans:

SAP Fiori	SAP UI5
SAP Fiori is a set of design guidelines that determine how a user interface is supposed to look and feel.It is a collection of rules that decide on the user experience (UX) of a SAP application.	SAP UI5 is the technology to build responsive web apps. In other words, SAP UI5 is the coding language for SAP Fiori.
the aim of SAP Fiori is an user interface that is consistent, simple, intuitive and responsive for all SAP applications.	Therefore, we cannot build a SAP Fiori application without the underlying SAP UI5 framework.

31. What are all the types of Fiori Apps?

Ans:

There are 3 types of apps:

• Transactional.
• Analytical.
• Fact Sheets.

32. How to know that device is Touch Screen or not?

Ans:

SAPUI5 library provides a special API “sap.ui.Device“ which can be used to for device and its feature detection. This API has a flag “sap.ui.Device.touch” which returns true if device is a touch screen otherwise false.

33. How to know the web browser of the client on which SAP Fiori application is running using SAP UI5?

Ans:

SAP UI5 library provides a special API “sap.ui.Device“ which can be used to for device and its feature detection. This API provides flags like “chrome”, “firefox”, “mozilla”, “edge” etc. in “sap.ui.Device.browser” API which returns boolean values.

34. What are the different RFC authorization objects in SAP Fiori?

Ans:

This authorization object contains the following fields −

• RFC_SYSID − ID of the calling system or the domain of the satellite system.
• RFC_CLIENT − Client of the calling system.
• RFC_USER − ID of the calling user.
• RFC_EQUSER − Flag that indicates whether the user can be called by a user with the same ID (Y = Yes, N = No)
• RFC_TCODE − Calling transaction code.
• RFC_INFO − Additional information from the calling system (currently inactive).
• ACTVT − Activity

35. What are the different app launched tile types in SAP Fiori?

Ans:

Static − It shows predefined static content (text, icon).

Dynamic − It shows numbers that can be read dynamically.

News Tile − Flips through news messages according to the configuration of the tile.

KPI Tile − It displays KPI’s in real time.

36. What is MVC?

Ans:

MVC stands for model view controller; it’s an architecture to design UI based applications to achieve maximum reusability and extensibility of the application for future changes. Model is the representation of data in the form of the object, View defines the UI and the Controller contains all the logic to drive as well connects view with model.

37. What is the use of PFCG role SAP_UI2_USER_700?

Ans:

The Launchpad user must have the PFCG role SAP_UI2_USER_700 assigned. With this role the user can run the SAP Fiori Launchpad on the Personalization level and has authorization to execute the following OData services −

• /UI2/PAGE_BUILDER_PERS
• /UI2/INTEROP
• /UI2/LAUNCHPAD

38. 39.What are the different options in SAP Fiori Launchpad design?

Ans:

Configuration Layer − Contains all content as delivered to customers including translation.

Customization Layer − Customers adjust content for all users in the system. We can use CUST layer for testing or other reasons. Content is transportable through customizing requests by customers. After customization, content is decoupled from configuration layer and no automatic synchronization after changes to delivered layer.

39. If Customization doesn’t run properly, is it possible to disable all customization by providing a configuration?

Ans:

If a Customization doesn’t run properly, all customization can be disabled by providing a single configuration. In support situation, this can be done by setting a breakpoint early in sap-ui-core.js and then executing the following code in the Console −

• -window[“sap-ui-config”]= window[“sap-ui-config”]||{};
• -window[“sap-ui-config”][“xx-disableCustomizing”] = true;

40. What is the use of PFCG role SAP_UI2_USER_700?

Ans:

The Launchpad user must have the PFCG role SAP_UI2_USER_700 assigned. With this role the user can run the SAP Fiori Launchpad on the Personalization level and has authorization to execute the following OData services −

• /UI2/PAGE_BUILDER_PERS
• /UI2/INTEROP
• /UI2/LAUNCHPAD

41. How can you download newly created themes that are published?

Ans:

• You can use transaction /UI5/THEME_TOOL to download newly created theme and you will find css in one of those folders.
• You can also transport themes from one system to another (Eg: from Test to Production system) using the tool for Customer Themes Maintenance.
• Start the tool using transaction: /UI5/THEME_TOOL
• Navigate to the theme you want to transport.
• Select Transport and choose.

42. What is the use of component.js file in UI extensibility?

Ans:

The configuration is stored in the component.js file of the custom application. The component of the custom application needs to inherit from the main component of the original application. To make the location of the original application or component known to SAPUI5, it may be necessary to use register Module Path. The configuration in the customizing section contains the extension metadata and describes the objects that are replaced or extended.

43. What is SAP HANA XS engine? How it is used for Business suite and KPI?

Ans:

For Analytical apps you need SAP Hana as underlying database, no exceptions. SAP Fiori leverages.

XS engine by using virtual data models. Within XS engine there are 2 components: the HANA Live App content for respective business suite and Smart business component with the KPI modeler. Within the HANA live content the VDM reuse content exists which can be modified.

In below Pic, you have ABAP front end server which contains the UI Add-Ons for respective products used, NetWeaver Gateway with OData enablement, the central UI add-on and the KPI framework. These front end components have read access to the backend data via a trusted RFC connection.

44. The add-on components in back end that require no down time for installation are known as?

Ans:

Product specific UI Add-Ons

• ERP − UI for EHP 7 for SAP ERP 6.0
• SRM − UI for EHP3 for SAP SRM 7.0
• SCM − SAP SNC USABILITY 1.0
• CRM − UI for EHP3 for SAP CRM 7.0
• PORTF and PROJ MGMT − UI for SAP PORTF PROJ MGMT 6.0
• GRC − UI for SAP ACCESS CONTROL 10.1 SP3

45. For write access to the UI Theme Designer (create, update, delete themes), which authorization object should be assigned?

Ans:

• Authorization object: /UI5/THEME
• ACTVT(Activity):02(Change) and
• /UI5/THMID (Theme Id):* = all themes

46. Mention the Prerequisites for SAP UI5?

Ans:

To install and update UI5 development toolkit for HTML5, you should meet the following prerequisites −

Eclipse Platform: Mars (4.5)

Operating System: Windows OS (XP, Vista, 7 or 8/8.1)

Java Runtime: JRE Version 1.6 or higher, 32-Bit or 64-Bit

SAP GUI: Only relevant when installing the SAP UI5 ABAP Repository Team Provider

For Windows OS: SAP GUI for Windows 7.30/7.40

Microsoft: Only relevant when installing the SAP UI5 ABAP Repository Team Provider

For Windows OS: DLLs VS2010 for communication with the back-end system is required

47. What is an SAPUI5 Architecture?

Ans:

48. What is OpenUI5 ?

Ans:

OpenUI5 described as,

A subset of SAPUI5 containing the entire core and more than 200 UI controls.

49. How do you extend an OData service (Gateway Content Layer) in SAP Gateway?

Ans:

Transaction code SE11 is ABAP dictionary. By using this transaction code, you can create, change and display table entries and structures. At the initial screen, you can put any tables or structures to view, edit or even create a new one. Transaction code SE11 is normally used a ABAP programmer.

SAP Gateway Service Builder (transaction SEGW)) is a design-time environment, which provides developers an easy-to-use set of tools for creating services. The Code-based OData Channel consumes it and supports developers throughout the development life cycle of a service.

SE80 – Object Navigator

SE 80 is a tool to develop and navigate programs and dd-obj.

SE80 Object Navigator → means all the objects will be available there. In se80 in addition to viewing the objects related to programming and classes, there are more privileges to view such as some other repositories such as mime, object repository, object browser and all.

50. What is the use of component.js file in UI extensibility?

Ans:

The configuration is stored in the component.js file of the custom application. The component of the custom application needs to inherit from the main component of the original application. To make the location of the original application or component known to SAPUI5, it may be necessary to use register Module Path. The configuration in the customizing section contains the extension metadata and describes the objects that are replaced or extended.

51. What are the SAP Fiori key principles?

Ans:

Role-based: The user only sees what they need to know.

Adaptive: Achieves seamless user experience on all devices (mobile, tablet, and desktop).

Coherent: Same look and feel across different apps.

Simple: Focuses on delivering a simple, intuitive user experience—1-1-3 (one user, one use case, and three screens).

Delightful: It’s beautiful and makes the user feel good.

52. Mention the Evolution of UI technologies?

Ans:

53. How to load the Bootstrap for UI5 framework to work in the Offline Mode?

Ans:

Reason being: Since the WebIDE local installation runs on Orion Server, which has all UI5 Framework Libraries pre-existing in the Server. To access the libraries in the framework, we define neo-app.json which acts as an interface between Orion Server ->> Resources ( test ) to load the framework.

54. What is the difference between scaling up down to scaling in out?

Ans:

The term “scaling up” means to use a more powerful single server to process the workload that fits within the server boundaries. Scale-out is a different model which utilizes multiple processors as a single entity so a business can scale beyond the computer capacity of a single server.

55. When was SAPUI5 introduced?

Ans:

SAPUI5 is a user interface development toolkit. First developed by SAP in 2010 under the code name Phoenix, the framework allows developers to create web applications for HTML5.

56. Is Fiori open source?

Ans:

SAP Fiori is Free

OpenUI5 is an Open Source JavaScript UI library, maintained by SAP and available under the Apache 2.0 license.

57. Explain how and why we could use property decorators in TS? Explain how and why we could use property decorators in TS?

Ans:

Decorators can be used to modify the behavior of a class or become even more powerful when integrated into a framework. For instance, if your framework has methods with restricted access requirements (just for admin), it would be easy to write an @admin method decorator to deny access to non-administrative users, or an @owner decorator to only allow the owner of an object the ability to modify it.

58. What is SAPUI5 bootstrapping?

Ans:

SAPUI5 provides several bootstrap files for different use cases. This is the standard bootstrap file. It already contains jQuery, jquery-ui-position and only the minimum required parts of the core library

59. What are the 3 deployment options of SAP Fiori?

Ans:

You have five basic SAP Fiori deployment options. SAP provides a useful paper to guide you on deployment, with detailed descriptions of the pros and cons of each scenario. These include FES embedded deployment, FES hub deployment, gateway embedded, gateway hub and cloud.

60.What are the goals of the new SAPUI5 based Fiori apps?

Ans:

The goal of SAP Fiori is to build an intuitive, simple-to-use UI for all SAP applications. It is not only to provide the user a consistent experience across all SAP applications and hence not need to adjust, but also to save time by not clicking around in unnecessarily complex and unintuitive user interfaces.

61. What does the SAP Fiori Rule 1 1 3 mean?

Ans:

Simple – To keep things simple, SAP has developed what it calls the “1-1-3 scenario”—One user, one use case and three screens. Role-Based – Fiori apps show the most relevant information to the user, based on role. Responsiveness – Response time is always an important parameter when designing and testing a Fiori app

62. What is SAP WEB IDE?

Ans:

SAP WebIDE is an Integrated Development Environment (IDE) which allows developers to create/extend Fiori Apps.

63. What Information Can Be Stored In The Manifest.Json File Of Your App?

Ans:

• Root view
• Supported device types
• Supported themes

64. Why WebIDE?

Ans:

• It makes easier to develop Fiori Apps using ready to use templates.
• Extensibility pane to extend Fiori Applications.
• Multiple Deployment options.
• Allows team sharing repository. Git repository
• Can access it from anywhere on any device. No local footprint (local installation is required).

65. What is metatag in html?

Ans:

It depicts the metadata of HTML page. ( refer: www.w3cshools.com for more characteristics information)

Characteristics of metatag are:

Encoding-type – help user to identify the type of characters that are applicable

Author– created by

Keyword – reside in metatag for search engine optimization

Description – description about the websites in the search engines

66. What are block level elements?

Ans:

Block level elements are used to structure the HTML content properly. These elements don’t have their own footprint on page. Two types of block level elements:

div – Division tag,

• It automatically starts with a new line
• Used to create/group a block of elements.

span – inline element

• It doesn’t starts from new line
• It wraps an existing HTML element

67. What are List tags in HTML?

Ans:

List tags are used to display sequence of data.

There are two types of list tags:

• Unordered list –
• Ordered list –

68. Difference between Open UI5 and SAP UI5?

Ans:

• Open UI5 is a Subset of SAP UI5, Most commonly used libraries are part of open UI5 for consumption by users.
• Open UI5 is an open source under Apache 2.0 license where as SAP UI5 is a licensed product, this comes along with SAP Netweaver or SCP (SAP Cloud Platform – formally known as HCP – HANA Cloud Platform).

69. What is Inline Styling?

Ans:

Inline styling is an element level / tag level styling which gets applied to all the elements defined in the tag. So if there are multiple elements, applying style for each and every element is not feasible. In that case we use Internal Style.

70. What is Responsive Web Design?

Ans:

Web design which adapts itself according to screen size to provide a consistent user experience. Based on device available space, the screen adjusts itself without a scroll bar at page level.

71. What are Fiori elements?

Ans:

SAP Fiori elements is a framework that comprises the most commonly used floorplan templates and is designed to:

• Speed up development by reducing the amount of frontend code needed to build SAP Fiori apps.
• Drive UX consistency and compliance with the latest SAP Fiori design guidelines.

72. What are the Lifecycle methods of the SAPUI5 views controller?

Ans:

There are four Lifecycle methods available in every SAPUI5 view controller.

• onInit()
• onExit()
• on after rendering()
• on before rendering()
• onInit is called when a view is instantiated and its controls (if available) have already been created;
• onExit is called when the view is destroyed, used to free resources and finalize activities;
• on after rendering when the view has been rendered and therefore its HTML is part of the document;
• on before rendering is called before the controller view is re-rendered and not before the first rendering.

73. What Are Semantic Colors In Sapui5?

Ans:

They are representations of states such as success, warning, and error.

74.What Is The Benefit Of Data Binding Within Sapui5?

Ans:

SAPUI5 uses data binding to bind two data sources or information sources together to keep them in sync. This means: All changes in one source are also reflected in the other one.

75. Define structure of a Web Application / HTML page?

Ans:

Any Web Application that is understood by browser is always a HTML page which is a static web-page. Structure of a typical web app page is a html page.

76. What Are Dialogs In Sapui5?

Ans:

• They are rendered into a particular place (the static place) within the DOM.
• They needo be delivered to the “established” aggregation of the view to get get right of entry to to the fashions.

77. How Are Unit Tests For Your App Started In Sap Web Ide?

Ans:

• By selecting the run configuration Run Unit Tests
• By right-clicking the unitTests.Qunit.Html report and deciding on an choice from the Run menu

78. Why Is Not All Javascript Code Put In A script Tag Directly On The Index.Html Page?

Ans:

79. How Can You Add A Margin All Around A Control?

Ans:

elegance=”sapUiSmallMargin”

80. How Can Sap.M.Table Behave On Smaller Devices Such As Phones And Tablets?

Ans:

• It hides much less important columns.
• It displays much less essential columns as a “pop-in”; it stacks them vertically inside the row making the table larger in top.

81. Why Sapui5 Instead Of Html5?

Ans:

As HTML5 world is the new age the front era throughout all aspect of internet packages SAP changed into form of trailing in this age due to the fact SAP was using age old WebDynpro for building SAP Web Applications which lacks in wealthy and consumer-friendly UI. SAP recognized this and came up with its very own custom HTML5 library i.E. SAPUI5.

82. Why Is Automated Testing Beneficial For App Development?

Ans:

• It notably reduces the guide testing attempt.
• It is less difficult handy over the app to other builders.
• You can avoid regressions and insects to your code.

83. What is SAP UI5 design-time & run-time component ?

Ans:

84. What Is Sinon.Js?

Ans:

A standalone unit checking out library for JavaScript that offers spies, stubs, and mocks

85. Which Benefits Does The Hash-primarily based Navigation In Sapui5 Offer?

Ans:

• Hash-primarily based navigation adjusts the modern hash for your interactions with the app, so that the URL can always be bookmarked.
• It allows you to construct one-page apps in which the contextual navigation is finished by means of changing the hash, so the browser does not have to reload the page.

86. Which Options For Code Reuse Are Available In Sapui5?

Ans:

• Controller inheritance
• Nested views
• Fragments

87. For What Stands The Abbreviation Json?

Ans:

Java Script Object Notation

88. How to declare different views in JS?

Ans:

89. What is Template Aggregation of a Table Control?

Ans:

A Template Aggregation of a control identifies how the control will be displayed on UI. It provides the control with information about what type of control we want to assign to the column and defines what kind of behavior is expected from the aggregation. e.g. textfield, dropdown, label, radio, checkbox.

90. How Navigation Works In Sapui5?

Ans:

Sap uses two mechanisms, routing and EventBus. Routing Is specifically used for bookmarking the URL. We define routing in component.js within the metadata. It also defines the navigation path and hash changer which is used at the runtime to change the url of the particular screen.

91. Define Control Hierarchy of a SAP UI5 control?

Ans:

92.Steps in which SAP UI5 framework executes and application

Ans:

Step 1: Gets the controller name (getControllerName )

Step 2: Creates object of the Controller

Step 3: pass the object of the Controller to the content (createContent)