SuperAPI AI Directory

fix-bootstrap-params

General & other

View repository

Updated 10-15 23:57

About this skill

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 ID Message Pattern This Skill's Action
no-deprecated-api Missing bootstrap parameter 'data-sap-ui-async' Add data-sap-ui-async="true"
no-deprecated-api Missing bootstrap parameter 'data-sap-ui-compat-version' Add data-sap-ui-compat-version="edge"
no-deprecated-api Use of deprecated value 'false' for bootstrap parameter 'data-sap-ui-async' Change to "true"
no-deprecated-api Use of deprecated value '...' for bootstrap parameter 'data-sap-ui-compat-version' Change to "edge"
no-deprecated-api Abandoned bootstrap parameter '...' should be removed Remove the parameter
no-deprecated-api Redundant bootstrap parameter '...' should be removed Remove the parameter
no-deprecated-api Bootstrap parameter '...' should be replaced with '...' Replace with new parameter
no-deprecated-theme Use of deprecated theme '...' Change to sap_horizon
no-deprecated-library Use 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)