mcpField
F
fix-bootstrap-params

fix-bootstrap-params

github.com/ui5Development44146 installsUpdated 1w ago
Repository

About fix-bootstrap-params

A skill for correcting UI5 HTML bootstrap parameters flagged by the linter, intended for developers maintaining UI5 applications. It limits edits to the bootstrap script tag and covers deprecated parameters, themes, and libraries.

Key features

  1. 01Adds or updates bootstrap parameters
  2. 02Removes obsolete or redundant parameters
  3. 03Updates deprecated themes and libraries
  4. 04Preserves non-bootstrap script tags

Use cases

  1. 01Fixing missing async or compatibility parameters
  2. 02Updating a deprecated UI5 theme
  3. 03Removing deprecated library references

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/ui5/plugins-coding-agents --skill fix-bootstrap-params

After installing, type/fix-bootstrap-paramsin Claude Code to confirm it loaded.

Details

From the project README

Fix Bootstrap Parameters

Key Rules

  1. ONLY modify the bootstrap <script> tag (identified by id="sap-ui-bootstrap" or src matching sap-ui-core.js). All other <script> tags — including inline scripts, config blocks, and non-UI5 script references — MUST be preserved exactly as-is. They will be handled by fix-csp-compliance in a later phase.
  2. Do not delete, move, or rewrite any <script> block that is not the bootstrap tag. If the file has <script>window.config = {...}</script> before or after the bootstrap tag, leave it untouched.

This skill fixes HTML bootstrap parameter issues that the UI5 linter detects but cannot auto-fix because the changes may affect application behavior.

Linter Rules Handled

Rule IDMessage PatternThis Skill's Action
no-deprecated-apiMissing bootstrap parameter 'data-sap-ui-async'Add data-sap-ui-async="true"
no-deprecated-apiMissing bootstrap parameter 'data-sap-ui-compat-version'Add data-sap-ui-compat-version="edge"
no-deprecated-apiUse of deprecated value 'false' for bootstrap parameter 'data-sap-ui-async'Change to "true"
no-deprecated-apiUse of deprecated value '...' for bootstrap parameter 'data-sap-ui-compat-version'Change to "edge"
no-deprecated-apiAbandoned bootstrap parameter '...' should be removedRemove the parameter
no-deprecated-apiRedundant bootstrap parameter '...' should be removedRemove the parameter
no-deprecated-apiBootstrap parameter '...' should be replaced with '...'Replace with new parameter
no-deprecated-themeUse of deprecated theme '...'Change to sap_horizon
no-deprecated-libraryUse of deprecated library '...'Remove from libs

When to Use

Apply this skill when you see linter output like:

index.html:8:3 error Missing bootstrap parameter 'data-sap-ui-async'  no-deprecated-api
index.html:9:3 error Missing bootstrap parameter 'data-sap-ui-compat-version'  no-deprecated-api
index.html:12:3 error Abandoned bootstrap parameter 'data-sap-ui-no-duplicate-ids' should be removed  no-deprecated-api
index.html:15:3 error Use of deprecated theme 'sap_bluecrystal'  no-deprecated-theme

Fix Strategy

1. Locate the Bootstrap Script Tag

Find the <script> tag with either:

  • id="sap-ui-bootstrap"
  • src attribute matching pattern: sap-ui-core.js, sap-ui-custom.js, sap-ui-boot.js, etc.
2. Apply Fixes Based on Rule and Message
no-deprecated-api - Missing Parameters

Missing data-sap-ui-async: Add data-sap-ui-async="true" Missing data-sap-ui-compat-version: Add data-sap-ui-compat-version="edge"

<!-- Before -->
<script id="sap-ui-bootstrap"
    src="resources/sap-ui-core.js"
    data-sap-ui-theme="sap_horizon">
</script>

<!-- After -->
<script id="sap-ui-bootstrap"
    src="resources/sap-ui-core.js"
    data-sap-ui-async="true"
    data-sap-ui-compat-version="edge"
    data-sap-ui-theme="sap_horizon">
</script>
no-deprecated-api - Deprecated Values

data-sap-ui-async="false": Change to "true" data-sap-ui-compat-version with non-edge value: Change to "edge"

no-deprecated-api - Abandoned Parameters (remove completely)

Remove these parameters entirely:

  • data-sap-ui-no-duplicate-ids - Enforced in modern UI5
  • data-sap-ui-auto-aria-body-role - Removed in modern UI5
  • data-sap-ui-manifest-first - Use Component.create manifest option instead
  • data-sap-ui-origin-info - No longer supported
  • data-sap-ui-areas - Use Control.placeAt instead
  • data-sap-ui-trace - No longer supported
  • data-sap-ui-xx-no-less - No longer supported
no-deprecated-api - Redundant Parameters
  • data-sap-ui-binding-syntax="simple" - Remove; complex syntax is enforced in modern UI5
  • data-sap-ui-binding-syntax="complex" - Remove if compat-version="edge" is set
  • data-sap-ui-preload with invalid values - Remove
no-deprecated-api - Replaced Parameters
  • data-sap-ui-animation → data-sap-ui-animation-mode (convert true→full, false→minimal)
no-deprecated-theme - Deprecated Themes

Replace with modern theme:

  • sap_bluecrystal → sap_horizon
  • sap_belize → sap_horizon
  • sap_belize_plus → sap_horizon
  • sap_belize_hcb → sap_horizon_hcb
  • sap_belize_hcw → sap_horizon_hcw
  • sap_hcb → sap_horizon_hcb
  • sap_ux → sap_horizon
  • sap_platinum → sap_horizon
  • sap_goldreflection → sap_horizon
no-deprecated-library - Deprecated Libraries

Remove deprecated libraries from data-sap-ui-libs:

  • sap.ui.commons
  • sap.ui.ux3
  • sap.makit
  • sap.me
  • sap.ca.ui
  • sap.sac.grid
  • sap.ui.suite
  • sap.zen.commons
  • sap.zen.crosstab
  • sap.zen.dsh

Implementation Steps

  1. Read the HTML file
  2. Parse to find the bootstrap script tag
  3. For each linter error (identified by rule ID and message):
    • If missing parameter: Add the parameter with recommended value
    • If deprecated value: Update to recommended value
    • If abandoned/redundant: Remove the parameter
    • If deprecated theme: Replace with modern theme
    • If deprecated library: Remove from libs list
  4. Preserve formatting (indentation, line breaks) as much as possible
  5. Write the updated file

Example Fix

Given linter output:

index.html:8:3 error Missing bootstrap parameter 'data-sap-ui-async'  no-deprecated-api
index.html:8:3 error Missing bootstrap parameter 'data-sap-ui-compat-version'  no-deprecated-api
index.html:12:3 error Abandoned bootstrap parameter 'data-sap-ui-no-duplicate-ids' should be removed  no-deprecated-api
index.html:10:3 error Use of deprecated theme 'sap_bluecrystal'  no-deprecated-theme

Transform:

<!-- Before -->
<script id="sap-ui-bootstrap"
    src="resources/sap-ui-core.js"
    data-sap-ui-theme="sap_bluecrystal"
    data-sap-ui-no-duplicate-ids="true"
    data-sap-ui-resource-roots='{"my.app": "./"}'>
</script>

<!-- After -->
<script id="sap-ui-bootstrap"
    src="resources/sap-ui-core.js"
    data-sap-ui-async="true"
    data-sap-ui-compat-version="edge"
    data-sap-ui-theme="sap_horizon"
    data-sap-ui-resource-roots='{"my.app": "./"}'>
</script>

Notes

  • Always add data-sap-ui-async="true" before other data attributes for consistency
  • Setting compat-version="edge" enables complex binding syntax automatically, so binding-syntax becomes redundant
  • Removed parameters should not leave trailing whitespace or empty lines
  • If the file has multiple script tags, only modify the bootstrap tag — leave all others intact (including inline <script> blocks that will be handled by CSP compliance in Phase 5)

Comments

Markdown supported