plugins-coding-agents

UI5 MDC (Model-Driven Controls) best practices and authoritative development guidelines for OData V4 delegate-based controls. Use when the user asks to "create an MDC FilterBar", "implement MDC Chart", "add MDC Field", "use MDC FilterField", "implement ValueHelp", "add MDC Link", "MDC MultiValueField", "sap.ui.mdc", "delegate pattern", "fetchProperties", "OData V4 freestyle controls", "MDC personalization", "p13nMode", "PropertyInfo", "MDC delegate", "FilterBarDelegate", "ChartDelegate", "ValueHelpDelegate", "LinkDelegate", "MDC field not rendering", "MDC chart not binding", "MDC conditions", "Condition.createCondition", "MDC Table delegate", or is writing any UI5 freestyle application using OData V4 with model-driven controls from sap.ui.mdc. Covers: delegate pattern, PropertyInfo structure, mandatory rules, common error patterns, and per-control API reference for FilterBar, Chart, Field, FilterField, ValueHelp, Link, and MultiValueField. Keywords: sap.ui.mdc, MDC, FilterBar, Chart, Field, FilterField, Valu

UI5 smart controls best practices and authoritative development guidelines for OData V2 annotation-driven controls. Use when the user asks to "create a SmartField", "add a SmartForm", "implement SmartFilterBar", "create SmartChart", "add SmartLink navigation", "use SmartMultiInput", "smart control annotations", "OData V2 metadata-driven controls", "sap.ui.comp", "field control annotation", "value help annotations", "ValueList annotation", "smart form layout", "smart filter bar configuration", "chart annotations", "semantic object navigation", "smart link popover", "SmartField edit mode", "SmartField display mode", "SmartFilterBar liveMode", "SmartChart drill-down", "SmartMultiInput tokens", "SmartTable configuration", or is writing any UI5 freestyle application using OData V2 annotation-driven controls from sap.ui.comp. Covers: control selection, mandatory rules, common error patterns, annotation guidance, and per-control API reference for SmartField, SmartForm, SmartFilterBar, SmartChart, SmartLink, and Smar

This skill should be used when the user asks to audit, fix, check, review, or improve accessibility, a11y, ARIA, WCAG compliance, landmarks, labeling, heading levels, focus handling, keyboard navigation, keyboard shortcuts, screen reader support, invisible messaging, reading order, or touch / target size in UI5 application files (views, fragments, controllers). Also use when the user creates a new UI5 view, fragment, or controller and wants it to be accessible, or asks whether a specific control (Dialog, Table, Panel, etc.) meets accessibility requirements. Keywords: accessibility, a11y, ARIA, WCAG, screen reader, NVDA, JAWS, VoiceOver, landmark, landmarkInfo, accessibleRole, ariaLabelledBy, ariaDescribedBy, labelFor, tooltip, alt text, decorative, heading level, initialFocus, F6, fast nav, fastnavgroup, tabindex, CommandExecution, keyboard shortcut, InvisibleMessage, announce, reading order, reactiveAreaMode, target size.

Fix Control renderer issues that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs these rules: - `no-deprecated-control-renderer-declaration` - For missing renderer declaration, string-based renderer declaration, implicit renderer auto-discovery (removed in modern UI5) - `no-deprecated-api` - For missing apiVersion:2 in renderer objects, missing IconPool import when using oRm.icon(), deprecated rerender() override. NOTE: For Library.init() apiVersion errors, use fix-library-init instead. - `ui5-class-declaration` - For non-static renderer property in ES6 classes Trigger on: "missing a renderer declaration", "Deprecated declaration of renderer", "deprecated renderer", "apiVersion" (in renderer context), "IconPool", "rerender", "renderer must be a static property" Converts legacy renderer patterns to modern apiVersion: 2 format with proper module imports.

Fix JavaScript `no-globals` errors that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs: - `no-globals` rule with message "Access of global variable '...' (...)" in JS files Cases handled (linter CANNOT auto-fix): - Assignments to global namespaces: `sap.myNamespace = {...}` - Global namespace assignment/read inside sap.ui.define - Delete expressions: `delete sap.something` - sap.ui.core.Core direct access (class vs singleton) - jQuery/$ globals: add `sap/ui/thirdparty/jquery` — do NOT replace jQuery API calls - jQuery.sap.* utilities: replace with dedicated modules - Conditional/probing access: `if (sap.ui.something)` - Custom namespace definitions that aren't UI5 modules - sap.ui.controller() factory → Controller.extend (NOT Fiori Elements extensions) - jQuery.sap.declare/require: legacy modules without sap.ui.define Trigger when: "fix no-globals", "global variable error", "sap.ui.getCore", "jQuery.sap" Converts global namespace access to proper sap.ui.define module imports.

Fix runtime-breaking patterns in JS files that the UI5 linter does NOT report. Use this skill when: - Tests fail after modernization with "ReferenceError", "TypeError: Cannot read properties of undefined", or "X is not defined" - The linter shows zero remaining errors but tests still crash at runtime - Phase 3, Step 3.2 of the modernize-ui5-app workflow (runs after the parallel globals batch, before fix-cyclic-deps) - User mentions "runtime errors after modernization", "test failures after modernization", "global namespace still used" - After running fix-js-globals and fix-cyclic-deps, but tests STILL fail - User sees "X is not a constructor" or module loading errors in test output The linter only checks sap.* globals in JS. App-specific namespace patterns (e.g., com.example.app.utils.Module) are invisible to it. This skill detects and fixes those across ALL JS files — app source AND test. NOTE: App-namespace globals in XML files are handled by `fix-xml-globals` — NOT by this skill.

Fix XML view/fragment issues that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs these rules: - `no-globals` - For ALL global variable access in XML views — sap.*, jQuery.*, AND app-namespace globals (e.g., com.example.app.utils.Handler.onPress, my.app.formatter.method) - `no-ambiguous-event-handler` - For event handlers without dot prefix or local name - `no-deprecated-api` - For legacy template:require syntax (space-separated) Trigger on XML view/fragment files with errors about global variables, event handlers, formatters, type references in bindings, factory functions, or template:require. Automatically adds core:require declarations, fixes event handler prefixes, and handles .bind($control) for functions that use 'this'. IMPORTANT: The linter reports app-namespace globals in XML under `no-globals` — these MUST be fixed by this skill, NOT deferred to fix-linter-blind-spots. For native HTML or SVG in XML views, use the fix-xml-native-html skill instead.

Use when migrating UI5 apps from legacy FLP sandbox to the new sandbox (New Sandbox). Triggers on /modernize-flp-sandbox, mentions of "flpSandbox.html", "sap-ushell-config", or requests to update sandbox configuration.

Modernize QUnit unit tests and OPA5 integration tests to the UI5 Test Starter concept. Use this skill when: - The linter reports `prefer-test-starter` for *.qunit.html or *.qunit.js files - Test HTML files use manual sap-ui-core.js bootstrapping instead of Test Starter's runTest.js/createSuite.js - Test JS files use Core.ready(), Core.attachInit(), or jsUnitTestSuite instead of sap.ui.define - OPA test HTML files exist with per-test Opa5.extendConfig and manual bootstrapping - An AllJourneys.js orchestrator loads OPA journeys dynamically - OPA journeys call `iStartMyUIComponent` instead of `iStartMyAppInAFrame` - User asks to modernize tests, modernize test infrastructure, or adopt Test Starter Handles unit tests (Core.ready removal, sap.ui.define wrapping) and OPA challenges (page-object imports, Opa5 config, journey orchestration, QUnit 1.x assert modernization, in-window-to-iframe launcher migration). Trigger on: prefer-test-starter warnings, test modernization requests, iStartMyUIComponent.

UI5 table best practices and authoritative development guidelines. Use when the user asks to "create a table", "add a table", "which table should I use", "implement sap.m.Table", "implement sap.ui.table", "GridTable", "ResponsiveTable", "TreeTable", "SmartTable", "MDC table", "sap.ui.mdc.Table", "sap.ui.comp.smarttable", "table not showing data", "table binding", "table selection", "drag and drop table", "table personalization", "copy paste table", "table export", "table sticky header", "table growing", "table pop-in", "table performance", "table accessibility", "table items binding", or is writing any UI5 freestyle application that includes a table control. Covers: control selection matrix, mandatory rules, common error patterns, and per-control API guidance for sap.m.Table, sap.ui.table.Table, sap.ui.table.TreeTable, sap.ui.comp.smarttable.SmartTable, and sap.ui.mdc.Table. Keywords: sap.m.Table, sap.ui.table, GridTable, ResponsiveTable, TreeTable, SmartTable, sap.ui.mdc.Table, table binding, rows aggregati

Fix HTML bootstrap parameter issues that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs these rules: - `no-deprecated-api` - For missing/deprecated bootstrap parameters (async, compat-version, animation, binding-syntax, etc.) - `no-deprecated-theme` - For deprecated theme values in data-sap-ui-theme - `no-deprecated-library` - For deprecated libraries in data-sap-ui-libs Trigger on error messages containing: "Missing bootstrap parameter", "Abandoned bootstrap parameter", "Redundant bootstrap parameter", "deprecated value", "bootstrap" Automatically applies safe fixes to HTML files containing UI5 bootstrap script tags.

Fix Component.js async configuration issues that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs these rules: - `async-component-flags` - For missing IAsyncContentCreation interface, missing manifest declaration, redundant async flags, async:false errors - `no-removed-manifest-property` - For async flags in inline manifest v2 Trigger on Component.js files with errors about async loading, IAsyncContentCreation, manifest declaration. Automatically adds the IAsyncContentCreation interface and configures manifest properly.

Fix Content Security Policy (CSP) compliance issues that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs: - `csp-unsafe-inline-script` with message "Use of unsafe inline script" Trigger on: inline JavaScript in HTML files, script tags without src attribute, onclick/onload handlers in HTML. Also use when user mentions 'security headers', 'inline script warning', 'CSP policy', 'unsafe-inline', or 'Content-Security-Policy'. Provides guidance on moving inline scripts to external files for CSP compliance.

Detect and resolve cyclic module dependencies introduced during UI5 modernization. Trigger when user mentions: "cyclic dependency", "circular import", "undefined module at runtime", "lazy require", "sap.ui.require sync", "import cycle", or when a module returns undefined despite a correct import path. Classic symptom: a module is `undefined` at runtime despite a correct sap.ui.define import path. Auto-fixes 2-node cycles (A↔B) by converting the lesser-used edge to lazy sap.ui.require(). Auto-fixes longer chains (3+ nodes) via hub-based approach. Reports unfixable chains to MODERNIZATION-ISSUES.md. Runs as Phase 3, Step 3.3 (final step) after all other Phase 3 steps.

Fix deprecated control/class/interface/type issues that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs: - `no-deprecated-api` with messages about deprecated class, interface, type, property, or property of class - Messages like "Use of deprecated class '...'", "Use of deprecated interface '...'", "Use of deprecated property '...'" Trigger on: deprecated control usage in JS `new` expressions, deprecated properties in constructor settings, deprecated interfaces/types in metadata, deprecated controls/properties in XML views, sap.m.MessagePage modernization to IllustratedMessage. Use this skill whenever you see 'deprecated class', 'deprecated property', 'deprecated interface', or 'deprecated type' in linter output, even if the user doesn't explicitly mention deprecation. Provides replacement guidance for deprecated UI5 controls and their properties.

Handle Fiori Elements V2 controller extensions during UI5 modernization. Use this skill when: - Extension controllers use `sap.ui.controller()` AND the manifest has a matching `controllerName` entry (Case B → report only, do not modernize) - Extension controllers use `Controller.extend()` with manifest `controllerName` registration (Case B → report only, do not modernize) - Code contains `registerControllerExtensions` calls (Case A → ControllerExtension.extend + override) - Manifest.json has `sap.ui5/extends/extensions/sap.ui.controllerExtensions` with `controllerName` entries Case B (plain object) is by far the most common. For Case B, do NOT modify controller files — report them and move on. Case A requires actual code modernization. For plain controller definitions in custom (non-Fiori-Elements) apps where `sap.ui.controller()` is just defining a standalone controller, use `fix-js-globals` (Case 9) instead.

Fix Library.init() apiVersion issues and modernize enums to DataType.registerEnum. Use this skill when linter outputs: - `no-deprecated-api` with message "Deprecated call to ... Use the {apiVersion: 2} parameter instead" Trigger on library.js files with errors about: "Deprecated call to", "Lib.init", "Library.init", "{apiVersion: 2} parameter" Adds apiVersion: 2 to Library.init() calls and modernizes enum definitions to use DataType.registerEnum, which is required for type validation when using apiVersion: 2.

Fix manifest.json issues that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs these rules: - `no-outdated-manifest-version` - For _version not being 2.x - `no-legacy-ui5-version-in-manifest` - For minUI5Version below 1.136 - `no-deprecated-library` - For deprecated libraries in dependencies - `no-deprecated-component` - For deprecated components in dependencies - `no-deprecated-api` - For deprecated view types, resources/js, deprecated model types - `no-removed-manifest-property` - For async flags in manifest v2 Trigger on manifest.json files with errors about version, libraries, components, view types. Automatically updates manifest.json to be modern UI5 compatible.

Fix partially deprecated API usage that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs: - `no-deprecated-api` for Parameters.get, JSONModel.loadData, Mobile.init, ODataModel.v2.createEntry, View.create, Fragment.load, Router constructor - `unsupported-api-usage` for string formatter in JS bindings Trigger on: Parameters.get without object param, JSONModel.loadData with bAsync=false, Mobile.init with homeIcon, createEntry with batchGroupId, View.create/Fragment.load with non-XML type, Router without async:true, formatter as string in JS. Provides specific fix patterns for each partially deprecated API variant.

Fix pseudo module and implicit global issues that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs: - `no-pseudo-modules` with messages about deprecated enum or DataType pseudo module access - `no-implicit-globals` with messages about module not exported by library or OData globals Trigger on: direct enum imports (sap/ui/core/BarColor), direct DataType imports (sap/ui/core/CSSSize), library.EnumName access, odata.compare/fillUriTemplate/uriEncode in bindings. Provides guidance on proper module imports for enums, DataTypes, and OData expression addons.

Fix deprecated `sap.ui.table.Table` row properties that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs: - `no-deprecated-api` with messages about `visibleRowCountMode`, `visibleRowCount`, `rowHeight`, `fixedRowCount`, `fixedBottomRowCount`, or `minAutoRowCount` Trigger on: deprecated row-related properties on sap.ui.table.Table in JS or XML, modernization to rowMode aggregation. Converts deprecated flat properties to a structured `rowMode` aggregation using `sap.ui.table.rowmodes.Fixed`, `Interactive`, or `Auto`.

Fix native HTML and SVG usage in XML views/fragments that UI5 linter reports but cannot auto-fix. Use this skill when linter outputs: - `no-deprecated-api` with message "Usage of native HTML in XML Views/Fragments is deprecated" - `no-deprecated-api` with message "Deprecated use of SVG in XML View or Fragment" Trigger on: HTML elements in XML views (html:div, html:span, html:a), SVG elements in XML views, xmlns:html namespace usage. Provides guidance on replacing native HTML with UI5 controls and SVG with UI5 icons or custom controls.

End-to-end workflow for modernizing a UI5 application. Use this skill when: - User wants to modernize their UI5 app - User mentions "UI5 modernization", "modernize UI5 app", "upgrade UI5", "make app modern UI5 compatible" - User asks to "fix all linter errors", "run full modernization", "modernize my UI5 project" This skill runs the modernization in five phases with a verification gate after each phase. The user picks the verification mode once at the start (full autonomous / half autonomous / manual). The agent applies that mode at every gate without re-asking.

This skill should be used in any OPA5 task - creating, modifying, extending, debugging, fixing or reviewing an integration test. Use when the user asks to "write an OPA5 test", "add an OPA5 journey", "fix the OPA5 test failure" or mentions OPA5 or its components - opaTest, page object, journey, waitFor.

A skill for converting UI5 (SAPUI5/OpenUI5) projects to TypeScript.

MUST be loaded before any UI Integration Cards (also called UI5 Integration Cards) task — creating, modifying, validating, previewing, or reviewing a card, its `manifest.json`, its Configuration Editor (`dt/Configuration.js`), or any analytical chart configuration. Provides the official guidelines, validation rules, supported chart types, and Configuration Editor patterns.

UI5 development best practices and coding standards derived exclusively from official SAP UI5 guidelines. Use when writing UI5 applications to ensure modern, maintainable code following SAP standards. Covers: async module loading (sap.ui.define, ES6 imports, core:require), ComponentSupport initialization, data binding with OData types, i18n management, CSP compliance (no inline scripts), TypeScript event types (UI5 >= 1.115.0), MCP tooling (get_api_reference, run_ui5_linter), CAP integration patterns, and form creation rules (never SimpleForm, always Form with ColumnLayout). Keywords: ui5 coding standards, async loading, sap.ui.define, data binding, odata types, i18n translation, CSP no inline scripts, TypeScript event handlers, Button$PressEvent, ui5 linter, API reference, ComponentSupport, form layout, ColumnLayout, CAP integration, cds watch