SAPUI5 XML to Controller Jump

Navigate from an event-handler reference in a SAPUI5 / OpenUI5 XML view or fragment straight to the method that implements it in the associated controller — no more manual searching.

Features

• Ctrl/Cmd-click navigation. Hold Ctrl (Windows/Linux) or Cmd (macOS) and hover over an event-handler value such as press="onSave". The handler name is rendered as a clickable hyperlink; clicking it opens the controller and places the cursor on the method definition.
• Jump from controllerName. Ctrl/Cmd-hover the view's controllerName="my.app.controller.Main" and the entire value is underlined as one link — hover any segment (controller, Main, …) and click to open the controller and land on its class definition.
• Smart controller resolution. The controller is located from the view's controllerName attribute, matched against the project layout — both the common view/ ↔ controller/ sibling-folder layout and controllers co-located with the view are supported.
• JavaScript and TypeScript controllers. The method lookup understands classic object-literal handlers (onSave: function () {}), arrow handlers (onSave: () => {}), ES-class / shorthand methods (onSave() {}, public onSave(): void {}) and class-field arrows (onSave = () => {}).
• Handles the common syntaxes for handler values: a bare name (onSave), a leading-dot name (.onSave) and names with argument lists (onSave($event)).
• Graceful when nothing matches. If the referenced method does not exist, no hyperlink is shown — non-handler attributes such as type="Emphasized" are never turned into (broken) links.

The clickable-link UX is provided through VS Code's standard DefinitionProvider mechanism, which is exactly what renders the Ctrl/Cmd-hover underline and enables "Go to Definition" (F12) and "Peek Definition" on the handler.

Usage

1. Open any SAPUI5 XML view (*.view.xml) or fragment (*.fragment.xml).
2. Hold Ctrl/Cmd and hover over an event-handler value (e.g. press="onSave").
3. Click, or press F12, to jump to the method in the controller.

Try it with the sample app

A ready-to-open example lives in sample/ — a small app with both a JavaScript and a TypeScript controller. Press F5 to launch the Extension Development Host, open the sample/ folder in it, then open sample/webapp/view/Main.view.xml and Ctrl/Cmd-click a handler such as press="onSayHello". See sample/README.md for details.

Requirements

The view must declare its controller via the controllerName attribute, and the controller file (*.controller.js or *.controller.ts) must be present in the workspace.

Known Issues

• Fragments (*.fragment.xml) have no controllerName of their own; a fragment is bound to its host view's controller at runtime, which cannot be determined statically. As a best effort, a controller co-located with (or named after) the fragment is attempted.
• Method signatures that span multiple lines are matched on their opening line only.

Development

This project uses Bun exclusively for dependency management and script execution.

bun install            # install dependencies
bun run check-types    # type-check
bun run lint           # lint
bun run test           # compile + run the VS Code integration/unit tests

Press F5 in VS Code to launch an Extension Development Host with the extension loaded.

Continuous integration (type-check, lint, bun audit, and headless tests) runs via GitHub Actions — see .github/workflows/ci.yml.

Release Notes

See CHANGELOG.md.