BrowseSAPUI5 and OpenUI5
Everything in UI5
21 of 325
Domain: 2
Signals
Content
More: 3
Group by: Capability
Domain Developer ExperienceDomain Data & PersistenceSource SAP CommunitySource SAP Architecture CenterSource SAP Developer CenterClear all
EntryBySignalsLast activity
AttachmentsSAP and community
Building an Attachment Upload and Download Solution Using UploadSetwithTable ControlBuilding an Attachment Upload and Download Solution Using UploadSetwithTable ControlThe successor control to UploadSet posts the file in one request by default, and against CAP that is wrong: the record has to be created first and the content put to it afterwards. The author states the two-step shape plainly and notes it may not apply to an ABAP backend, which is the kind of boundary that usually goes unsaid. Written during a proof of concept for a reusable attachment component, and it carries the problem they hit with the control.published 2025-03-13
Configure Journal Entry Posting Approval from Store Template in Build Process AutomationConfigure Journal Entry Posting Approval from Store Template in Build Process AutomationWalks through deploying SAP's Journal Entry Posting Approval template from the SAP Build Process Automation Store against an on-premise S/4HANA system that has no Secure Network Connection: destinations for S/4HANA via Cloud Connector, for SAP Document Management service, integration option to hold the approval's supporting documents, and for the BPA service and its SMTP mail. It then swaps the template's SNC action groups for basic-connection BAPI calls and deploys the approval's UI5 applications so the task lands in My Inbox, with a Desktop Agent registered to run the unattended document-check and document-post automations.published 2025-01-28
Extend Upload Set to Fiori Elements and utilize Document Management ServiceExtend Upload Set to Fiori Elements and utilize Document Management ServiceWritten two months before there was an official plugin, and the author has left the record of that in the page: an update dated 2024-04-04 noting the CAP team released @cap-js/attachments, and another dated 2024-05-21 saying they tested it and wrote up the Object Store variant separately. The hand-built version underneath is still the answer when the plugin's storage choices do not fit.published 2024-02-25
Extend Upload Set to Fiori Elements and utilize Document Management Service
Attachments has changed 3 times since this was published, most recently in @cap-js/sdm 1.0.0, 2024-06-26. Affects Runnable code.
Extend Upload Set with Table to Fiori Elements and utilize Object StoreExtend Upload Set with Table to Fiori Elements and utilize Object StoreThe Object Store variant of the author's earlier Document Management post, written after testing @cap-js/attachments — a sample managing text and file information together, and offered as something for people new to BTP rather than as a pattern.published 2024-05-21
Extend Upload Set with Table to Fiori Elements and utilize Object Store
Fiori annotations changed in @sap/cds-dk 9.6.0, 2025-12-17. Affects Runnable code.
Media Handling in SAP CAPM – Backend and Frontend ImplementationMedia Handling in SAP CAPM – Backend and Frontend ImplementationFiles against a record with the front end included, which most of the attachments writing here leaves out — the entity that stores the content, the custom logic around it, and then the UI5 side that uploads and retrieves. End to end rather than one half.published 2026-03-02
Unlocking Efficiency: Leveraging SAP BTP Document Management Service in Fiori Applications # 2Unlocking Efficiency: Leveraging SAP BTP Document Management Service in Fiori Applications # 2Document Management's own Attachment Reuse UI dropped into a Fiori elements List Report, in two variants — OData V2, and OData V4 in a CAP application. The CAP half is one of the two scenarios rather than the subject; the rest of the series is about custom Fiori apps and a process task UI, with no CAP in them.published 2024-12-10
Upload attachments in a Freestyle UI5 and CAP appUpload attachments in a Freestyle UI5 and CAP appAttachments where the UI is freestyle rather than Fiori elements, so none of the generated upload behaviour applies and both ends have to be written.published 2023-12-19
Build and dev-server toolingSAP and community
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
How to Use NPM Modules Like crypto-js in SAPUI5 Using UI5 Tooling ModulesHow to Use NPM Modules Like crypto-js in SAPUI5 Using UI5 Tooling ModulesWalks through adding ui5-tooling-modules to a SAPUI5 project on UI5 Tooling v3: installing the npm package crypto-js alongside it, then wiring a ui5-tooling-modules-task builder task and a ui5-tooling-modules-middleware dev-server middleware into ui5.yaml so the UI5 module loader can resolve it. A controller then loads crypto-js/sha256 through sap.ui.define and calls it like any other AMD dependency, with the stated limit that the pattern works only inside a controller or other AMD-style module, not through a top-level import or require().DakshKumarSingh, published 2025-09-04
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
Now AI Helps You Developing SAPUI5 ApplicationsNow AI Helps You Developing SAPUI5 ApplicationsA walkthrough of Joule's generative AI chat panel for freestyle SAPUI5 development inside SAP Build Code: typed requests in the panel add a view with routing, a model with sample data and a table, or make hardcoded texts translatable, and an "Accept" button transfers the generated code straight into the project's files, with a "Copy" fallback for editing it by hand first. It recommends asking for whole increments rather than one control at a time, notes that Joule keeps the running conversation as context until "Reset Conversation" is pressed, and flags that generated control namespaces are sometimes wrong. A related Joule feature from the Fiori tools team instead creates a complete SAP Fiori elements list report application with its CAP project from business requirements, to continue from with this one.AndreasKunz, published 2024-03-27
GeneratorsSAP and community
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
Now AI Helps You Developing SAPUI5 ApplicationsNow AI Helps You Developing SAPUI5 ApplicationsA walkthrough of Joule's generative AI chat panel for freestyle SAPUI5 development inside SAP Build Code: typed requests in the panel add a view with routing, a model with sample data and a table, or make hardcoded texts translatable, and an "Accept" button transfers the generated code straight into the project's files, with a "Copy" fallback for editing it by hand first. It recommends asking for whole increments rather than one control at a time, notes that Joule keeps the running conversation as context until "Reset Conversation" is pressed, and flags that generated control namespaces are sometimes wrong. A related Joule feature from the Fiori tools team instead creates a complete SAP Fiori elements list report application with its CAP project from business requirements, to continue from with this one.AndreasKunz, published 2024-03-27
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
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 and community
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 testingSAP and community
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