SAP Community - HTML5

Application Frontend Service with standalone approuter

2025-07-08T23:43:01.033000+02:00

Hi community,

I am exploring Application Frontend Service in a BTP trial account and now developing an MTA consisting of a standalone approuter, a UI module, and a CAP backend. Initially, I configured the UI to use the HTML5 Application Repository to ensure it worked properly.

Then, I switched to using Application Frontend Service , referencing to the document.

Although the deployment was successful, accessing the UI through the approuter resulted in a 404 error. The initial xs-app.json of the application router was:

{
  "welcomeFile": "miyasutabooksafs",
  "authenticationMethod": "route",
  "routes": [
    {
      "source": "^/(.*)$",
      "target": "$1",
      "destination": "srv-api",
      "csrfProtection": true
    }
  ]
}

In this configuration, requests to `miyasutabooksafs` were routed to the CAP application. Then, I modified the routes as follows:

{
  "welcomeFile": "miyasutabooksafs",
  "authenticationMethod": "route",
  "routes": [
    {
      "source": "^/odata/(.*)$",
      "target": "/odata/$1",
      "destination": "srv-api",
      "authenticationType": "xsuaa",
      "csrfProtection": false
    },
    {
      "source": "^(.*)$",
      "target": "$1",
      "service": "app-front",
      "authenticationType": "xsuaa"
    }
  ]
}

However, this resulted in a deployment error of the approuter.

VError: xs-app.json/routes/1: Format validation failed (A route requires access to app-front service but the service is not bound.)

The application frontend service is bound to the approuter in mta.yaml.

  - name: srv-api
    group: destinations
    properties:
      forwardAuthToken: true
      name: srv-api
      url: ~{srv-url}
  - name: cap-afs-auth
  # - name: cap-afs-html5-runtime
  - name: cap-afs-afs # Application Frontend Service, developer plan

My GitHub repo: https://github.com/miyasuta/cap-afs/tree/appruntime

Question:

What is missing or incorrect in my configuration?
Any insights or working examples would be greatly appreciated!

HTML5 not visible in the BWZ

2025-07-09T16:26:34.288000+02:00

Hello everyone!

I am trying to deploy this template app from the SAP documentation through Cloud Foundry:
build-workzone-integration/standard/html5-content-provider-sample/ManageProducts at main · SAP-samples/build-workzone-integration

and after building the mta.yaml and deplying the .mtar archive, it does not appear in the Build Work Zone, standard edition.

I have modified the Destinations accordingly, and they appear in the cocktpit > Destinations. The app itself also appears in the cockpit > HTML5 Applications, and it runs smoothly.

Yet, nothing appears in the Build work zone Content manager, or in the Content provider, even after a refresh.

I have noticed that I could add a new content provider, using the two Destinations generated during deployment, and that makes a role available, but no App, no catalog, and no group, as defined in the cdm.json. This content provider is thus not really useful, and anyway it defeats the purpose of deploying the app and its content through GACD.

Has there been any changes in the objects that can be deployed with the cdm? The last modifications in the repo are 10 months old so it's possible, but I can't find anything about that in the documentation or the blog.

I've been stuck on this issue for the better part of the week, and while I think I have made some progresses, I'm still at loss about the root of the issue.

Thanks a lot for your guidance!

Fiori Elements: Display Tree-Structure using OData Annotation (Code Based)

2025-07-25T12:37:39.126000+02:00

Hello,

I want to create a Tree Table with Fiori Elements using SEGW, but I'm not able to do so.

I try to follow this posts:
Fiori Elements: Display Tree-Structure using OData... - SAP Community
Fiori Elements Tree Table with SAP Annotations - SAP Community

This is my data table:

This are the fields:

These are my CDS Views:

@AccessControl.authorizationCheck: #NOT_REQUIRED

@EndUserText.label: 'Intermediate View for Tree Structure'

define view entity ZCDS_I_TREE_STRUCTURE

as select from ztree_table

{

key id,

parentid,

hierlevel,

drilldownstate,

nodename,

nodedescription

}

@EndUserText.label: 'Konsumptions-View für ZTREE_TABLE'

@AccessControl.authorizationCheck: #NOT_REQUIRED

//@OData.publish: true

@UI.headerInfo: {

typeName: 'Knoten',

typeNamePlural: 'Knoten'

}

@Hierarchy.parentChild: [{

recurse: {

parent: ['parentid'],

child: ['id']

siblingsOrder: [{

by: 'nodename',

direction: #ASC

}],

rootNode: {

visibility: #ADD_ROOT_NODE_IF_DEFINED

orphanedNode: {

handling: #ROOT_NODES

}

}]

define view entity ZCDS_C_TREE_STRUCTURE

as select from ZCDS_I_TREE_STRUCTURE

{

key id,

parentid,

hierlevel,

drilldownstate,

@UI.lineItem: [{ position: 10, label: 'Node Name' }]

nodename,

@UI.lineItem: [{ position: 20, label: 'Node Description' }]

nodedescription

}

In SEGW I created a project and the did a right click on "Data Model" then "Reference" / "Data Source" and chose my ZCDS_C_TREE_STRUCTURE. Icreated the runtime objects and redefined the method "define" in my *MPC_EXT class with the following code:

METHOD define.
  super->define( ).

  DATA: lr_entity    TYPE REF TO /iwbep/if_mgw_odata_entity_typ,
        lr_property  TYPE REF TO /iwbep/if_mgw_odata_property,
        lr_annotation TYPE REF TO /iwbep/if_mgw_odata_annotation.

  lr_entity = model->get_entity_type( iv_entity_name = 'ZCDS_C_TREE_STRUCTUREType' ).
  IF lr_entity IS BOUND.

    " 1. id als Knoten-ID
    lr_property = lr_entity->get_property( iv_property_name = 'id' ).
    lr_annotation = lr_property->/iwbep/if_mgw_odata_annotatabl~create_annotation(
                        iv_annotation_namespace = /iwbep/if_mgw_med_odata_types=>gc_sap_namespace ).
    lr_annotation->add(
        iv_key = /iwbep/if_ana_odata_types=>gcs_ana_odata_annotation_key-hierarchy_node_for
        iv_value = 'id' ).

    " 2. RELATKEY als Parent Node
    lr_property = lr_entity->get_property( iv_property_name = 'parentid' ).
    lr_annotation = lr_property->/iwbep/if_mgw_odata_annotatabl~create_annotation(
                        iv_annotation_namespace = /iwbep/if_mgw_med_odata_types=>gc_sap_namespace ).
    lr_annotation->add(
        iv_key = /iwbep/if_ana_odata_types=>gcs_ana_odata_annotation_key-hierarchy_parent_node_for
        iv_value = 'id' ).

    " 3. SeqNo als Hierarchieebene
    lr_property = lr_entity->get_property( iv_property_name = 'hierlevel' ).
    lr_annotation = lr_property->/iwbep/if_mgw_odata_annotatabl~create_annotation(
                        iv_annotation_namespace = /iwbep/if_mgw_med_odata_types=>gc_sap_namespace ).
    lr_annotation->add(
        iv_key = /iwbep/if_ana_odata_types=>gcs_ana_odata_annotation_key-hierarchy_level_for
        iv_value = 'id' ).

    " 4. drill_state als Drill-Down-Zustand
    lr_property = lr_entity->get_property( iv_property_name = 'drilldownstate' ).
    lr_annotation = lr_property->/iwbep/if_mgw_odata_annotatabl~create_annotation(
                        iv_annotation_namespace = /iwbep/if_mgw_med_odata_types=>gc_sap_namespace ).
    lr_annotation->add(
        iv_key = /iwbep/if_ana_odata_types=>gcs_ana_odata_annotation_key-hierarchy_drill_state_for
        iv_value = 'id' ).

  ENDIF.
ENDMETHOD.

If I create then the Responsive Table in the BAS, it shows me my data correctly. When I change to type "TreeTable", it shows me "No data found".

What am I doing wrong?

Thanks and best regards
Thomas

@MR_srinivas
@SumitKundu
@jmalla

BUILD Work Zone - HTML5 Business Solutions vs HTML5 apps using saas_approuter

2025-07-29T10:06:34.893000+02:00

I just came across the idea of HTML5 Business Solutions in SAP Work Zone.

Developing HTML5 Business Solutions as Content Providers | SAP Help Portal

Federation of HTML5 Business Solutions | SAP Help Portal

Checking the use cases, it feels that this is target for partner apps when it comes to multitenancy. However there is the possibility to create single tenant apps.

Based on that I have a few general questions:

1) Is it possible to create a single tenant solution containing only the front end part of an app? (similar to a HTML5 app using saas_approuter)? If yes, what would be the advantages/main differences on doing so? Any sample repositories are appreciated.

2) A bit of futurology, is it possible that HTML5 apps created using saas_approuter will be deprecated in favor of HTML5 Business Solutions? I ask that mainly after Roadmap item "Automatic content refresh for integrated HTML5 applications after update" not targeting saas_approuter but only Business Solutions

If anyone from SAP can explain what was the concept behind Business Solutions, specially a single tenant scenario are very appreciated. Are such apps internally handled differently? Is there any relevant difference on the managed router of such scenarios?

Thanks in advance,

unable to see in HTML5 Application in SAP BTP COCKPIT Subaccount

2025-08-05T13:32:52.972000+02:00

Can you please share what are the steps you have followed for the above Issue?

I'm also facing the same issue/error.

Navigation Issue in CAP UI5 Apps on BTP CF Fiori Launchpad After Page Refresh

2025-08-07T12:26:15.033000+02:00

Hi all,

We are building several CAP-based UI5 applications deployed on BTP Cloud Foundry.

When these applications run inside the Fiori Launchpad (FLP), we encounter a navigation issue: if a user refreshes the page explicitly, they are unable to navigate back using either the browser’s back button or the Launchpad’s NavBack button (next to the SAP home icon). Initially, the user remains stuck on the current page (the browser hash doesn’t change either). After a few clicks, they are suddenly redirected straight to the FLP home page.

There are no errors/warnings/info in the browser's console log.

This issue does not occur when the same UI5 apps are run in standalone mode (accessed via the HTML5 Applications tab in the BTP Cockpit), nor does it affect Fiori Elements apps running in FLP.

Here’s how we handle navigation and routing in our UI5 app view controllers (TypeScript):

Navigating Forward

// params are routing parameters such as mandatory parameter
public navToView(viewName: string, params?: object): void {
    this.getRouter().navTo(viewName, params ? params : {});
}

Example usage:

public onNavToNextView(): void {
    this.navToView("nextView");
}

We even added a nav back button, but it has the same problem as well.

Navigating Back

// same, params is just an obj for routing parameters
public navBackToView(viewName: string, params?: object): void {
    const history = History.getInstance();
    const previousHash = history.getPreviousHash();

    if (previousHash !== undefined) {
        window.history.go(-1);
    } else {
        this.getRouter().navTo(viewName, params ? params : {}, true);
    }
}

Example usage:

// press event for nav back button
public onNavBack(): void {
    this.navBackToView("previousView");
}

This is how we initialise the router in the Component.ts file:

this.getRouter().initialize();

This is the routing configuration in the manifest.json file:

"routing": {
      "config": {
        "routerClass": "sap.m.routing.Router",
        "controlAggregation": "pages",
        "controlId": "app",
        "transition": "slide",
        "type": "View",
        "viewType": "XML",
        "path": "myapp.view",
        "async": true,
        "bypassed": {
          "target": "notFound"
        }
      },
      "routes": [
        {
          "name": "RouteHome",
          "pattern": ":?query:",
          "target": ["TargetHome"]
        },
        {
          "pattern": "login",
          "name": "login",
          "target": "login"
        }
      ],
      "targets": {
        "TargetHome": {
          "id": "Home",
          "name": "Home",
          "level": 1
        },
        "login": {
          "viewName": "Login",
          "viewId": "login",
          "level": 1
        },
        "notFound": {
          "id": "notFound",
          "name": "NotFound",
          "transition": "show"
        }
      }
    }

Are we missing something in our implementation? We’ve followed UI5 examples from the Demo Kit. Could this be a known or unknown issue/bug with FLP itself?

Any insights or suggestions would be greatly appreciated!

Thank you.

HTML5 Application Logging in BTP Cocpit - Neo Environment

2025-08-07T13:17:42.131000+02:00

Hi SAP Community,

I’m currently working on an SAPUI5 HTML5 application deployed in the SAP BTP Neo environment, and I’ve encountered an issue with logging.

I’ve implemented client-side logging using the standard SAPUI5 logging API:

sap.ui.define(["sap/base/Log"], function(Log) {

Log.error("An error occurred", "Detailed error message", "my.app.Component");

});

After deploying the application, I expected these logs to appear in the SAP BTP Neo Cockpit -> Monitoring -> Logs section. However, I’m not seeing any of the custom logs there. I’ve verified that the application is running correctly and that the logs do appear in the browser console during runtime.

I also noticed that the Application Logging Service is not available in my Neo subaccount, which limits my options for centralized logging.

My Questions:

Are client-side logs from SAPUI5 apps automatically captured in the Neo Cockpit?
Is there a recommended way to push custom logs from HTML5 apps to the Cockpit in Neo?
Are there any alternative logging mechanisms or services available for Neo HTML5 apps?
Has anyone successfully implemented a workaround or custom logging integration?

Any guidance, suggestions, or examples would be greatly appreciated!

Thanks in advance,
Ramesh K

How to use local copy parameters html5 application on work zone advanced such as adding variant ID

2025-08-09T14:04:46.554000+02:00

Hello,

We have Work Zone Advanced and have built and deployed various HTML5 apps via Business Application Studio running on Cloud Foundry using OData v4. No backend content to systems such as S/4HANA, all local to BTP.

We are creating local copies of the deployed dynamic applications to manage dynamic content for counters and titles. We are attempting to have the applications open with preselected filters but are having issues.

Cannot use operators or regular expressions for filtering fields and sorting in the parameters with the content manager local copy of the application.
- We have attempted various ways in both the Navigation and Visualization tabs for setting filter and sorting with only success with single values and equals as the operator. For example, we cannot find a way to filter for filter = <empty>
As an alternate method we attempted to follow instructions to map a variant as part of the parameters, however this was also not successful.
- We collected the variant id from dev tools > network > changes?sap-language=en and collecting the filename such as
  - fileName: "id_1754739886907_236_flVariant"
  - fileType: "ctrl_variant"
  - layer: "PUBLIC"
- We followed the guides to add the parameter variable such as sap-ui-fe-variant-id and others in the link below as well as variantKey, however none of which worked. This could be due to potentially a wrong variant id however we only see one fileName captured in the Network during a variant save event as described above.
  - https://help.sap.com/docs/ABAP_PLATFORM_NEW/468a97775123488ab3345a0c48cadd8f/4132ffa02f1148058a78dfb11c8567b0.html

The guidance and documentation on the usages of the navigation and visualization parameters within the work zone advance content manager UI is not clear. The general question is there clear guidance on how to setup parameters, what parameters can be used, how to open the app with a defined variant etc.?

Approuter: Error getting client_credentials

2025-08-26T21:53:18.480000+02:00

We operate a multi-tenant solution on SAP BTP and rely on the @sap/approuter package as our initial entry-point which connects to the portal service and a number of Fiori Elements HTML5 applications hosted using html5-apps-repo services. This is a setup we have used for many years without any issue.

We recently bumped the version of the approuter package from 16.4.x to the 20.6.1 and after deploying this change in our production environment, we started getting reports of intermittent issues loading HTML5 apps:

I inspected the approuter logs and found that we had a number of errors matching this format:

Error getting client_credentials token for html5-apps-repo-rt from subaccount <tenant-subdomain>: 
HTTP response from https://<tenant-subdomain>.authentication.us10.hana.ondemand.com/oauth/token was 401: 
{"error":"invalid_client","error_description":"Bad credentials"}.

I referred back to the CHANGELOG.md for the approuter package and noticed that there had recently been some changes related to client credentials. I also noticed that a new version of the package was available (20.7.0) included a fix related to client_credentials and saas which I thought might address the issue we were experiencing:

- Read grant_type and saas.registry.enabled from service credentials in client_credentials token flow

We applied this update but are still experiencing the same behavior.

I recognize that jumping multiple major versions (16->20) of a package has the potential for unexpected outcomes but the CHANGELOG.md did not have any indications that changes between any of these versions introduced major breaking changes.

If anyone can provide any insights on how to proceed, it would be greatly appreciated.

UI5 Application works from BAS, but from HTML5 Repo, it gives 404 Error

2025-09-04T09:14:31.402000+02:00

Hi There,

Good day !
We are migrating our exiting Freestyle Ui5 applications from NEO to CF.

As part of migration process, we imported the app in BAS, configured oData destination, prefix etc.
The app and oData calls work when running it from BAS.

When deploy from BAS to CF, we could see the app in HTML5 repository, also 3 service instances with 4 service keys altogather.
When I try to run the app from CF (HTml5 Repo, app URL link), I get 404 errors for metadata load, and thus the app load is failing.
Following several answers in checked mta, ui5.yaml etc from web, I did removed "/" prefix, applied prefix etc, nothing worked.

I did check, the backend destination, path, prefix, url in ui5.yaml didn't find anything wrong.
The difference I see in metadata call is

From BAS successful : https://port8080-workspaces-ws-xl2uw.XXXXXX.applicationstudio.cloud.sap/<Neodestination prefix>/odata/<serviceName>/$metadata?sap-client=500&sap-language=EN

From HTML5 Repo un-successful: https://cloudfoundry-<XXXXX>.launchpad.cfapps.<XXXXX>..hana.ondemand.com/<GUID>.<APPNAME>.<APPNAME>-<Version#>/<Neodestination prefix>/odata/sap/<serviceName>/$metadata?sap-language=6N

Tried multiple ways of splicing the failed url removing app name etc, nothing worked

Not sure what am I doing wrong.

Any help in this regard is highly appreciated.

Thank you,

Sai

How to authorize a CF-deployed HTML5 app via a Content Package role in SAP Build Work Zone (Standard

2025-09-04T16:54:12.167000+02:00

Hello experts,

I’m a junior SAP developer working with SAP Build Work Zone, standard edition, and I’m running into difficulties with content packages.

Here’s my current setup:

I deployed a custom UI5 application via Cloud Foundry from BAS (cf deploy application.mtar).
I’m managing roles, tiles, spaces, and pages through a Content Package.

What works so far:

I can deploy custom tiles from the content package.
I can configure intent-based navigation (inbounds) to launch my app.

Where I’m stuck:

I cannot get authorization to work for the HTML5 app via a custom role.
I don’t know the correct way to reference the CF-deployed HTML5 app so that it can be added to the list of authorized apps in my content package role.
Currently, it only works if I assign the app to the Everyone role, which of course is not secure.

My current package looks like this:
content-package/

├── card/
│ ├── all the files necessary for a custom card (working fine)
├── cdm/
│ ├── apptodeploy.json
│ ├── page.json
│ ├── role.json
│ └── space.json
│
├── content.json
└── manifest.json

I've referenced the app I'm trying to access to using its SAPUI5 Component Name (same as its id), as it appears in the content manager. I've exported the app from the CM and noted that its full name in the exported file is saas_approuter_appID, so I've tried that too, to no avail. And I've tried to create a businessapp in /cdm/apptodeploy.json in order to create a sort of placeholder for the app so that I can reference it, but to no avail either.

Question(s):
Is there a best practice for exposing CF-deployed HTML5 apps in a Content Package (CDM), so they can be authorized via custom roles? Has anyone implemented this workflow successfully? Any examples, documentation, or working patterns would be greatly appreciated.

Thanks in advance for your guidance!

Unable to use fiori element app inside an iframe.

2025-09-22T14:30:02.572000+02:00

Hello Experts,

I have built a Fiori Element app using local CAP project. I have not used App router (neither external nor managed). The app is deployed and is now available under BTP Cokcpit, HTMl5 Apps.

However when I try to access it in an Iframe (embedding it in Sales and Service Cloud V2 as Mahsup). The app UI loads, but controls donot work.

Need help how to enable the app for the Control to work in Iframe.

Need Support:

@Kinsbrunner ,

@mike_zaschka

Step-by-Step Guide to Enabling the HTML5 Applications Repository in SAP BTP

2025-10-29T13:42:24.052000+01:00

This Blog explain the how to enable the HTML5 Applications repository

At first we need to enable the 2 things successfully like

1. Cloud Identity Services

2. SAP Build Work Zone

In the very first step is to click the Create option in your Instances and Subscriptions tab

In this New Instance Window click on Cloud Identity Services then Plan will be default

Service: Cloud Identity Services

Plan: default

Once you done click on Create in the Bottom of the Screen

Once you have create the above service successfully then we need to move on to the Users tab then click on user we need and click on Assign Role Collection

Once you click on that the Assign Role Collection Dialogue will open then we need to search and assign the roles in below

Cloud Connector Administrator, Connectivity and Destination Administrator, Subaccount Service Administrator, Subaccount Viewer

Once you have assigned the role it will looks like below

After completing the above step, please check your email for a message regarding identity authentication. Click the link provided in the email to activate it and verify your account.

Once you click on the link the Cloud Identity service will open if not just go the Cloud Identity service which was in your BTP Instance and service

Once you have verified through mail move to the Instances and Subscriptions tab click on Cloud Identity then click Go to Application

Once you have done you will see this page Cloud Identity Services in this click on User Management

After clicking the User Management verify the user credentials here

Then move on the Trust Configuration Part under the Security then click on Establish Trust the configure Tenant pop up will open

In this select the Default value

In this choose Domain option choose option end with ‘trail-accound.ondemand.com’

Then click on create to sap build work zone

With this you can go for standard subscription plan

We have successfully activated the sap Build work zone

Then will check on HTML5 Applications tab you can see HTML5 application now allow to add application here, Thank for Reading!

HTML5 app not showing in BTP Cockpit After deployed

2025-11-04T00:01:46.675000+01:00

Hello Community,

I know there are some similar questions but I can not figure it out the problem.
This is the log I got once application is deployed to html5, but I can not make it appear in html5 application list.

#2025 11 03 22:36:55.840#Z#DEBUG#8277ce9a-b905-11f0-8071-eeee0a92e238.CSR-app-content_CSR-repo-host#flowable-async-job-executor-thread-5683#

[PollDeployContentStatusExecution] [CSR-app-content] [INFO] Application content was successfully uploaded from subaccount { CODE: '1002' }#

This is my mta.yaml, I have both unmanaged router and managed router applications. This module CSR-app-content is doing the deployment, log does not show error when deploying but app does not show in list - tried refresh as well. unmanaged app deploys and works with no problem. I am doing managed to use launchpad functionality.

Please your suggestion.

_schema-version: 3.3.0

ID: CSR

description: CSR CAP project.

version: 1.0.0

modules:

- name: isbncertificatesrv

type: nodejs

path: gen/srv

properties:

DEBUG: sap-cloud-sdk:*

requires:

- name: isbncertificate-auth

- name: isbn-postgres

- name: isbn-destination-service

- name: isbn-connector-connectivity

provides:

- name: srv-api

properties:

srv-url: ${default-url}

parameters:

buildpack: nodejs_buildpack

instances: 1

build-parameters:

builder: npm-ci

- name: csr-app-postgres-deployer

type: nodejs

path: gen/pg

requires:

- name: isbn-postgres

parameters:

buildpack: nodejs_buildpack

disk-quota: 1GB

memory: 1GB

no-route: true

no-start: true

tasks:

- command: npm start

disk-quota: 1GB

memory: 1GB

build-parameters:

ignore:

- node_modules/

- name: isbncertificateui

type: nodejs

path: app

requires:

- name: srv-api

group: destinations

properties:

forwardAuthToken: true

url: ~{srv-url}

- name: isbncertificate-auth

provides:

- name: app-api

properties:

app-protocol: ${protocol}

app-uri: ${default-uri}

parameters:

buildpack: nodejs_buildpack

disk-quota: 1GB

keep-existing-routes: true

memory: 1GB

build-parameters:

ignore:

- default-env.json

- .env

- name: CSR-app-content

type: com.sap.application.content

path: .

requires:

- name: CSR-repo-host

parameters:

content-target: true

build-parameters:

build-result: resources

requires:

- artifacts:

- isbncertificatehtml5isbncertificatehtml5.zip

target-path: resources/

- name: isbncertificatehtml5isbncertificatehtml5

type: html5

path: app/isbncertificatehtml5

build-parameters:

build-result: dist

builder: custom

commands:

- npm install

- npm run build:cf

supported-platforms: []

resources:

- name: isbncertificate-auth

type: org.cloudfoundry.managed-service

parameters:

config:

tenant-mode: dedicated

xsappname: isbncertificate-${org}-${space}

path: ./xs-security.json

service: xsuaa

service-plan: application

- name: isbn-postgres

type: org.cloudfoundry.managed-service

parameters:

service: postgresql-db

service-plan: development

- name: isbn-destination-service

type: org.cloudfoundry.managed-service

parameters:

config:

HTML5Runtime_enabled: true

init_data:

instance:

destinations:

- Authentication: NoAuthentication

Name: ui5

ProxyType: Internet

Type: HTTP

URL: https://ui5.sap.com

existing_destinations_policy: update

service: destination

service-plan: lite

- name: isbn-connector-connectivity

type: org.cloudfoundry.managed-service

parameters:

service: connectivity

service-plan: lite

- name: CSR-repo-host

type: org.cloudfoundry.managed-service

parameters:

service: html5-apps-repo

service-name: CSR-html5-service

service-plan: app-host

parameters:

deploy_mode: html5-repo

enable-parallel-deployments: true

build-parameters:

before-all:

- builder: custom

commands:

- npm ci

- npx cds build --production

- bash ./pg-build.sh

ReferenceError: sap is not defined

2025-11-07T11:02:42.791000+01:00

Hello Experts,

our pipeline is failing with below error in the karma step

as we are using piper template to run our pipeline we are using KarmaExecutetests step

when we are the tests in local it is running fine but when we run in the pipeline it failing with below error

Chrome Headless 139.0.0.0 (Linux 0.0.0) ERROR

info karmaExecuteTests - Uncaught ReferenceError: sap is not defined

info karmaExecuteTests - at webapp/test/unit/unitTests.qunit.js:1:1

info karmaExecuteTests -

info karmaExecuteTests - ReferenceError: sap is not defined

info karmaExecuteTests - at webapp/test/unit/unitTests.qunit.js:1:1

please find the logs for better understanding attached
below is unittest.qunit.html file

<!DOCTYPE html>
<html>

<head>
	<title>Unit tests</title>
	<meta http-equiv='X-UA-Compatible' content='IE=edge'>
	<meta charset="utf-8">

	<script 
		id="sap-ui-bootstrap"
		src="../../../../resources/sap-ui-core.js"
		data-sap-ui-libs="sap.m"
		data-sap-ui-resourceroots='{
			"exemptiontool.exemptiontool": "../../",
			"test/unit": "./"
		}'>
		</script>

	<script src="../../../../resources/sap/ui/qunit/qunit-css.js"></script>
	<script src="../../../../resources/sap/ui/thirdparty/qunit.js"></script>
	<script src="../../../../resources/sap/ui/qunit/qunit-junit.js"></script>
	<script src="../../../../resources/sap/ui/qunit/qunit-coverage.js"></script>

	<script>
		QUnit.config.autostart = false;

		sap.ui.require(
			["test/unit/allTests"],
			function () {
				QUnit.start();
			}
		);
	</script>

</head>

<body>
	<ol id="qunit-tests"></ol>
	<div id="qunit-fixture"></div>
</body>

</html>

below is opa5.qunit.html

<!DOCTYPE html>
<html>
<head>
    <title>Integration tests</title>
    <meta charset="utf-8">

    <script id="sap-ui-bootstrap"
            src="../../../../resources/sap-ui-core.js"
            data-sap-ui-theme='sap_fiori_3'
            data-sap-ui-resourceroots='{
                "exemptiontool.exemptiontool": "../../"
            }'
            data-sap-ui-animation="false"
            data-sap-ui-compatVersion="edge"
            data-sap-ui-async="true">
    </script>

    <link rel="stylesheet" type="text/css" href="../../../../resources/sap/ui/thirdparty/qunit-2.css">

    <script src="../../../../resources/sap/ui/thirdparty/qunit-2.js"></script>
    <script src="../../../../resources/sap/ui/qunit/qunit-junit.js"></script>

    <script src="opaTests.qunit.js"></script>

</head>
<body>
    <div id="qunit"></div>
    <div id="qunit-fixture"></div>
</body>
</html>

could you please help me here
Best Regards,
Bhanu.

HTML5 Application asking user and password

2025-11-17T19:39:25.119000+01:00

I created a RAP and deploy it in BaS. In BTP Cockpit, my application appear in HTML5, but when i try to test it, the popup asking user and password appear. I try to put my user and pass, but it doesn't work. I think that some configuration is missing.

I try generate a simple hello world UI5 application and it's work fine. My problem is RAP application (List Report Page).

I found a sapnote 3651537 with error that i get, but i don't understand the solution.

How to solve it?

Launch default app in Build Workzone site

2025-11-25T12:39:38.847000+01:00

I have a site created in SAP Build Workzone which displays a set of tiles when opened - All apps are maintained and deployed individually.
Do we have any way to set a particular app as the default app or trigger that tile when the site opens.
Something like redirection or default route that can be configure in the code or site settings.

Do we have any option to set the default route?

HTML5 Application Migrated from NEO to Cloud Foundry Not Visible in BTP / Build Work Zone

2025-12-26T05:46:30.481000+01:00

We have a basic HTML (SAPUI5) application running on SAP NEO, which we are currently testing to migrate to SAP BTP Cloud Foundry.

We have completed the required configurations on the Cloud Foundry side and updated the following files accordingly:

xs-app.json
mta.yaml
xs-security.json
manifest.json

We successfully build the MTAR file and deploy it from SAP Business Application Studio (BAS). The deployment completes without any errors.

However, after deployment:

The application does not appear under HTML5 Applications in the SAP BTP cockpit
The application is also not visible in SAP Build Work Zone
We have already created an instance of HTML5 Application Repository Service with the app-host plan

Could you please help us understand:

What could be the possible reasons for the application not appearing in HTML5 Applications or Build Work Zone?
Are there any mandatory configurations or services (such as app-runtime, destination, XSUAA, or content module settings) that are commonly missed during NEO to Cloud Foundry migration?
Are there any specific checks or logs we should verify after a successful MTAR deployment?

Any guidance or best practices for migrating HTML5 applications from NEO to Cloud Foundry would be greatly appreciated.

mta.yaml:

_schema-version: "3.2"

ID: test.getuserdetailsmta

version: 0.0.1

description: Generated by Fiori Tools

modules:

- name: testgetuserdetailsmta-app-content

type: com.sap.application.content

path: .

requires:

- name: testgetuserdetailsmta-repo-host

#- name: testgetuserdetailsmta-html5-runtime_new

parameters:

content-target: true

- name: testgetuserdetailsmta-destination-service

build-parameters:

build-result: resources

requires:

- name: testgetuserdetailsmta

artifacts:

- dist.zip

target-path: resources/

- name: testgetuserdetailsmta

type: html5

path: .

parameters:

buildpack: nodejs_buildpack

requires:

- name: testgetuserdetailsmta-xsuaa

build-parameters:

builder: custom

commands:

- npm install

- npm run build:cf

build-result: dist

supported-platforms: []

resources:

- name: testgetuserdetailsmta-repo-host

type: org.cloudfoundry.managed-service

parameters:

service: html5-apps-repo

service-plan: app-host

service-name: testgetuserdetailsmta-html5-service

# - name: testgetuserdetailsmta-html5-runtime_new

# type: org.cloudfoundry.managed-service

# parameters:

# service: html5-apps-repo

# service-plan: app-runtime

# service-name: testgetuserdetailsmta-html5-runtime_new

- name: testgetuserdetailsmta-destination-service

type: org.cloudfoundry.managed-service

parameters:

service: destination

service-plan: lite

service-name: testgetuserdetailsmta-destination-service

config:

HTML5Runtime_enabled: true

init_data:

instance:

destinations:

- Name: ui5

URL: https://ui5.sap.com

Type: HTTP

ProxyType: Internet

Authentication: NoAuthentication

existing_destinations_policy: update

version: 1.0.0

- name: testgetuserdetailsmta-xsuaa

type: org.cloudfoundry.managed-service

parameters:

service: xsuaa

service-plan: application

service-name: testgetuserdetailsmta-xsuaa

config:

xsappname: testgetuserdetailsmta

tenant-mode: dedicated

scopes:

- name: Display

description: Display scope

parameters:

deploy_mode: html5-repo

enable-parallel-deployments: true

xs-app.json:

{

"welcomeFile": "/index.html",

"authenticationMethod": "route",

"routes": [

{

"source": "^<apply-service-segment-path>/(.*)$",

"target": "<apply-service-segment-path>/$1",

"destination": "ui5",

"authenticationType": "xsuaa",

"csrfProtection": false

{

"source": "^/resources/(.*)$",

"target": "/resources/$1",

"authenticationType": "none",

"destination": "ui5"

{

"source": "^/test-resources/(.*)$",

"target": "/test-resources/$1",

"authenticationType": "none",

"destination": "ui5"

{

"source": "^(.*)$",

"target": "$1",

"service": "html5-apps-repo-rt",

"authenticationType": "xsuaa"

{

"source": "^/user-api(.*)",

"target": "$1",

"service": "sap-approuter-userapi"

}

]

}

xs-security.json:

{

"xsappname": "test.getuserdetailsmta",

"tenant-mode": "dedicated",

"description": "Security profile of called application",

"scopes": [],

"role-templates": []

}

ui5-deploy.yaml:

# yaml-language-server: $schema=https://sap.github.io/ui5-tooling/schema/ui5.yaml.json

specVersion: "4.0"

metadata:

type: application

resources:

configuration:

propertiesFileSourceEncoding: UTF-8

builder:

resources:

excludes:

- /test/**

- /localService/**

customTasks:

- name: ui5-task-zipper

afterTask: generateCachebusterInfo

configuration:

archiveName: testgetuserdetailsmta

relativePaths: true

additionalFiles:

- xs-app.json

Can anyone assist on this?

SAP BTP, Cloud Foundry runtime and environment SAP Build Work Zone, standard edition SAPUI5

SAP Build, HTML5 repository app permission

2026-01-08T15:37:25.746000+01:00

Hi all,

once I deployed an app to BTP environment, I can see the result in HTML5 repository. Let's say I have hundrets of users on BTP and dozends of HTML5 apps deployed. How can I grant access to dedicated apps?

If I grant access to role collection containing role Application_Frontend_Viewer, users can access all apps, if they know the links. In most cases, they need to authenticate to backend services. But if the destination has been defined with basic auth and fixed users, I have serious security concerns.

What is the right way securing individual apps?

EDIT: I did some further checks. I can use SAP Build Workzone and it's corresponding role concept to grant access to an individual tile. But this does not affect permission to the app itself. As long as the user "knows" the right link, he can always access the app. How to prevent this?

Slow frontends (HTML5)

2026-01-15T13:51:13.852000+01:00

Hi, everyone.

We have been using this SAP frontend paradigm for more than 10 years with the launch of Fiori. I used the tools, applications, watched presentations, lectures, videos. I read reviews, comments, but I never found anything that expresses the most striking feeling for me about this subject in all situations:
These frontends are so slow. As far as it compares to the previous generation of SAP and other current frontends we have come across.
It's very easy to give up or get lost doing something else while waiting for the page to respond.

Does anyone else have this feeling?