BrowseAll ecosystems
Everything in the atlas
29 of 2341
Domain: UI & Frontend Bridge
Signals
Content: 2
More
Group by: Capability
EntryBySignalsLast activity
The Fourth Way to Go Offline in UI5 (And Why the Service Worker Stays Dumb)The Fourth Way to Go Offline in UI5 (And Why the Service Worker Stays Dumb)Reporting on the UI5Con session run by Viktor Sperling and Lars Kissel, the post proposes a fourth offline architecture for a warehouse scanning app: a service worker kept deliberately ignorant of OData, and a JSONModel/IndexedDB layer that does an explicit download, work, submit cycle, queuing local mutations before posting one $batch with a single changeSet at the end of a session. It also works through the alternative v4.ODataModel change-buffer pattern (updateGroupId, submitBatch) and explains why Fiori elements' annotation-driven, live OData V4 interactions resist offline replay. The session-token and XSRF-expiry problem for long offline periods is named as an open gap rather than solved.Noel_Hendrikx, published 2026-07-15
CAP Foundry: Engineering SAP CAP Applications from Business Intent with Guardrailed AICAP Foundry: Engineering SAP CAP Applications from Business Intent with Guardrailed AICAP Foundry is a prototype that generates a CAP Node.js project with SAP Fiori elements from a written business requirement, discovering the actual data shape from a chosen source — SQLite, a configured SAP HANA HDI container, offline EDMX, live OData through the SAP Destination service, or approved SAP BTP ABAP objects — instead of inventing one. The generated application can carry a Fiori draft lifecycle with optimistic concurrency via ETags and annotation-driven Fiori elements list and object screens, localized independently of the underlying service contract. Attachments can be added with upload, download and delete, gated on a malware-scan status, and the generated project still has to compile, build and pass its generated tests before the run is accepted.Shahid, published 2026-08-20
Custom Handlers for Entities in SAP CAPCustom Handlers for Entities in SAP CAPWritten from the moment of not knowing: a two-level composition with drafts, the Fiori elements UI working perfectly, and no idea which handlers are actually needed. What comes out is the action lifecycle laid out as a reference — NEW, EDIT, PATCH and the rest — with a matrix saying which handler fires for which, which is the thing the documentation leaves you to assemble.xavisanse, published 2026-02-20
Reading Between the Lines: Under-Documented Fiori Elements Capabilities in SAPUI5 1.149Reading Between the Lines: Under-Documented Fiori Elements Capabilities in SAPUI5 1.149Reads SAPUI5 1.149's framework source, not its release notes, to show Fiori Elements shifting side-effect refresh, AI field placeholders and multi-user drafting from controller extensions into what the backing service annotates. Event-driven SideEffects push over a WebSocket channel through @cap-js-community/websocket, while Draft handling gains ABAP RAP's live field locking on CAP Node.js through Sören Leibach's own cap-collaborative-draft plugin. Both rest on Fiori annotations such as Common.SideEffects and CollaborativeDraft.enabled, which the frontend reads rather than requiring a manifest flag.published 2026-07-09
What's new with draft handling in RAP?What's new with draft handling in RAP?An ABAP-day session at Devtoberfest 2026 on two additions to draft handling in RAP: collaborative draft, where two users work on the same draft instance and a field is locked only while the other is in it, and draft scope, where editing an instance of one draft-enabled business object puts the related instances of a dependent one into draft as well. Andre Fischer shows what each costs in the behaviour definition and projection, the draft query view and its DCL that collaborative draft needs over a table-based business object, and the CDS table entities that remove both the draft query view and the persistence table, with their current restrictions in ABAP analytics and extensibility; the from-scratch generator in ADT grows a checkbox for them. Both demos run against the DMO flight scenario of SAP-samples/abap-platform-refscen-flight, and the last part hides the draft-related features of an OData V4 app in its manifest, which the session gives as the reason a simple create-update-delete app no longer needs a V2 service binding.published 2026-09-21
052: 10 Minutes from Start to Launchpad052: 10 Minutes from Start to LaunchpadWalks a RAP application from a root CDS view entity through a consumption projection and its associations to a metadata extension: a facet per field group, a hidden field via UI.hidden, and a selection field on the ABAP package, all in a Customer-layer DDLX source read by the generated Fiori elements app. It then covers the parts ABAP CDS modelling and annotation stop short of — service definition and binding, generating the UI in Business Application Studio, and wiring the deployed app into the Fiori Launchpad through an IAM App and business catalog.Björn S., published 2026-09-07
A Guide to CDS Metadata Extensions, Fiori App Generation and SAP UI5 Controller ExtensionsA Guide to CDS Metadata Extensions, Fiori App Generation and SAP UI5 Controller ExtensionsWalks through a RAP-based Fiori elements app end to end: layering UI annotations onto a CDS view through a separate ABAP metadata extension object, gated by @Metadata.allowExtensions on the base view and ordered across extensions by a required @Metadata.layer value. Generates the app in SAP Business Application Studio from the published OData V4 service's merged $metadata document, then adds an SAP UI5 controller extension — registered in manifest.json against a Fiori elements lifecycle hook — only for behaviour the annotations cannot express.ankitapaul229, published 2026-07-27
Build BTP CAP App with Fiori Integration – Part 2: Implementing End to End AppBuild BTP CAP App with Fiori Integration – Part 2: Implementing End to End AppThe implementation half of the series whose first part set up the account and the database: the application itself, end to end.SuryaRamesh, published 2026-04-09
CAP Foundry: Engineering SAP CAP Applications from Business Intent with Guardrailed AICAP Foundry: Engineering SAP CAP Applications from Business Intent with Guardrailed AICAP Foundry is a prototype that generates a CAP Node.js project with SAP Fiori elements from a written business requirement, discovering the actual data shape from a chosen source — SQLite, a configured SAP HANA HDI container, offline EDMX, live OData through the SAP Destination service, or approved SAP BTP ABAP objects — instead of inventing one. The generated application can carry a Fiori draft lifecycle with optimistic concurrency via ETags and annotation-driven Fiori elements list and object screens, localized independently of the underlying service contract. Attachments can be added with upload, download and delete, gated on a malware-scan status, and the generated project still has to compile, build and pass its generated tests before the run is accepted.Shahid, published 2026-08-20
CAP in the age of AI #6 - vector embeddingsCAP in the age of AI #6 - vector embeddingsVector embeddings put to work in the incident management sample, answering whether this problem has been seen before. An embedding element of type Vector is calculated and stored from the vector_embedding function, so the database refreshes it whenever the text behind it changes, and cosine_similarity compares it with a freshly embedded string; because a title says little, a scheduled action first summarises each incident's conversation through a model on SAP AI Core and the embedding is taken from that summary. The similar-incidents list is a view joining incidents to themselves, with order and limit set in a before handler on the expanded query, and the vector element excluded from the service, since OData knows nothing about vectors — on SAP HANA Cloud the function is native, while SQLite needs packages added to the project.published 2026-10-09
Creating Material Master Data in SAP S/4HANA Using RAP and EML .Creating Material Master Data in SAP S/4HANA Using RAP and EML .Builds an unmanaged Transactional model RAP business object for Article (Material) master data on top of the standard interface views I_Product, I_ProductDescription and I_ProductPlant, replacing BAPI_MATERIAL_SAVEDATA with EML operations in the create, update and custom extendplant behaviour methods. A CDS metadata extension adds the Fiori annotations — headerInfo, facets, line items and value helps — that drive the generated Fiori elements UI.Sudhanshu07, published 2026-01-08
Deep Insert in SAP CAPM Using Composition and Fiori ElementsDeep Insert in SAP CAPM Using Composition and Fiori ElementsParent and children created in one transaction, which composition already gives you in the model — the post is about what Fiori elements does with it, and what the payload looks like when the UI sends both at once.published 2026-05-22
Dynamic Criticality in SAP CAP Using Fiori Elements and Node.jsDynamic Criticality in SAP CAP Using Fiori Elements and Node.jsColouring rows by status, which sounds like a UI question and is not: criticality is a value the service has to compute and expose, so the work is a virtual element in CDS and the annotation that points at it. Comes from a real requirement — business users wanting to spot the records that need attention.Pranesh_SD, published 2026-06-05
From SEGW and Legacy UI5 to RAP with ARC-1From SEGW and Legacy UI5 to RAP with ARC-1Three ARC-1 skills, run in Cursor with Composer-2 against a deliberately rough demo on an S/4HANA 2023 trial system, turn the SEGW service ZDEMO_MIG_PROJECTS_SRV into a managed, draft-enabled RAP business object published as OData V4, replace its ApproveProject function import and its direct UPDATE ... COMMIT WORK with the action approve_project written in EML in local mode, and rebuild the freestyle UI5 JavaScript app once in UI5 TypeScript and once as a Fiori elements list report and object page driven by metadata extensions. What the published transcripts add is how the agent got there: it found the generated MPC class names and the custom logic in DPC_EXT only by reading the system, the skills made it print the extracted model and stop for confirmation before writing, and @ui5/mcp-server, mcp-sap-docs and @sap-ux/fiori-mcp-server each had their own job beside it. The demo is small on purpose, and the post says a productive SEGW service that calls BAPIs, carries custom authorisation logic or supports deep inserts is not solved with one prompt.published 2026-05-11
From SEGW and Legacy UI5 to RAP with ARC-1
@sap-ux/fiori-mcp-server has been through 2 major lines since this was published: 0.7 (2026-05), 1 (2026-05). Affects Runnable code.
Fullstack CAP Application with HANA Cloud (Decoupled Architecture) [Part-2]Fullstack CAP Application with HANA Cloud (Decoupled Architecture) [Part-2]Part 1 left a working OData service whose Fiori preview showed nothing useful. This is the annotations that fix that — the UI vocabulary added to the CDS model until the generated list report has columns worth reading.sanjucs, published 2026-05-07
Introducing the Cloud Application Programming Model (CAP)Introducing the Cloud Application Programming Model (CAP)SAP's own general-availability announcement for CAP, laid out as a Golden Path: a data model and service defined in CDS gets a generated service provider that serves metadata publishing and CRUD requests, fills in primary keys and audit data, and writes trace and audit logs without application code. The same CDS model carries annotations that translate to OData vocabularies and generate a Fiori elements app skeleton, which is how Fiori annotations work in CAP.Daniel7, published 2018-06-05
On‑the‑Fly Excel Download in a RAP Fiori App — No Database Table, No Persistence, Pure CDS + ABAPOn‑the‑Fly Excel Download in a RAP Fiori App — No Database Table, No Persistence, Pure CDS + ABAPBuilds a CDS custom entity backed by an ABAP class that implements IF_RAP_QUERY_PROVIDER and assembles an XLSX workbook at request time — hand-built from Open XML parts with cl_abap_zip for multiple sheets, or in one line via cl_salv_table=>to_xml for one — then streams it to the browser through the @Semantics.largeObject annotation. The same annotation makes Fiori annotations render the field as a download link with no backing database table, trading the usual persisted-blob approach to document output for a file rebuilt fresh on every click.hemanthmj, published 2026-06-18
RAP - Navigation (App to App)RAP - Navigation (App to App)Walks through app-to-app navigation from a RAP list report and object page: the @Consumption.semanticObject annotation and its semanticObjectMapping.element and additionalBinding variants for links, against the inline @UI.lineItem WITH_INTENT_BASED_NAVIGATION and @UI.identification FOR_INTENT_BASED_NAVIGATION for buttons. Each variant is added through a CDS metadata extension and traced into the target app, showing which fields end up in the filter and how the two annotation styles differ in the list report's formatting. Annotation-driven navigation on a RAP service is part of what Fiori annotations covers on the ABAP door: CDS annotations, carried in a metadata extension, driving the Fiori elements UI.Björn S., published 2026-09-01
Reading Between the Lines: Under-Documented Fiori Elements Capabilities in SAPUI5 1.149Reading Between the Lines: Under-Documented Fiori Elements Capabilities in SAPUI5 1.149Reads SAPUI5 1.149's framework source, not its release notes, to show Fiori Elements shifting side-effect refresh, AI field placeholders and multi-user drafting from controller extensions into what the backing service annotates. Event-driven SideEffects push over a WebSocket channel through @cap-js-community/websocket, while Draft handling gains ABAP RAP's live field locking on CAP Node.js through Sören Leibach's own cap-collaborative-draft plugin. Both rest on Fiori annotations such as Common.SideEffects and CollaborativeDraft.enabled, which the frontend reads rather than requiring a manifest flag.published 2026-07-09
XML Annotations: The Essentials Before Adapting Documentation Samples to Your ProjectXML Annotations: The Essentials Before Adapting Documentation Samples to Your ProjectWhat to understand before copying an annotation out of the UI5 Demo Kit, which is what everybody actually does. The samples assume context the sample does not carry, and adapting one without that context is where the afternoon goes.MioYasutake, published 2026-04-09
From Inbox to Quotation: An AI-Assisted Sales Workbench in React on SAP CAPFrom Inbox to Quotation: An AI-Assisted Sales Workbench in React on SAP CAPA Devtoberfest 2026 session walking live through a sales workbench that turns an incoming customer e-mail into a quotation in S/4HANA, built as a React UI on CAP. It shows the filterable request inbox, the extracted configuration properties with a confidence indicator per characteristic, the variant configurator rendered in React from a JSON schema the configuration service returns, and the link from a derived value back to the place in the e-mail it was read from; the stated reason for the stack is that CAP keeps authentication, destinations and deployment the same in every project, which is where frontend boundary holds. The inbox grows while a user works because a CAP WebSocket plugin pushes new requests into the list — WebSocket.SAP Developers, published 2026-10-09
Agentic UI Extensibility: The Next Chapter of SAPUI5 FlexibilityAgentic UI Extensibility: The Next Chapter of SAPUI5 FlexibilityA Devtoberfest 2026 session on SAPUI5 flexibility: a recap of key-user adaptation as deltas that survive an upgrade, then a lab preview in which Joule works through a pasted list of adaptation requests inside the key-user tooling — moving a section, adding one through embedded content, saving and activating a version — and writes a handover prompt when a request is outside what a key user may change. The developer half pastes that prompt into VS Code, where a coding agent generates an adaptation project through MCP tools, picks up the key-user changes already made, reads the base application's metadata and the UI5 documentation, writes the XML fragments and controller extensions for a new table column and a supplier dialogue, and restarts the editor to verify both appear. The agentic parts are unreleased; what the session shows as already available is the adaptation project for Cloud Foundry in VS Code, role-specific adaptation on Cloud Foundry from SAPUI5 1.146, views in variant management loaded when the manage-views dialogue opens rather than at startup, and the redesigned key-user adaptation mode with its change highlighting and version dialogue.SAP Developers, published 2026-10-16
Establish a central entry point with SAP Build Work ZoneEstablish a central entry point with SAP Build Work ZoneSAP's reference architecture for a business site in SAP Build Work Zone, standard edition or SAP Build Work Zone, advanced edition as one entry point to business applications, processes, information and communication, on the web or in the Joule Work mobile app. Three of its eight flow steps are how content gets in, the ground launchpad and site content covers: custom apps through the channel to the subaccount's SAP HTML5 Application Repository service for SAP BTP, other content through content providers that expose it over APIs from cloud or on-premise systems and content packages uploaded as files, and SAP Cloud Transport Management or manual export and import to move it between environments. Users and role assignments come from Cloud Identity Services, and the components inside the subscription, among them Notifications, SAP Mobile Services and UI Theme Designer, cannot be decoupled from the product, so a custom mobile app needs its own SAP Mobile Services subscription.published 2026-05-22
How to Deploy a Custom Fiori App to S/4HANA Public Cloud and Add a Tile in SAP Build Work ZoneHow to Deploy a Custom Fiori App to S/4HANA Public Cloud and Add a Tile in SAP Build Work ZoneA step-by-step walkthrough of taking a RAP-based Fiori app from SAP Business Application Studio deployment to a working tile in SAP Build Work Zone, standard edition on SAP S/4HANA Cloud Public Edition: the crossNavigation/inbounds block in manifest.json that creates the Launchpad App Descriptor Item, the IAM App that links it to a Business Catalog and Business Role, and the semantic-object-and-action intent Work Zone resolves against. SSO between BTP and S/4 works because both trust the same Cloud Identity Services tenant.sushweta_bhattacharya, published 2026-05-28
Understanding and Developing Fiori Plugins with Extension API & TypeScriptUnderstanding and Developing Fiori Plugins with Extension API & TypeScriptDescribes a launchpad plugin as a UI5 component without views that the shell loads for every app, SAPUI5 only, and compares extending the shell through the renderer with the Extension service from 1.120 and FrameBoundExtension from 1.124, down to the placement options each allows. It builds fiori-fullscreen-plugin as the sample, and ends with activation: globally through /UI2/FLP_CONF_DEF and /UI2/FLP_CUS_CONF or per role through a Shell-plugin target mapping on an ABAP launchpad, and as an HTML5 app assigned to a role in SAP Build Work Zone.published 2026-06-15
New POD 2.0 Framework: The New Generation of SAP Digital Manufacturing Worker UIsNew POD 2.0 Framework: The New Generation of SAP Digital Manufacturing Worker UIsThe opening post of SAP's sixteen-part series on POD 2.0, the UI framework inside SAP Digital Manufacturing for building worker-facing execution screens: it replaces the architectural foundation of the existing POD model, drops the fixed POD types such as Work Center and Order in favour of POD templates, and exposes contextual execution data directly to the UI layer. The edge to POD plugins holds on what it states about plugins themselves: the large monolithic plugins of the old framework have been broken into smaller, focused components, and layout, dialogs, buttons and actions that previously required UI extensions or custom plugins are configured in a WYSIWYG designer instead. It stops at the direction, with no code, no API and no packaging steps: new execution features will target the new framework and the legacy POD architecture will gradually phase out, while the designer, custom dialogs, dynamic PODs and notifications are left to the fifteen later posts the series list names.ManoelCosta, published 2026-02-10
Creating a Custom F4 Help for Currency Fields in ABAP Using F4IF_INT_TABLE_VALUE_REQUESTCreating a Custom F4 Help for Currency Fields in ABAP Using F4IF_INT_TABLE_VALUE_REQUESTWalks through building a custom F4 help popup for a currency selection-screen field: an AT SELECTION-SCREEN ON VALUE-REQUEST handler reads currency codes and texts from TCURC and TCURT into an internal table, then passes it to F4IF_INT_TABLE_VALUE_REQUEST to render the popup list. It is offered as a replacement for the field's standard search help when that does not fit the business requirement.vinodkumarreddyappannagari, published 2026-06-03
Building Agentic Workflows with n8n in Joule StudioBuilding Agentic Workflows with n8n in Joule StudioA Devtoberfest 2026 session, JS-31, on SAP-managed n8n inside Joule Studio, shown as a labs preview on a blocked-invoice scenario: a solution made of assets, an intent refined by the web agent into requirements and then a specification, and the generated workflow opened in the n8n editor that Joule Studio connects to its own n8n tenant, with the generated files committed through GitHub. The nodes carry the other edges — the human-in-the-loop node is built on SAP Task Center, and SAP AI Core is where model providers are configured centrally instead of per developer. It ends in Joule chat, where the approval task the workflow created is listed, opened and completed.SAP Developers, published 2026-10-08
Enhancing Standard CDS Views in FIORI My InboxEnhancing Standard CDS Views in FIORI My InboxExtends the standard CDS view C_PurchaseOrderFs consumed by the Fiori My Inbox purchase-order approval screen, adding requester, buyer-note, supplier-note and approver fields as virtual elements resolved by an ABAP class implementing IF_SADL_EXIT_CALC_ELEMENT_READ, then reloading the OData metadata through transaction /IWFND/MAINT_SERVICE. The result is a My Inbox task screen carrying approval context that was not visible on the standard screen before.gsureshkumar, published 2026-03-02
SAP MDG Cloud Ready Mode: 5 Solution Patterns, Zero BADIs: How We implemented 5 typical requirementsSAP MDG Cloud Ready Mode: 5 Solution Patterns, Zero BADIs: How We implemented 5 typical requirementsA field report from an 80%-complete SAP MDG-BP Cloud Ready Mode implementation, showing five requirements it met without BAdIs or modification: business-partner context and the MDG UI shown inside the My Inbox app, rule-based multi-step approval routing with exclusive-choice nodes, agent determination through BTP role collections, and role-specific Fiori App Variants that give Finance Experts only bank-detail fields while Approvers get full write access. Each pattern works the same way underneath — a BTP Workflow service task reads business-partner attributes over OData into the workflow context, and a user task, route or app variant reacts to it — built with key-user extensibility or SAP Business Application Studio rather than custom ABAP.steffen_ulmer, published 2026-06-01
Bringing SAP themes to any web app with coding agentsBringing SAP themes to any web app with coding agentsA Devtoberfest 2026 session from SAP's UI theme designer team, in two halves. The first is how an SAP theme is built: seven reference tokens, the main tokens that carry the semantics, component tokens such as the emphasized button background, and derived tokens for states like hover — the inheritance chain that makes theming hard to follow by eye, and the reason a custom theme always derives from an SAP base theme. The second installs SAP/ui-theme-designer-plugins-for-coding-agents in Claude Code and has it apply SAP design tokens to a login screen built with a non-SAP component library, then make the page themeable from a theme root and a theme URL parameter; the design-tokens skill npm-installs the theming content to read current parameter values, and the help skill fetches the UI theme designer help pages at query time. The presenters state the skills are not limited to SAPUI5 and run in any coding agent that reads skills.SAP Developers, published 2026-09-25