claude-skills/

Anthropic公式スキル・プラグインの日本語ディレクトリ

last sync 22h ago
スキルOfficialdevelopment

🔧fix-partially-deprecated-apis

プラグイン
ui5-modernization

説明

UI5 linterが報告するものの自動修正できない、部分的に非推奨となったAPIの使用箇所を修正します。 次のような場合に使用: - linterが以下を出力している場合: - `no-deprecated-api`: `Parameters.get`、`JSONModel.loadData`、`Mobile.init`、`ODataModel.v2.createEntry`、`View.create`、`Fragment.load`、Routerコンストラクタに対する警告 - `unsupported-api-usage`: JSバインディング内のstring formatterに対する警告 以下のケースでトリガー: - オブジェクトパラメータなしの `Parameters.get` - `bAsync=false` を指定した `JSONModel.loadData` - `homeIcon` を指定した `Mobile.init` - `batchGroupId` を指定した `createEntry` - XML以外のタイプを指定した `View.create` / `Fragment.load` - `async:true` なしのRouter - JS内でstringとして指定されたformatter 部分的に非推奨となった各APIバリアントに対して、具体的な修正パターンを提供します。

原文を表示

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.

ユースケース

  • UI5 linterが非推奨APIの警告を出力している
  • Parameters.getをオブジェクトパラメータなしで呼び出している
  • JSONModel.loadDataでbAsync=falseを指定している
  • Mobile.initでhomeIconを指定している
  • View.create/Fragment.loadでXML以外を指定している

本文

Fix Partially Deprecated APIs

This skill fixes partially deprecated API usage that the UI5 linter detects but cannot auto-fix because they require understanding the specific deprecated variant being used.

Quick Reference

API Deprecated Usage Fix
Parameters.get No args, string, or array Object with name and callback
JSONModel.loadData bAsync=false (3rd param) Omit or set true
Mobile.init homeIcon/homeIconPrecomposed Remove, use web manifest
ODataModel.v2.createEntry batchGroupId Use groupId
ODataModel.v2.createEntry properties as array Use object with values
View.create type: "JS/JSON/HTML/Template" Use "XML" or omit
Fragment.load type: "HTML" Use "XML" or omit
Router constructor Missing/false async Set async: true
Binding formatter String value in JS Function reference

Linter Rules Handled

Rule ID Message Pattern This Skill's Action
no-deprecated-api Usage of deprecated variant of 'sap/ui/core/theming/Parameters.get' Use object parameter
no-deprecated-api Usage of deprecated value for parameter '...' of 'sap/ui/model/json/JSONModel#loadData' Remove/change parameter
no-deprecated-api Usage of deprecated value for parameter '...' of 'sap/ui/util/Mobile#init' Remove parameter
no-deprecated-api Usage of deprecated parameter 'batchGroupId' in 'sap/ui/model/odata/v2/ODataModel#createEntry' Use groupId
no-deprecated-api Usage of deprecated value '...' for parameter 'type' in 'sap/ui/core/mvc/View.create' Use XML type
no-deprecated-api Usage of deprecated value '...' for parameter 'type' in 'sap/ui/core/Fragment.load' Use XML type
no-deprecated-api Usage of deprecated value for parameter 'oConfig.async' of constructor 'sap/ui/core/Router' Set async: true
unsupported-api-usage Do not use strings for 'formatter' values in JavaScript Use function reference

When to Use

Apply this skill when you see linter output like:

MyController.js:15:5 error Usage of deprecated variant of 'sap/ui/core/theming/Parameters.get'  no-deprecated-api
MyController.js:20:5 error Usage of deprecated value for parameter 'bAsync' of 'sap/ui/model/json/JSONModel#loadData'  no-deprecated-api
MyController.js:25:5 error Usage of deprecated parameter 'batchGroupId' in 'sap/ui/model/odata/v2/ODataModel#createEntry'  no-deprecated-api
MyController.js:30:5 error Do not use strings for 'formatter' values in JavaScript  unsupported-api-usage

Fix Strategies

1. Parameters.get - Old Variant

Problem: Calling Parameters.get() without an object parameter.

// Before - all these variants are deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/theming/Parameters"
], function(Controller, Parameters) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            // Deprecated: no arguments
            var allParams = Parameters.get();

            // Deprecated: string argument
            var singleParam = Parameters.get("sapUiBaseColor");

            // Deprecated: array argument
            var multiParams = Parameters.get(["sapUiBaseColor", "sapUiBaseBG"]);
        }
    });
});

Fix Strategy: Use object parameter with callback.

// After - use object parameter
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/theming/Parameters"
], function(Controller, Parameters) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            // Correct: object parameter with name and callback
            Parameters.get({
                name: "sapUiBaseColor",
                callback: function(sValue) {
                    // Use the parameter value
                    console.log("Color:", sValue);
                }
            });

            // Correct: multiple parameters
            Parameters.get({
                name: ["sapUiBaseColor", "sapUiBaseBG"],
                callback: function(mParams) {
                    // mParams is an object with parameter values
                    console.log("Base color:", mParams.sapUiBaseColor);
                    console.log("Base BG:", mParams.sapUiBaseBG);
                }
            });
        }
    });
});

2. JSONModel.loadData - Deprecated Parameters

Problem: Using bAsync=false or bCache=false in loadData().

// Before - bAsync=false is deprecated (3rd parameter)
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/model/json/JSONModel"
], function(Controller, JSONModel) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            var oModel = new JSONModel();

            // Deprecated: bAsync=false (synchronous loading)
            oModel.loadData("/api/data", null, false);

            // Deprecated: bCache=false (6th parameter)
            oModel.loadData("/api/data", null, true, "GET", false, false);
        }
    });
});

Fix Strategy: Use async loading (default) and remove cache parameter.

// After - use async loading
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/model/json/JSONModel"
], function(Controller, JSONModel) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            var oModel = new JSONModel();

            // Correct: async loading (default or true)
            oModel.loadData("/api/data").then(function() {
                // Handle loaded data
            });

            // Or with parameters, omitting deprecated ones
            oModel.loadData("/api/data", null, true, "GET");
        }
    });
});

3. Mobile.init - Deprecated Parameters

Problem: Using homeIcon or homeIconPrecomposed in Mobile.init().

// Before - homeIcon and homeIconPrecomposed are deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/util/Mobile"
], function(Controller, Mobile) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            Mobile.init({
                homeIcon: "icons/icon.png",              // Deprecated
                homeIconPrecomposed: true,              // Deprecated
                statusBar: "default"
            });
        }
    });
});

Fix Strategy: Remove the deprecated parameters.

// After - remove homeIcon and homeIconPrecomposed
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/util/Mobile"
], function(Controller, Mobile) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            Mobile.init({
                statusBar: "default"
            });

            // Note: Use web app manifest (manifest.json) for home screen icons instead
        }
    });
});

Alternative: Define home screen icons in your web app manifest:

{
    "icons": [
        {
            "src": "icons/icon-192.png",
            "sizes": "192x192",
            "type": "image/png"
        }
    ]
}

4. ODataModel.v2.createEntry - Deprecated Parameters

Problem: Using batchGroupId or properties as array in createEntry().

// Before - batchGroupId and properties array are deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller"
], function(Controller) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onCreate: function() {
            var oModel = this.getView().getModel();

            var oContext = oModel.createEntry("/Products", {
                batchGroupId: "myBatch",                      // Deprecated: use groupId
                properties: ["Name", "Price", "Category"]    // Deprecated: use object
            });
        }
    });
});

Fix Strategy: Use groupId and pass properties as object with initial values.

// After - use groupId and properties object
sap.ui.define([
    "sap/ui/core/mvc/Controller"
], function(Controller) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onCreate: function() {
            var oModel = this.getView().getModel();

            var oContext = oModel.createEntry("/Products", {
                groupId: "myBatch",                          // Correct: groupId
                properties: {                                // Correct: object with initial values
                    Name: "",
                    Price: 0,
                    Category: ""
                }
            });
        }
    });
});

5. View.create - Deprecated View Types

Problem: Creating views with deprecated types (JS, JSON, HTML, Template).

// Before - non-XML view types are deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/mvc/View"
], function(Controller, View) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            View.create({
                viewName: "my.app.view.Detail",
                type: "JS"          // Deprecated: JS, JSON, HTML, Template
            }).then(function(oView) {
                // Use view
            });
        }
    });
});

Fix Strategy: Convert to XML view type.

// After - use XML type (or omit type, XML is default)
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/mvc/View"
], function(Controller, View) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            View.create({
                viewName: "my.app.view.Detail",
                type: "XML"         // Or omit - XML is default
            }).then(function(oView) {
                // Use view
            });
        }
    });
});

Note: This requires converting your JS/JSON/HTML view file to an XML view file.

6. Fragment.load - Deprecated Fragment Type

Problem: Loading fragments with HTML type.

// Before - HTML fragment type is deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/Fragment"
], function(Controller, Fragment) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onOpenDialog: function() {
            Fragment.load({
                name: "my.app.fragment.Dialog",
                type: "HTML"        // Deprecated
            }).then(function(oFragment) {
                // Use fragment
            });
        }
    });
});

Fix Strategy: Convert to XML fragment.

// After - use XML type (or omit, XML is default)
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/Fragment"
], function(Controller, Fragment) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onOpenDialog: function() {
            Fragment.load({
                name: "my.app.fragment.Dialog",
                type: "XML"         // Or omit - XML is default
            }).then(function(oFragment) {
                // Use fragment
            });
        }
    });
});

7. Router Constructor - Missing async Flag

Problem: Creating Router without async: true.

// Before - missing or false async flag is deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/routing/Router"
], function(Controller, Router) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            // Deprecated: no config
            var oRouter1 = new Router([]);

            // Deprecated: async not set or false
            var oRouter2 = new Router([], {
                async: false
            });
        }
    });
});

Fix Strategy: Set async: true in the config.

// After - set async: true
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/routing/Router"
], function(Controller, Router) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            var oRouter = new Router([], {
                async: true         // Required
            });
        }
    });
});

Note: Most apps use the Component's built-in router via manifest.json, which handles this automatically when IAsyncContentCreation is implemented in Component.js (see fix-component-async skill).

8. String Formatter in JS Bindings

Problem: Using string value for formatter in JavaScript.

// Before - string formatter doesn't work in JS
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/m/Input",
    "../model/formatter"
], function(Controller, Input, formatter) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        formatter: formatter,

        onInit: function() {
            var oInput = new Input({
                value: {
                    path: "/status",
                    formatter: "formatter.statusText"   // Error: string won't work
                }
            });
        }
    });
});

Fix Strategy: Use function reference.

// After - use function reference
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/m/Input",
    "../model/formatter"
], function(Controller, Input, formatter) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        formatter: formatter,

        onInit: function() {
            var oInput = new Input({
                value: {
                    path: "/status",
                    formatter: formatter.statusText    // Correct: function reference
                }
            });
        }
    });
});

Note: String formatters work in XML views (resolved at runtime) but not in JS where you have direct access to the function.

Notes

  • These are "partially" deprecated because only specific usage patterns are deprecated, not the entire API
  • Always check npx @ui5/linter --details for links to modernization documentation
  • View/Fragment type changes require converting the actual view/fragment files to XML
  • The Router async: true is automatically handled when using IAsyncContentCreation in Component.js (see fix-component-async skill for correct placement)

原文・著作権は Anthropic および各プラグイン作者に帰属します。日本語訳は Claude API による自動翻訳です。