ui5-best-practices-mdc
UI5/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-best-practices-smart-controls
UI5/plugins-coding-agents
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
ui5-best-practices-accessibility
UI5/plugins-coding-agents
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
UI5/plugins-coding-agents
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-linter-blind-spots
UI5/plugins-coding-agents
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.
