Everything in UI5 / Fiori elements
33 of 160
Type
Domain: 3
Origin
Signals
Content
Fiori elements: Answers in Fiori elements
More
Group by: Capability
EntryBySignalsLast activity
Change promotionSAP only
git-env-branchesgit-env-branchesA command line that shows, for a list of feature branches, which environment branches such as DEV, ACC and master each one has been merged into.independent, general
Shows which feature branches reached which environment branch
A team that does not keep one long-lived branch per environment has no environment branches for it to compare feature branches against. What it reports is the merge state of branches in Git, so it says nothing about whether a merged change has been built or deployed to the environment.
Build and dev-server toolingSAP and community
@ui5/cli@ui5/cliThe UI5 Tooling command line for project setup, the local dev server and the build, which defines a UI5 project's shape and its two extension points, custom middleware and custom tasks.sap official, ui5
UI5 Tooling command line for project setup, dev server and build
ui5-middleware-livereloadui5-middleware-livereloadA dev-server middleware that adds live reload to the UI5 dev server, reloading the page when the sources in the app's webapp folder change.community org, ui5
Live reload middleware for the UI5 dev server
ui5-fe-mockserver-tutorialui5-fe-mockserver-tutorialTen exercises on @sap-ux/ui5-middleware-fe-mockserver, published for Devtoberfest 2025 as a repository to clone and a site to read, each exercise a Fiori elements app served from mock data instead of a backend.independent, ui5
Ten exercises on the Fiori elements mock server middleware
Neither the package manifest nor the repository tree declares a licence.
How to consume UI5 custom libraries in BAS or VS CodeHow to consume UI5 custom libraries in BAS or VS CodeConsuming a custom UI5 library from a UI5 application locally, using yarn workspaces to resolve the dependency instead of adjusting the project before every deploy. The post is honest about its own history: the author had asked the question on SAP Community, found a workaround that needed a pre-deploy edit, and only later learned the workspace approach that removes it. Generator-based setup throughout, and 2021-vintage — yarn workspaces, generator-ui5-library and generator-easy-ui5.published 2021-04-06
UI Composition with Application Frontend ServiceUI Composition with Application Frontend ServiceWhy shared UI code is hard, and what Application Frontend changes about it. The piece first lays out the three usual answers and what each costs — copying files at development time and repatching every consumer, publishing an npm package and rebuilding every consumer, or hosting the code separately and paying for it in CORS and session handling, or in an extra network hop through a server-side proxy. It then shows a fourth that only this service can do: runtime server-side composition without the hop, configured through routes in the consuming application's xs-app.json, across three cases — a reusable application embedded in a consumer, and two further composition shapes. Read alongside the generator, which scaffolds the mta.yaml, xs-app.json and zipper configuration this model needs.Vadim Tomnikov, published 2026-05-18
Editor supportSAP only
SAP Build CodeSAP Build CodeSAP's development environment on BTP for SAPUI5, SAP Fiori, mobile and CAP applications that run on the SAP BTP, Cloud Foundry Runtime, in which Joule generates models, services, logic, tests and apps.sap official, btp
Development environment on BTP for UI5, Fiori, mobile and CAP
SAP Web IDE Full-StackSAP Web IDE Full-StackSAP's IDE service on BTP for SAPUI5 and SAP Fiori apps, full-stack SaaS applications, SAP S/4HANA extensions, hybrid mobile apps and IoT apps, with an SDK for extending the IDE itself.sap official, btp
IDE service on SAP BTP for SAPUI5, Fiori and full-stack apps
Extending SAP Autonomous SuiteExtending SAP Autonomous SuiteExtensibility across SAP Autonomous Suite: AI-enabled development in SAP Build solutions, the ABAP Cloud model among them, as the way extensions are designed, generated and deployed, and a direction for making extensions ready for agentic AI. The abstract names the suite, SAP Build and the ABAP Cloud model and no single feature, so the edges are to Extensibility, the concern, and to SAP Build Code, the SAP Build solution held here in which Joule generates and deploys development; which other SAP Build solutions the session shows is not stated. A TechEd 2026 session (Tuesday 27 October, Berlin), presented by Alexander Rother and Khaled MUSILHY, written here from SAP's abstract; the recording is not yet published.
GeneratorsSAP only
@sap-ux/cap-config-writer@sap-ux/cap-config-writerSAP's writer module for changing a CAP project's configuration from code, so a tool can add a UI5 app to a project that already exists, returning a mem-fs editor whose commit writes the changes.sap official, cap
Writer module for changing a CAP project's configuration from code
There is nothing to run: it is published for a generator or a script to call, not for a developer to invoke in a project, and it declares Node.js 22 or later.
@sap-ux/fe-fpm-writer@sap-ux/fe-fpm-writerA library that writes flexible programming model elements, such as a custom page wired into the app's routing, into a Fiori elements application for OData v4 from Node code.sap official, ui5
Writer of flexible programming model elements into Fiori elements apps
abap2UI5 Layout Editorabap2UI5 Layout EditorA browser editor that lays out a UI5 view by drag and drop and writes it out as one abap2UI5 app class, pulled into the system with abapGit.community org, abap
Drag-and-drop UI5 view editor that writes an abap2UI5 app class
The class has to be moved by hand: an abapGit pull of the exported ZIP, or a paste into ADT or SE24. The palette is held to the 121 controls of UI5 1.71, and a control inserted by its class name instead comes from whatever UI5 the canvas has loaded, with nothing checking it against 1.71 - *Checks* reports that. An app class that builds no view, or more than one, is refused.
Joule in SAP Build CodeJoule in SAP Build CodeJoule's generative AI inside SAP Build Code, pitched as "optimized for Java and JavaScript application development": opened from SAP Business Application Studio's activity bar, slash commands generate a CAP data model, services, sample data, business logic and a Fiori elements UI.sap official, cap
Joule's generative AI inside SAP Build Code
SAP Build CodeSAP Build CodeSAP's development environment on BTP for SAPUI5, SAP Fiori, mobile and CAP applications that run on the SAP BTP, Cloud Foundry Runtime, in which Joule generates models, services, logic, tests and apps.sap official, btp
Development environment on BTP for UI5, Fiori, mobile and CAP
Give Your AI Agent Some Tools: Introducing the UI5 MCP ServerGive Your AI Agent Some Tools: Introducing the UI5 MCP ServerAnnounces @ui5/mcp-server, SAP's open-source MCP server for UI5 development, and walks through its initial six tools. get_project_info, get_api_reference and run_ui5_linter (which applies UI5 linter fixes) read the project's own version, manifest and code rather than an LLM's training data, which is what agent access to your code explains. create_ui5_app scaffolds a new JavaScript or TypeScript project, standalone or inside an existing CAP application, from templates with pre-configured OData model setups, which is generators.published 2025-09-03
UI5 MCP Server Got Extended for UI Integration Cards GenerationUI5 MCP Server Got Extended for UI Integration Cards GenerationVersion 0.2.1 of the UI5 MCP Server adds three tools for UI Integration Cards: get_integration_cards_guidelines feeds an agent current best practices and API versions, create_integration_card scaffolds a new card project, and run_manifest_validation checks the generated manifest against the schema. The post frames these as closing the same gaps as the server's existing tools — an LLM's outdated or wrong card API knowledge — this time for scaffolding and validating a card rather than a full app.daniel_vladinov, published 2026-01-22
Useful CAP CDS and Fiori Commands to Accelerate Development and DeploymentUseful CAP CDS and Fiori Commands to Accelerate Development and DeploymentA command-by-command walkthrough of @sap/cds-dk's cds add and fiori add generators: cds add xsuaa writes an XSUAA security configuration from the CDS model's authorization annotations, and cds add hana together with cds deploy --to hana switches persistence from the default SQLite database to SAP HANA Cloud. cds add mta and fiori add deploy-config, from @sap/generator-fiori, build the Cloud Foundry deployment descriptor together, adding a destination-service block and an xs-app.json that routes the Fiori app's calls through a named destination.TiaXu, published 2022-10-19
LintingSAP and community
Before You Upgrade S/4HANA: Static UI5 Checks with MCPBefore You Upgrade S/4HANA: Static UI5 Checks with MCPA UI5 version upgrade checked against one app by pairing two MCP servers: the ui5_version_diff tool added to mcp-sap-docs, which reads a bundle from ui5-lib-diff downloaded once at setup and filters it by version range, change type, library or query text, and @ui5/mcp-server, whose get_project_info, get_version_info, run_ui5_linter and run_manifest_validation say what the app uses and what fails. Run with a ui5-versions-upgrade.md skill on the legacy app from From SEGW and Legacy UI5 to RAP with ARC-1, from SAPUI5 1.84.59 to 1.147.2, the diff range held 985 deprecations and 961 What's New entries, and the linting and manifest validation narrowed that to findings in this app, among them jQuery.sap.require, synchronous bootstrap, the sap_belize theme, sap.m.MessagePage and an old manifest _version. The checks read the source in a local checkout and never the deployed app, so the report is a first pass: a changelog entry is not proof that a workaround can be deleted, and the app still has to be run and tested.published 2026-05-20
Building Secure SAPUI5 Applications: Best Practices for DevelopersBuilding Secure SAPUI5 Applications: Best Practices for DevelopersA developer-facing rundown of secure coding habits for SAPUI5 apps: typed bindings and custom formatters to reject bad input before it reaches a handler, encodeHTML() instead of rendering untrusted HTML, keeping tokens and URLs out of local and session storage, and CSRF token handling on the ODataModel. It sets up linting with ESLint and an eslint-config-ui5 rule set to catch unsafe DOM access, eval calls and unused imports as part of CI, alongside the same input validation instinct: reject invalid input early rather than trust the backend to catch it.Manisha_19, published 2025-12-10
Migrate your code with UI5 linter – Autofix has landedMigrate your code with UI5 linter – Autofix has landedUI5 linter v1.12.0 adds an initial autofix, reached with ui5lint --fix, and the post walks through it end to end: the tool first reports a deprecated global reference (sap.ui.model.json.JSONModel), then the fix rewrites it into the equivalent module import and local variable. This first version only handles that one class of deprecation — replacing deprecated globals with imports — with more fix types left for later releases tracked on the tool's GitHub roadmap.published 2025-03-19
TypeScript supportSAP only
@ui5/mcp-server@ui5/mcp-serverSAP's MCP server for UI5 development: ten tools that scaffold an app or a card, read the project in front of the agent, and run the linter and the manifest validator against it.sap official, ui5
MCP server for UI5 development with ten tools
It reads a UI5 project and the framework's own documentation, not a running system or a backend: a question about the service behind the app is answered somewhere else. Node.js v20.17 or v22.9 and above.
A ChatGPT-like chat app built with modern SAP technologies (CAP, SAPUI5) – Part 3/3A ChatGPT-like chat app built with modern SAP technologies (CAP, SAPUI5) – Part 3/3The SAPUI5 frontend of the sample, and mostly an argument for writing UI5 in TypeScript: ES imports in place of sap.ui.define, a class with real private members in place of the underscore convention, and the service types generated from the CDS model copied into the UI package, so one IChats interface types the OData object the controller reads. The second half is structure — a formatter class and a singleton LayoutManager called from the XML view through core:require, a confirmation helper taking a callback, a dialog class resolving a promise, a generic createEntity<T> on a service class — all of it to keep every controller under 100 lines. What it says about arranging a UI5 app holds whatever model sits behind the chat; the tooling around it is of its date, and the post calls UI5's TypeScript support experimental.published 2023-02-27
A ChatGPT-like chat app built with modern SAP technologies (CAP, SAPUI5) – Part 3/3
cds2types. Affects Runnable code.
debug a CAP app with UI5 TypeScript UI component with VS Codedebug a CAP app with UI5 TypeScript UI component with VS CodeDebugging both runtimes at once — the CAP server and a UI5 component written in TypeScript, the latter stepped through in its own sources rather than in the transpiled output. Written when TypeScript for UI5 had just become possible, and the combination it sets up is the one CAP's app folder invites.published 2021-11-16
TypeScript Sheriff: How can I use TypeScript in the SAP ecosystem? (Part 2 of 3)TypeScript Sheriff: How can I use TypeScript in the SAP ecosystem? (Part 2 of 3)The middle part of three, and the one about SAP: where TypeScript is supported across a side-by-side extension on BTP, as of July 2023. It says the SAP Cloud SDK already generates OData clients as .ts files and UI5 ships types for its controls and modules, the ground of TypeScript support in UI5, while CAP offers standard types and the new @cap-js/cds-typer generates types for a service, which is typing, with the caveat that running cds-ts commands could overwrite what cds-typer generated.MikeDoyle, published 2023-07-05
UI5 Views, Reimagined: Type-Safe TSX for a Modern Dev ExperienceUI5 Views, Reimagined: Type-Safe TSX for a Modern Dev ExperienceA Devtoberfest 2026 session on @ui5-community/jsx-runtime, the incubation project that lets a UI5 view be written as TSX: XML-like markup that the TypeScript compiler checks against the control's own types and a Babel plugin turns into the constructor calls UI5 already makes. The edge to the runtime rests on the session's own description, which gives the project's documentation site as the session's documentation. The TypeScript support edge holds because that is the session's subject — per-property checking, completion on every attribute, renames that carry through a view, and typed event objects that remove the casts — alongside what stays unchanged: string and expression bindings, controllers, routing and i18n, and XML views living beside TSX ones in the same app. The build edge rests on the setup, where ui5-tooling-transpile is given the JSX transform in ui5.yaml; the walkthrough then builds a bookshop app on a CAP OData service and names what is still missing, UI flexibility and native HTML among it.published 2026-10-09
UI5 testingSAP and community
wdi5-fe-selectorswdi5-fe-selectorsA set of wdi5-flavoured control selectors tuned for locating controls in Fiori Elements apps, extending the selectors wdi5 itself provides.community org, ui5
wdi5 selectors for locating controls in Fiori Elements apps
Archived The declared repository is archived.
No license Neither the package manifest nor the repository tree declares a licence.
wdio-ui5-servicewdio-ui5-serviceEnd-to-end testing for UI5 as a WebdriverIO service that drives a real browser through UI5's own test API, so a test addresses controls with OPA5-compatible selectors rather than DOM nodes.community org, ui5
End-to-end testing for UI5 on WebdriverIO with UI5 control selectors
Where the login cannot be completed by configuration. Its authentication page states that multi-factor authentication is not supported, because a media break between browser and phone cannot be managed out of the box.
ui5-fe-mockserver-tutorialui5-fe-mockserver-tutorialTen exercises on @sap-ux/ui5-middleware-fe-mockserver, published for Devtoberfest 2025 as a repository to clone and a site to read, each exercise a Fiori elements app served from mock data instead of a backend.independent, ui5
Ten exercises on the Fiori elements mock server middleware
Neither the package manifest nor the repository tree declares a licence.
Create Automated System Tests for SAP Cloud Application Programming Model ProjectsCreate Automated System Tests for SAP Cloud Application Programming Model ProjectsEnd-to-end tests driving the UI with wdi5, run in the pipeline — the layer above cds.test, which stops at the service boundary.SAP
Using the UI5 Mockserver for Client-Specific Data and TestingUsing the UI5 Mockserver for Client-Specific Data and TestingWalks through a same-day feature in @sap-ux/ui5-middleware-fe-mockserver, 'Support autoloading mockdata file for specific tenants', which loads a <Entity>-<client>.json file keyed to the sap-client URL parameter and falls back to the entity's plain JSON file when no client-specific one exists. Shows the setup replacing generated mock data with hand-written JSON, then drives the same sap-client parameter through separate package.json scripts so wdi5 end-to-end tests can run against distinct tenant datasets.published 2024-11-18
Under no capability
approuterapprouterThe showcase for dev-approuter in ui5-ecosystem-showcase: an SAP Application Router in front of two of the repository's apps, started either through the dev-time wrapper or through plain @sap/approuter.community org, cap
Showcase for dev-approuter in front of two UI5 apps
open-steamgateopen-steamgateAn ABAP application server you clone and run on your own machine: transpiled ABAP serving classic /IWBEP/ OData v2 to Fiori over a local database, with no SAP system attached.independent, abap
Local ABAP server serving /IWBEP/ OData v2 without an SAP system
Not a system to run a business application on: there is no business application in it, and what it implements of the language, the dictionary and Gateway is a stated subset of each. It is a clean-room reimplementation of the `/IWBEP/` interfaces that bundles no SAP source and no standard DDIC, so a service that reads standard objects has nothing to read, and `ANORMALIES.md` records every place the runtime differs from SAP before any workaround is written.
SAP Continuous Integration and DeliverySAP Continuous Integration and DeliveryA BTP service that runs SAP's predefined CI/CD pipelines for designated SAP development projects, building, testing and deploying the changes pushed to a connected Git repository.sap official, btp
Predefined CI/CD pipelines for SAP development projects
Supply Chain RescueSupply Chain RescueA CAP and SAPUI5 demo of recovery from a supply disruption: the server calculates every proposal and an approver applies it, with a battery recall traced in an ABAP system through HANA Graph openCypher.independent, cap
CAP and SAPUI5 demo of recovery from a supply disruption
No license Neither the package manifest nor the repository tree declares a licence.
Functional boundary The data is illustrative: availability is binary and backup capacity unlimited, and the model carries no inventory; nothing in it is forecast or priced. The recall half runs only against classic ABAP, because its openCypher trace goes through ADBC, which is not released for ABAP Cloud, and it expects an SSH tunnel to the A4H system it was built against. A plain `npm start` passes no model key, so the agent cannot be used on a server started that way.
ui5-tcode-finderui5-tcode-finderA browser page that searches SAP transaction codes by code, title or description and hands one over on a click: copied plain, copied with an /n or /o prefix, or opened in SAP GUI for HTML.independent, abap
Browser page searching SAP transaction codes
