eslint-plugin-fiori-custom

The ESLint custom plug-in is an extension of existing ESLint open-source node plugin. This plug-in contains custom rules and their configurations. Below you could find the steps to use it in your development project.

Initial Set-up

• Go to your project directory and open terminal.
• Initialize npm package (only if you don’t have a package.json in you root directory) with this command.

npm init -y
 

• Set your registry with this command:

npm config set registry https://registry.npmjs.org/
 

Installations

• Install ESLint with this command:

npm install [email protected] --save-dev
 

• Next, install babel-eslint:

npm install babel-eslint --save-dev

• Next, install eslint-plugin-fiori-custom:

npm install [email protected] --save-dev

Usage

Productive Code

• Run the command below to test your productive code with the checks. This command will show the reports in the terminal itself. You could modify the command as per your need (e.g. adding another --ignore-pattern for some directory that you don't want to lint).

eslint ./ -c ./node_modules/eslint-plugin-fiori-custom/configure.eslintrc --no-eslintrc --rulesdir ./node_modules/eslint-plugin-fiori-custom/lib/rules/ --ignore-pattern 'test/**' --ignore-pattern 'src/test/**' --ignore-pattern 'target/**' --ignore-pattern 'webapp/test/**' --ignore-pattern 'src/main/webapp/test/**' --ignore-pattern 'webapp/localservice/**' --ignore-pattern '/src/main/webapp/localService/**' --ignore-pattern 'backup/**' --ignore-pattern 'Gruntfile.js' --ignore-pattern 'changes_preview.js' --ignore-pattern 'gulpfile.js' 

Test Code

• Run the command below to check your test code. This command will show the reports in the terminal itself. This command uses configuration specific to test code. You must not forget to add the test-folder path at the end of this command (e.g.: webapp/test/ or src/test/ or test/)

eslint -c ./node_modules/eslint-plugin-fiori-custom/testcode.eslintrc --no-eslintrc --rulesdir ./node_modules/eslint-plugin-fiori-custom/lib/rules/ src/test

.eslintrc config file

Adding a .eslintrc to the project root enables integration with the Editor such as VS Code.

{
    "plugins": [
        "fiori-custom"
    ],
    "overrides": [
        {
            "files": [
                "**/*.*"
            ],
            "excludedFiles": [
                "test/**",
                "src/test/**",
                "target/**",
                "webapp/test/**",
                "src/main/webapp/test/**",
                "webapp/localservice/**",
                "src/main/webapp/localService/**",
                "backup/**",
                "Gruntfile.js",
                "changes_preview.js",
                "gulpfile.js"
            ],
            "plugins": [
                "fiori-custom"
            ],
            "extends": [
                "eslint:recommended",
                "plugin:fiori-custom/fioriToolsDefault"
            ]
        },
        {
            "files": [
                "webapp/test/**"
            ],
            "plugins": [
                "fiori-custom"
            ],
            "extends": [
                "plugin:fiori-custom/fioriToolsTestcode"
            ]
        }
    ]
}

Rules

You could find the rules and the details below.

line-endings

Detect usage of invalid line endings

Different operating systems usually represent a newline with different characters, for details see here.

For example Windows uses CR+LF (carriage return and line-feed characters) whereas Unix only uses the LF character.

Mixed kinds of line-endings in the same repository can cause code reviews or automatic merging to be .

Rule Details

This check will raise a warning when "Windows line endings" (CR + LF character) are detected. Please change lo Unix style line endings.

sap-bookmark-performance

Check your setting of serviceRefreshInterval

While deciding which interval to use, one has to keep in mind, that there might be thousands of users which have the Launchpad open and might display some KPIs. With a too small refresh Interval this can create a considerable work load in the back end. Therefore, we recommend the following values as default depending on the use case.

1. Complex calculations are required to calculate the data on the tile, which might take multiple seconds to be calculated -> No auto refresh must be used. Set the Interval to 0.
2. Only a simple query is required (e.g. determine the number of tasks I’m assigned to) out of one central table -> Interval should be set to 300 (5 Minutes).

Warning Message: A value of more than 0 and less than 300 for the property serviceRefreshIntervall may result in performance limitations.

The following patterns are considered warnings:

        function _extractDiscoveryCollection(oCollection) {
         var onInit = function () {
          var oView = this.getView(),
                  oAddToHome = oView.byId("addToHome");

          oAddToHome.setAppData({
           title: "My Bookmark",           // default: ""
           serviceUrl: "/any/service/$count", // default: undefined, string or a JS function
           // should raise an error
           serviceRefreshInterval: 1,       // default: undefined
           customUrl: "https://www.sap.com"    // default: undefined, string or a JS function
          });
         }
        }
        oAddToHome.setServiceRefreshInterval(299);

sap-browser-api-error

Detect some forbidden usages of browser APIs

This is a collection of usages of browser APIs that might lead to issues. Please search for the warning messages that you see in ESLint to find the explanation of the respective check.

Rule Details

This rule aims to detect forbidden usages of browser APIs and raise error.

Direct DOM insertion

Warning message: Direct DOM insertion, create a custom control instead

The following patterns are considered warnings:

document.createElement(foo);

Direct DOM manipulation

Warning message: Direct DOM Manipulation, better to use jQuery.appendTo if really needed

The following patterns are considered warnings:

document.execCommand(cmd, false, args);

insertBrOnReturn

Warning message: insertBrOnReturn is not allowed since it is a Mozilla specific method, Chrome doesn't support that.

The following patterns are considered warnings:

var abc = document.queryCommandSupported('insertBrOnReturn');

Location reload

Warning message: location.reload() is not permitted.

The following patterns are considered warnings:

location.reload();
var mylocation = location;
mylocation.reload();

Global event handling override

Warning message: Global event handling override is not permitted, please modify only single events.

The following patterns are considered warnings:

window.event.returnValue = false;
window.onload = function () {
  return Hammer;
};

Proprietary Browser API access

Some browser APIs should not be used at all, instead the sap.ui.Device API has to be used.

Warning message: Proprietary Browser API access, use sap.ui.Device API instead.

The following patterns are considered warnings:

if (window.addEventListener) {
  x = 1;
}
navigator.back();
var x = navigator.appCodeName;

Definition of globals via window object

Warning message: Definition of global variable/api in window object is not permitted.

The following patterns are considered warnings:

var mynavig = window.top.tip;
window.define();

Dynamic style insertion

Warning message: Dynamic style insertion, use library CSS or lessifier instead.

The following patterns are considered warnings:

var sheet = document.styleSheets[i];
var abc = document.styleSheets.length;

False positives

There might be cases where the check produces a false positive, i.e. you receive a warning but your code is correct and complies to the UI5 guidelines. In such a case, you can deactivate the rule by placing the following pseudo-comment block around your code. Please make sure to have your code reviewed by a colleague before you enter such a pseudo-comment.

/*eslint-disable sap-browser-api-error*/
   <your code>
/*eslint-enable sap-browser-api-error*/

sap-browser-api-warning

Discourage usage of certain browser APIs

This is a collection of usages of browser APIs that might lead to issues. Please search for the warning messages that you see in ESLint to find the explanation of the respective check.

Disallow usage of browser APIs that might lead to issues.

Discourage usage of certain browser APIs.

Rule details

Direct history manipulation

Warning message: Direct DOM insertion, create a custom control instead

The following patterns are considered warnings:

if (this.editMode){

            window.history.back();

} else {

        this.oRouter.navTo("detail", {

        contextPath : "AccountCollection('"+responseObject.accountID+"')"

        }, true);

    }

The following patterns are not considered warnings:

myNavBack : function example(sRoute, mData) {

    var oHistory = sap.ui.core.routing.History.getInstance();

    var sPreviousHash = oHistory.getPreviousHash();

//The history contains a previous entry

    if (sPreviousHash !== undefined) {

/* eslint-disable sap-browser-api-warning */

        window.history.go(-1);

/* eslint-enable sap-browser-api-warning */

    } else {

        var bReplace = true; // otherwise we go backwards with a forward history

        this.navTo(sRoute, mData, bReplace)

    }

}

setTimeout usage

Executing logic with timeouts is often a workaround for faulty behavior and does not fix the root cause. The timing that works for you may not work under different circumstances (other geographical locations with greater network latency, or other devices that have slower processors) or when the code is changed. Use callbacks or events instead, if available. Please check the SAPUI5 guidelines for more details.

warning message: Timeout with value > 0

The following patterns are considered warnings:

window.setTimeout(jQuery.proxy(processChanges, this), 50);

Global selection

warning message: Global selection modification, only modify local selections

The following patterns are considered warnings:

window.getSelection().rangeCount = 9;

Proprietary browser API

Certain browser APIs are considered to be risky, when used directly and not wrapped via jQuery.

warning message: Proprietary Browser API access

The following patterns are considered warnings:

var variab1 = window.innerWidth;

var myscreen = screen;
var variab5 = myscreen.something;

document.body.appendChild(x);
document.body.style.backgroundColor = 'yellow';

var mydocument = window.document;
mydocument.body.appendChild(x);
mydocument.body.style.backgroundColor = 'yellow';
var mydocument = document;
mydocument.body.appendChild(x);
mydocument.body.style.backgroundColor = 'yellow';
var abcss = window.document.body;
abcss.appendChild(x);
abcss.style.backgroundColor = 'yellow';

The following patterns are not considered warnings:

var width = $(window).innerWidth();

DOM access

Accessing the DOM directly is considered risky. If necessary, a jQuery selector should be used instead.

warning message: Direct DOM access, use jQuery selector instead

The following patterns are considered warnings:

document.getElementById('test');

sap-cross-application-navigation

No static cross-application navigation targets

Fiori-as-a-Service Enablement Guideline prohibits the use of static list of cross-application navigation targets.

Rule Details

This rule should prevent the usage of static cross-application navigation targets.

Use the isIntentSupported function of the CrossApplicationNavigation service. See the according Cross Application Navigation and JSDOC API documentation. Note that the function is mass-enabled, you could check an array of all relevant navigation targets in one call.

The following patterns are considered warnings:

sap.ushell.Container.getService('CrossApplicationNavigation').toExternal({});

The following patterns are not warnings:

checkPromoFactSheetAvailable : function example() {
 // By default: promo factsheet not available
 this._bPromoFactSheetAvailable = false;
 if (this._oCrossAppNav) {
  // Check if the intent for the promotion factsheet is supported
  var sIntent = "#Promotion-displayFactSheet";
  var oDeferred = this._oCrossAppNav.isIntentSupported([sIntent]);
  oDeferred.done(jQuery.proxy(function (oIntentSupported) {
   if (oIntentSupported && oIntentSupported[sIntent] && oIntentSupported[sIntent].supported === true) {
    // Remember that the navigation to the promotion factsheet is possible
    this._bPromoFactSheetAvailable = true;
    // Activate the promotion links if they were already added to the view
    this.activatePromotionLinks();
   }
  }, this));
 }
}

sap-forbidden-window-property

Detect the usage of forbidden window properties

Rule Details

Warning message: Usage of a forbidden window property.

The following patterns are considered warnings:

var top = window.top;
window.addEventListener(listener);

sap-message-toast

Disallow violation for certain options of sap.m.MessageToast

The Fiori design guidelines require a certain behavior of a message toast.

Rule Details

The check looks for any call of the method show on the sap.m.MessageToast-Object and checks the following properties:

• duration must no be smaller than 3000
• width must no be greater then 35em
• my must be center bottom
• at must be center bottom

The following patterns are considered warnings:

sap.m.MessageToast.show('This is a warning!', { duration: 1000 });

The following patterns are not ot considered warnings:

sap.m.MessageToast.show('This is a warning!');

sap-no-absolute-component-path

Disallow absolute paths to component includes

Giving an absolute path in component includes might produce an error and is no longer supported by UI5.

Rule Details

The rule checks if includes inside a component have a leading /.

The following patterns are considered warnings:

code: "sap.ui.core.UIComponent.extend('sap.ui.demokit.explored.Component', { " +
  'metadata : { ' +
  'includes : [ ' +
  "'css/style2.css', " +
  "'/css/style2.css', " +
  "'/css/titles.css' " +
  '], ' +
  'routing : { ' +
  'config : { ' +
  'routerClass : MyRouter, ' +
  "viewType : 'XML', " +
  "viewPath : 'sap.ui.demokit.explored.view', " +
  "targetControl : 'splitApp', " +
  'clearTarget : false ' +
  '}, ' +
  'routes : [ { ' +
  "pattern : 'entity/{id}/{part}', " +
  "name : 'entity', " +
  "view : 'entity', " +
  'viewLevel : 3, ' +
  "targetAggregation : 'detailPages' " +
  '} ]' +
  '} ' +
  '} ' +
  '});';

sap-no-br-on-return

Detect the usage of document.queryCommandSupported

This rule checks any call of queryCommandSupported on document. Calls with argument sap-no-br-on-return are not allowed because this is a browser specific command.

Rule Details

Warning message: insertBrOnReturn is not allowed since it is a Mozilla specific method, other browsers don't support that.

The following patterns are considered warnings:

var abc = document.queryCommandSupported('insertBrOnReturn');

sap-no-commons-usage

Detects the usage of sap.ui.commons objects

As per Fiori Architectural Guidelines controls from sap.ui.commons are not allowed. Instead, sap.m controls should be used.

Warning Message: Usage of sap.ui.commons controls is forbidden, please use controls from sap.m library.

The following patterns are considered warnings:

sap.ui.define(['sap.ui.commons.anyControl'], function (control) {
  doSomething.with(control);
});

function createControl() {
  return new sap.ui.commons.Control();
}

sap-no-dom-access

Discourage usage of certain methods of document

Accessing the DOM directly is considered risky. If necessary, a jQuery selector should be used instead.

Rule details

The following methods are not allowed to use:

• getElementById
• getElementsByName
• getElementsByTagName
• getElementsByClassName

warning message: Direct DOM access, use jQuery selector instead

The following patterns are considered warnings:

document.getElementById('test');

sap-no-dom-insertion

Disallow usage dom insertion methods

The UI5 guidelines do not allow insertion of elements into the DOM. Instead, usage of a custom control should be considered.

Rule Details

The rule detects all method calls of insertBefore, appendChild, replaceChild, after, before, insertAfter, insertBefore, append, prepend, appendTo, prependTo.

The following patterns are considered warnings:

$('#container').append('Test');

var list = document.getElementById('myList1');
list.insertBefore(node, list.childNodes[0]);

myObject.after(document.body);

False positives

There might be cases where the check produces a false positive, i.e. when you have a method containing one of the strings given above. In such a case, you can change the method name or deactivate the rule by placing the following pseudo-comment block around your code. Please make sure to have your code reviewed by a colleague before you enter such a pseudo-comment.

/*eslint-disable sap-no-dom-insertion*/
   <your code>
/*eslint-enable sap-no-dom-insertion*/

sap-no-dynamic-style-insertion

Detect dynamic style insertion

Rule Details

The check detects any usage of document.styleSheets.

The following patterns are considered warnings:

var sheet = document.styleSheets[i];
var abc = document.styleSheets.length;

Warning message: Dynamic style insertion, use library CSS or lessifier instead.

sap-no-element-creation

Disallow direct DOM insertion

The UI5 guidelines do not allow creation of elements in the DOM. Instead, usage of a custom control should be considered.

Rule Details

The rule detects all method calls of "createElement", "createTextNode", "createElementNS", "createDocumentFragment", "createComment", "createAttribute" and "createEvent".

Warning message: Direct DOM insertion, create a custom control instead

The following patterns are considered warnings:

document.createElement(foo);

sap-no-encode-file-service

Detect the usage of encode file service

The encode_file service is deprecated and not available on HCP.

Rule Details

The rule detects the usage of the string /sap/bc/ui2/encode_file.

The following patterns are considered warnings:

oFileUpload.setEncodeUrl(
  '/sap/bc/ui2/encode_file' + (sUrlParams ? '?' + sUrlParams : '')
);
var service = '/sap/bc/ui2/encode_file';

How to fix: Use the sap.m.UploadCollection with the sap.m.UploadCollectionItem instead.

sap-no-exec-command

Rule Details

The rule detects usage of the execCommand method

Warning message: Direct DOM Manipulation, better to use jQuery.appendTo if really needed

The following patterns are considered warnings:

document.execCommand(cmd, false, args);

document['execCommand'](cmd, false, args);

sap-no-global-define

Detect definition of globals via window object (

Rule Details

Global variables should not be used in Fiori Apps. This check detects global definitions by attachments to the window object or override of window properties.

The following patterns are considered warnings:

window.MyVar = 'A';
window.name = 'New Name';

Warning message: Definition of global variable/api in window object is not permitted.

sap-no-global-event

Detect global event handling override

The UI5 guidelines do not allow overriding global event handling.

Rule Details

This rule detects override of the following global events: onload, onunload, onabort, onbeforeunload, onerror, onhashchange, onpageshow, onpagehide, onscroll, onblur, onchange, onfocus, onfocusin, onfocusout, oninput, oninvalid, onreset, onsearch, onselect, onsubmit.

Global event handling override

Warning message: Global event handling override is not permitted, please modify only single events.

The following patterns are considered warnings:

window.event.returnValue = false;
window.onload = function () {
  return Hammer;
};

sap-no-global-selection

Rule details

warning message: Global selection modification, only modify local selections

The following patterns are considered warnings:

window.getSelection().rangeCount = 9;

sap-no-global-variable

Rule Details

The rule checks if a variable is declared as global (defined outside any function scope) and returns an error message in this case.

ALLOWED_VARIABLES = [ "undefined", "NaN", "arguments", "PDFJS", "console", "Infinity" ]

sap-no-hardcoded-color

Disallow usage of hard coded colors

It is not allowed to style Fiori Apps with colors in JavaScript code as they will break the Fiori themes.

Rule Details

The following patterns are considered warnings:

$("<div id='lasso-selection-help' style='position:absolute;pointer-events:none;background:#cccccc;'></div>");

How to Fix:

Do not specify colors in custom CSS but use the standard theme-dependent classes instead.

sap-no-hardcoded-url

Disallow use of hardcoded URLs

Fiori guidelines do not allow usage of hardcoded URLs to internal or external systems.

Rule Details

Instead of references to internal system in your URLs, you should only reference the path to the resource.

Allowed URLs are:

http://www.w3.org/, http://www.sap.com/Protocols/, http://www.sap.com/adt, http://localhost/offline/, https://localhost/offline/

The following patterns are considered warnings:

serviceUrl: URI("https://example.domain.com:50057/sap/opu/odata/sap/XXXX/").directory()

serviceUrl: 'proxy/https/example.domain.com:50057/sap/opu/odata/sap/XXXX/';

The following patterns are not considered warnings:

serviceUrl: "/sap/opu/odata/sap/FDMO_PROCESS_RECEIVABLES_SRV/"

sap-no-history-manipulation

Warning message: Direct history manipulation, does not work with deep links, use router and navigation events instead

The following patterns are considered warnings:

window.history.back();

history.go(-3);

var personalHistory = window.history;
personalHistory.back();

The following patterns are NOT considered warnings:

myNavBack : function example(sRoute, mData) {
    var oHistory = sap.ui.core.routing.History.getInstance();
    var sPreviousHash = oHistory.getPreviousHash();
    //The history contains a previous entry
    if (sPreviousHash !== undefined) {
        window.history.go(-1);
    } else {
        var bReplace = true; // otherwise we go backwards with a forward history
        this.navTo(sRoute, mData, bReplace)
    }
}

sap-no-inner-html-access

Discourage the access of innerHTML

Accessing the DOM directly is considered risky.

Rule details

It is recommended not to access the DOM via the innerHTML attribute.

warning message: Accessing the inner html is not recommended.

The following patterns are considered warnings:

if ('some text' === button.innerHTML) {
  doSomething();
}
document.getElementById('button').innerHTML = 'send';

sap-no-inner-html-write

Rule details

It is not allowed to alter the DOM via the innerHTML attribute.

warning message: "Writing to the inner html is not allowed."

The following patterns are considered warnings:

document.getElementById('button').innerHTML = 'send';
document.getElementById('button')['innerHTML'] = 'send';

sap-no-jquery-device-api

Disallow usage of the jQuery device APIs

The jQuery device API is deprecated since 1.20. The respective functions of sap.ui.Device should be used instead.

Rule Details

The check looks for any call of jQuery.device.

The following patterns are considered warnings:

if (jQuery.device.is.android_phone === false) {
}

if ($.device.is.android_phone === false) {
}

The following patterns are not considered warnings:

if (!sap.ui.Device.system.desktop) {
  this.getView().byId('factSheetButton').setVisible(false);
}

sap-no-localhost

Disallow use localhost

Usage of localhost in Fiori apps is often done for debugging or test reasons and should be avoided in productive code.

Rule Details

The check detects the string "localhost" in any JavaScript function call or expression. The usage of localhost in an offline scenario is allowed, therefore coding mentioned below will not raise a warning.

The following patterns are considered warnings:

if (location.hostname === 'localhost') {
}
location.host.indexOf('localhost');

The following patterns are not considered warnings:

return 'http://localhost/offline/my_contacts/ContactCollection';

sap-no-localstorage

Local storage must not be used in a Fiori application

Rule Details

The following patterns are considered warnings:

localStorage.setObj(this.SETTINGS_NAME, this.objSettings);

sap-no-location-reload

Detect location reload

Fiori guidelines do not allow location.reload().

Rule Details

This checks detects usage of location.reload()

The following patterns are considered warnings:

location.reload();
var mylocation = location;
mylocation.reload();

Warning message: location.reload() is not permitted.

sap-no-location-usage

Discourage usage of location

This is a collection of usages of browser APIs that might lead to issues. Please search for the warning messages that you see in ESLint to find the explanation of the respective check.

Rule details

window.location.* parameters should not be used directly.

warning message:

• Usage of location.assign(),
• Direct Hash manipulation, use router instead,
• Usage of location.href, Override of location

The following patterns are considered warnings:

location.assign(data.results[0].url);

var abc = location;

abc.href.split(' & ');

window.location.hash = '#foo';

window.location.hash.indexOf('-');

location = this.oNavParams.toOppApp;

window.location = this.oNavParams.toOppApp;

sap-no-navigator

Rule Details

The window.navigator object should not be used at all, instead the sap.ui.Device API should be used.

The following patterns are considered warnings:

var language = navigator.language;
var name = navigator.appCodeName;

Warning message: navigator usage is forbidden, use sap.ui.Device API instead.

sap-no-override-rendering

Rule Details

The check detects override of getters, setters and the functions onBeforeRendering and onAfterRendering for SAPUI5 controls.

The following patterns are considered warnings:

var oButton5 = new sap.me.foo.bar.Button();
oButton5.onAfterRendering = function render(){foo.bar = 1;};

sap-no-override-storage-prototype

Rule Details

Storage prototype must not be overridden as this can lead to unpredictable errors

The following patterns are considered warnings:

Storage.prototype.setObj = function (key, obj) {};

sap-no-proprietary-browser-api

Discourage usage of proprietary browser API

Rule details

Certain browser APIs are considered to be risky, when used directly and not wrapped via jQuery. The check detects the following browser APIs: document.body.*, screen.*, window.innerWidth, window.innerHeight

The following patterns are considered warnings:

var variab1 = window.innerWidth;
var variab1 = window.innerHeight;

var myscreen = screen;
var x = myscreen.something;

document.body.appendChild(x);
document.body.style.backgroundColor = 'yellow';

The following patterns are not considered warnings:

var width = $(window).innerWidth();

Warning Message: Proprietary Browser API access, use jQuery selector instead.

sap-no-sessionstorage

Rule Details

For security reasons, the usage of session storage is not allowed in a Fiori application

The following patterns are considered warnings:

sessionStorage.setObj(this.SETTINGS_NAME, this.objSettings);

sap-no-ui5-prop-warning

Disallow usage of private members of UI5 objects

Private members of UI5 objects must never be used in Fiori Apps. They can be changed by UI5 at anytime and the App might not work anymore.

Rule Details

The rule checks usage of a member which has the same name as the following UI5 members:

sap.ui.model.odata.ODataModel, sap.ui.model.odata.v2.ODataModel:

oData

False Positives

As the check can not determine, whether the property used is from as SAPUI5 object, there might be false positives in case you defined a property with the same name in your own object. In such a case you can disable the check in your coding like this:

/* eslint-disable sap-no-ui5-prop-warning */

...some_code_false_positives

/* eslint-enable sap-no-ui5-prop-warning*/

sap-no-ui5base-prop

Disallow usage of private members of UI5 objects

Private members of UI5 objects must never be used in Fiori Apps. They can be changed by UI5 at anytime and the App might not work anymore.

Rule Details

The rule checks usage of a member which has the same name as the following UI5 members:

sap.ui.base.ManagedObject:

mProperties, mAggregations, mAssociations, mMethods, oParent, aDelegates, aBeforeDelegates, iSuppressInvalidate, oPropagatedProperties, oModels, oBindingContexts, mBindingInfos, sBindingPath, mBindingParameters, mBoundObjects

sap.ui.base.EventProvider

mEventRegistry, oEventPool

sap.ui.base.Event

oSource, mParameters, sId

sap.ui.model.odata.ODataModel, sap.ui.model.odata.v2.ODataModel:

oServiceData, bCountSupported, bCache, oRequestQueue, aBatchOperations, oHandler, mSupportedBindingModes, sDefaultBindingMode, bJSON, aPendingRequestHandles, aCallAfterUpdate, mRequests, mDeferredRequests, mChangedEntities, mChangeHandles, mDeferredBatchGroups, mChangeBatchGroups, bTokenHandling, bWithCredentials, bUseBatch, bRefreshAfterChange, sMaxDataServiceVersion, bLoadMetadataAsync, bLoadAnnotationsJoined, sAnnotationURI, sDefaultCountMode, sDefaultOperationMode, oMetadataLoadEvent, oMetadataFailedEvent, sRefreshBatchGroupId, sDefaultChangeBatchGroup, oAnnotations, aUrlParams

False Positives

As the check can not determine, whether the property used is from as SAPUI5 object, there might be false positives in case you defined a property with the same name in your own object. In such a case you can disable the check in your coding like this:

/* eslint-disable sap-no-ui5base-prop */

...some_code_false_positives

/* eslint-enable sap-no-ui5base-prop */

sap-no-window-alert

Disallow usage of window.alert

A window.alert statement should not be part of the code that is committed to GIT!

Instead, sap.m.MessageBox should be used. Please check the UI5 API reference for an example how to do it.

The following patterns are considered warnings:

window.alert('hello world');

sap-opa5-autowait-true

autoWait must be true in extendConfig

This rule checks if autoWait has been set to true in Opa5.extendConfig method.

Rule Details

This rule aims to avoid unstable OPA test code which does not follow the recommendation to use the autoWait logic. This rule aims to detect error in OPA test code. Checks if the autoWait param is set and the value is true. The rule throws error otherwise when the autoWait is not present or is set to false.

autoWait: true

sap-timeout-usage

Discourage usage of setTimeout

This rule finds calls to the setTimeout method with a timeout greater than 0.

Rule details

Executing logic with timeouts is often a workaround for faulty behavior and does not fix the root cause. The timing that works for you may not work under different circumstances (other geographical locations with greater network latency, or other devices that have slower processors) or when the code is changed. Use callbacks or events instead, if available. Please check the SAPUI5 guidelines for more details.

warning message: Timeout with value > 0

The following patterns are considered warnings:

window.setTimeout(jQuery.proxy(processChanges, this), 50);

sap-usage-basemastercontroller

Detect usage of BaseMasterController

The BaseMasterController is a deprecated controller and should be replaced by sap.ca.scfld.md.controller.ScfldMasterController.

Rule Details

The rule detects the usage of the object sap.ca.scfld.md.controller.BaseMasterController and the usage of the string sap/ca/scfld/md/controller/BaseMasterController, like in define-methods.

The following patterns are considered warnings:

sap.ca.scfld.md.controller.BaseMasterController.extend('myBaseController', {
  config: 'myconfig',
});

define(['sap/ca/scfld/md/controller/BaseMasterController'], function (
  Controller
) {
  Controller.extend('myBaseController', {
    config: 'myconfig',
  });
});

sap-ui5-global-eval

Detect the usage of global eval via jQuery(.sap) (sap-ui5-global-eval)

Rule Details

The rule detects

1. invocation of function "jQuery.sap.globalEval()" or "$.sap.globalEval()"
2. invocation of function "jQuery.globalEval()" or "$.globalEval()"

Warning message: Usage of globalEval() / eval() is not allowed due to strict Content Security Policy.

The following patterns are considered warnings:

jQuery.globalEval( "var newVar = true;" );

jQuery.sap.globalEval( "var newVar = true;" );

$.globalEval( "var newVar = true;" );

$.sap.globalEval( "var newVar = true;" );

var a = jQuery.sap;
a.globalEval( "var newVar = true;" );

Bug report

In case you detect a problem with this check, please open a Github issue here.

Further Reading

• SAPUI5 Guidelines

sap-ui5-legacy-factories

Detect the usage of legacy UI5 factories (sap-ui5-legacy-factories)

Rule Details

The rule detects

1. Invocation of function "sap.ui.component()"
2. Invocation of function "sap.ui.component.load()"
3. Invocation of function "sap.ui.view()"
4. Invocation of function "sap.ui.xmlview()"
5. Invocation of function "sap.ui.jsview()"
6. Invocation of function "sap.ui.controller()"
7. Invocation of function "sap.ui.extensionpoint()"
8. Invocation of function "sap.ui.fragment()"
9. Invocation of function "sap.ui.getVersionInfo()"
10. Invocation of function "jQuery.sap.resources()" or "$.sap.resources()"

Warning message: Make use of sap.ui.define([...], function(...) {...} to load required dependencies. Legacy UI5 factories leading to synchronous loading.

The following patterns are considered warnings:

var oView = sap.ui.jsview({								
    viewName: "my.View"                                                            
});

var oComponentInstance = sap.ui.component({								
    name: "my.comp"                                                          
});

sap.ui.component({
    name: "my.comp"                              
});                                                      

var oComponentClass = sap.ui.component.load({
    name: "my.comp"                               
});

var oComponentInstance = sap.ui.component("my-comp-id");

var oView = sap.ui.view({
    viewName: "my.View",                              
    type: "XML"
});

var oView = sap.ui.xmlview({
    viewName: "my.View"                              
});

var oController = sap.ui.controller({
    name: "my.Controller"                              
});

var aControls = sap.ui.extensionpoint({
    name: "my.Point"                              
});

var aControls = sap.ui.fragment({ 
    name: "my.fragment",                               
    type: "XML" 
});

var oVersionInfo = sap.ui.getVersionInfo();

jQuery.sap.resources({
    url: "mybundle.properties"                                                            
});

$.sap.resources({
    url: "mybundle.properties"                                                            
});

Bug report

In case you detect a problem with this check, please open a Github issue here.

Further Reading

• SAPUI5 Guidelines : Legacy Factories Replacement

sap-ui5-legacy-jquerysap-usage

Detect the usage of legacy jQuery.sap (sap-ui5-legacy-jquerysap-usage)

Rule Details

The rule detects

1. Invocation of function "jQuery.sap.require()" or "$.sap.require()"
2. Invocation of function "jQuery.sap.declare()" or "$.sap.declare()"

Warning message: Legacy jQuery.sap usage is not allowed due to strict Content Security Policy.

The following patterns are considered warnings:

jQuery.sap.require( 'sap.m.Button' );

$.sap.require( 'sap.m.Button' );

jQuery.sap.declare( "myModule" , true);                                                     

$.sap.declare( "myModule" , true);                                                   

Bug report

In case you detect a problem with this check, please open a Github issue here.

Further Reading

• SAPUI5 Guidelines

sap-ui5-forms

This rule checks for unsupported content in SimpleForm, Form or SmartForm.

Rule details

Form Form, SimpleForm or SmartForm only controls implementing interface sap.ui.core.IFormContent are supported. Other controls, especially layouts, tables, views or complex controls are not supported. Using unsupported controls might bring visual issues, breaking the designed responsiveness, bringing issues with keyboard support or screen-reader support. Please use only labels and controls implementing interface sap.ui.core.IFormContent as content of a Form.

warning message: Invalid content for SimpleForm / Form / SmartForm.

The following code snippet is fine:

var oSF1 = new sap.ui.layout.form.SimpleForm("SF1", {
                                    title: "Supported Content",
                                    editable: true,
                                    content: [
                                        new sap.m.Label({text: "Label"}),
                                        new sap.m.Input()
                                    ]
                                }).placeAt('content');

var oF1 = new sap.ui.layout.form.Form("F1", {
                                    title: "Supported Content",
                                    editable: true,
                                    layout: new sap.ui.layout.form.ResponsiveGridLayout(),
                                    formContainers: [
                                                            new sap.ui.layout.form.FormContainer({
                                                                formElements: [
                                                                    new sap.ui.layout.form.FormElement({
                                                                        label: new sap.m.Label({text: "Label"}),
                                                                        fields: [
                                                                            new sap.m.Input()
                                                                        ]
                                                                    })
                                                                ]
                                                            })
                                                         ]
                                }).placeAt('content');

var oSF1 = new sap.ui.comp.smartform.SmartForm("SF1", {
                                    title: "Supported Content",
                                    editable: true,
                                    layout: new sap.ui.comp.smartform.Layout(),
                                    groups: [
                                                new sap.ui.comp.smartform.Group({
                                                    groupElements: [
                                                        new sap.ui.comp.smartform.GroupElement({
                                                            label: new sap.m.Label({text: "Label"}),
                                                            elements: [
                                                                new sap.m.Input()
                                                            ]
                                                        })
                                                    ]
                                                })
                                            ]
                                }).placeAt('content');

The following code snippets are unsupported and raise Warnings:

var oSF2 = new sap.ui.layout.form.SimpleForm("SF2", {
                                    title: "Unsupported VerticalLayout",
                                    editable: true,
                                    content: [
                                        new sap.ui.layout.VerticalLayout({
                                            content: [
                                                new sap.m.Label({text: "Label"}),
                                                new sap.m.Input()
                                            ]
                                        })
                                    ]
                                }).placeAt('content');

var oF2 = new sap.ui.layout.form.Form("F2", {
                                    title: "Unsupported VerticalLayout",
                                    editable: true,
                                    layout: new sap.ui.layout.form.ResponsiveGridLayout(),
                                    formContainers: [
                                                            new sap.ui.layout.form.FormContainer({
                                                                formElements: [
                                                                    new sap.ui.layout.form.FormElement({
                                                                        fields: [
                                                                            new sap.ui.layout.VerticalLayout({
                                                                                content: [
                                                                                    new sap.m.Label({text: "Label"}),
                                                                                    new sap.m.Input()
                                                                                ]
                                                                            })
                                                                        ]
                                                                    })
                                                                ]
                                                            })
                                                         ]
                                }).placeAt('content');

var oSF2 = new sap.ui.comp.smartform.SmartForm("SF2", {
                                    title: "Unsupported VerticalLayout",
                                    editable: true,
                                    layout: new sap.ui.comp.smartform.Layout(),
                                    groups: [
                                                new sap.ui.comp.smartform.Group({
                                                    groupElements: [
                                                        new sap.ui.comp.smartform.GroupElement({
                                                            elements: [
                                                                new sap.ui.layout.VerticalLayout({
                                                                    content: [
                                                                        new sap.m.Label({text: "Label"}),
                                                                        new sap.m.Input()
                                                                    ]
                                                                })
                                                            ]
                                                        })
                                                    ]
                                                })
                                            ]
                                }).placeAt('content');

Bug report

In case you think the finding is a false positive please open a Github issue here.