Fiori eslint plugin for fiori rules
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.
``
npm init -y
* Set your registry with this command:
`
npm config set registry https://registry.npmjs.org/
* Install ESLint with this command:
`
npm install eslint@8.32.0 --save-dev
* Next, install :
`
npm install babel-eslint --save-dev
* Next, install eslint-plugin-fiori-custom:
`
npm install eslint-plugin-fiori-custom@2.6.7 --save-dev
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'
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.`JavaScript`
{
"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"
]
}
]
}
You could find the rules and the details below.
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 .
This check will raise a warning when "Windows line endings" (CR + LF character) are detected. Please change lo Unix style line endings.
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:
`js
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);
`
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.
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:
`js`
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:
`js`
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:
`js`
var abc = document.queryCommandSupported('insertBrOnReturn');
#### Location reload
Warning message: _location.reload() is not permitted._
The following patterns are considered warnings:
`js`
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:
`js`
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:
`js`
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:
`js`
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:
`js`
var sheet = document.styleSheets[i];
var abc = document.styleSheets.length;
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.
`js
/eslint-disable sap-browser-api-error/
/eslint-enable sap-browser-api-error/
`
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.
Discourage usage of certain browser APIs.
#### Direct history manipulation
##### Warning message: _Direct DOM insertion, create a custom control instead_
The following patterns are considered warnings:
`js
if (this.editMode){
window.history.back();
} else {
this.oRouter.navTo("detail", {
contextPath : "AccountCollection('"+responseObject.accountID+"')"
}, true);
}
`
The following patterns are not considered warnings:
`js
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:
`js`
window.setTimeout(jQuery.proxy(processChanges, this), 50);
#### Global selection
##### warning message: Global selection modification, only modify local selections
The following patterns are considered warnings:
`js`
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:
`js
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:
`js`
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:
`js`
document.getElementById('test');
No static cross-application navigation targets
Fiori-as-a-Service Enablement Guideline prohibits the use of static list of cross-application navigation targets.
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:
`js`
sap.ushell.Container.getService('CrossApplicationNavigation').toExternal({});
The following patterns are not warnings:
`js
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));
}
}
`
Detect the usage of forbidden window properties
Warning message: _Usage of a forbidden window property._
The following patterns are considered warnings:
`js`
var top = window.top;
window.addEventListener(listener);
Disallow violation for certain options of sap.m.MessageToast
The Fiori design guidelines require a certain behavior of a message toast.
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 3000width
- must no be greater then 35emmy
- must be _center bottom_at
- must be _center bottom_
The following patterns are considered warnings:
`js`
sap.m.MessageToast.show('This is a warning!', { duration: 1000 });
The following patterns are not ot considered warnings:
`js`
sap.m.MessageToast.show('This is a warning!');
Giving an absolute path in component includes might produce an error and is no longer supported by UI5.
The rule checks if includes inside a component have a leading /.
The following patterns are considered warnings:
`js`
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' " +
'} ]' +
'} ' +
'} ' +
'});';
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.
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:
`js`
var abc = document.queryCommandSupported('insertBrOnReturn');
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:
`js`
sap.ui.define(['sap.ui.commons.anyControl'], function (control) {
doSomething.with(control);
});
`js`
function createControl() {
return new sap.ui.commons.Control();
}
Accessing the DOM directly is considered risky. If necessary, a jQuery selector should be used instead.
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:
`js`
document.getElementById('test');
The UI5 guidelines do not allow insertion of elements into the DOM. Instead, usage of a custom control should be considered.
The rule detects all method calls of insertBefore, appendChild, replaceChild, after, before, insertAfter, insertBefore, append, prepend, appendTo, prependTo.
The following patterns are considered warnings:
`js
$('#container').append('Test');
var list = document.getElementById('myList1');
list.insertBefore(node, list.childNodes[0]);
myObject.after(document.body);
`
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.
`js`
/eslint-disable sap-no-dom-insertion/
/eslint-enable sap-no-dom-insertion/
The check detects any usage of document.styleSheets.
The following patterns are considered warnings:
`js`
var sheet = document.styleSheets[i];
var abc = document.styleSheets.length;
Warning message: _Dynamic style insertion, use library CSS or lessifier instead._
The UI5 guidelines do not allow creation of elements in the DOM. Instead, usage of a custom control should be considered.
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:
`js`
document.createElement(foo);
The encode_file service is deprecated and not available on HCP.
The rule detects the usage of the string /sap/bc/ui2/encode_file.
The following patterns are considered warnings:
`js`
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.
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:
`js`
document.execCommand(cmd, false, args);
`js`
document'execCommand';
Detect definition of globals via window object (
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:
`js`
window.MyVar = 'A';
window.name = 'New Name';
Warning message: _Definition of global variable/api in window object is not permitted._
The UI5 guidelines do not allow overriding global event handling.
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:
`js`
window.event.returnValue = false;
window.onload = function () {
return Hammer;
};
Discourage usage of global selection
warning message: Global selection modification, only modify local selections
The following patterns are considered warnings:
`js`
window.getSelection().rangeCount = 9;
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" ]
It is not allowed to style Fiori Apps with colors in JavaScript code as they will break the Fiori themes.
The following patterns are considered warnings:
`js
$("
");`
#### How to Fix:
Do not specify colors in custom CSS but use the standard theme-dependent classes instead.
Fiori guidelines do not allow usage of hardcoded URLs to internal or external systems.
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:
`js`
serviceUrl: URI("https://example.domain.com:50057/sap/opu/odata/sap/XXXX/").directory()
`js`
serviceUrl: 'proxy/https/example.domain.com:50057/sap/opu/odata/sap/XXXX/';
The following patterns are not considered warnings:
`js`
serviceUrl: "/sap/opu/odata/sap/FDMO_PROCESS_RECEIVABLES_SRV/"
Warning message: _Direct history manipulation, does not work with deep links, use router and navigation events instead_
The following patterns are considered warnings:
`js`
window.history.back();
`js`
history.go(-3);
`js`
var personalHistory = window.history;
personalHistory.back();
The following patterns are NOT considered warnings:
`js`
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)
}
}
Accessing the DOM directly is considered risky.
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:
`js`
if ('some text' === button.innerHTML) {
doSomething();
}
document.getElementById('button').innerHTML = 'send';
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:
`js`
document.getElementById('button').innerHTML = 'send';
document.getElementById('button')['innerHTML'] = 'send';
The jQuery device API is deprecated since 1.20. The respective functions of sap.ui.Device should be used instead.
The check looks for any call of jQuery.device.
The following patterns are considered warnings:
`js
if (jQuery.device.is.android_phone === false) {
}
if ($.device.is.android_phone === false) {
}
`
The following patterns are not considered warnings:
`js`
if (!sap.ui.Device.system.desktop) {
this.getView().byId('factSheetButton').setVisible(false);
}
Usage of localhost in Fiori apps is often done for debugging or test reasons and should be avoided in productive code.
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:
`js`
if (location.hostname === 'localhost') {
}
location.host.indexOf('localhost');
The following patterns are not considered warnings:
`js`
return 'http://localhost/offline/my_contacts/ContactCollection';
Local storage must not be used in a Fiori application
The following patterns are considered warnings:
`js`
localStorage.setObj(this.SETTINGS_NAME, this.objSettings);
Fiori guidelines do not allow location.reload().
This checks detects usage of location.reload()
The following patterns are considered warnings:
`js`
location.reload();
var mylocation = location;
mylocation.reload();
Warning message: _location.reload() is not permitted._
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.
window.location.\* parameters should not be used directly.
- Usage of location.assign(),
- Direct Hash manipulation, use router instead,
- Usage of location.href, Override of location
The following patterns are considered warnings:
`js
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;
`
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:
`js`
var language = navigator.language;
var name = navigator.appCodeName;
Warning message: _navigator usage is forbidden, use sap.ui.Device API instead._
Disallow override of control methods
Rule Details
The check detects override of getters, setters and the functions onBeforeRendering and onAfterRendering for SAPUI5 controls.
The following patterns are considered warnings:
`js
var oButton5 = new sap.me.foo.bar.Button();
oButton5.onAfterRendering = function render(){foo.bar = 1;};
`
Storage prototype must not be overridden as this can lead to unpredictable errors
The following patterns are considered warnings:
`js`
Storage.prototype.setObj = function (key, obj) {};
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:
`js
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:
`js`
var width = $(window).innerWidth();
Warning Message: _Proprietary Browser API access, use jQuery selector instead._
Disallow usage of session storage
For security reasons, the usage of session storage is not allowed in a Fiori application
The following patterns are considered warnings:
`js`
sessionStorage.setObj(this.SETTINGS_NAME, this.objSettings);
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.
The rule checks usage of a member which has the same name as the following UI5 members:
> _oData_
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:
`js
/ eslint-disable sap-no-ui5-prop-warning /
...some_code_false_positives
/ eslint-enable sap-no-ui5-prop-warning/
`
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.
The rule checks usage of a member which has the same name as the following UI5 members:
> _mProperties_, _mAggregations_, _mAssociations_, _mMethods_,
_oParent_, _aDelegates_, _aBeforeDelegates_, _iSuppressInvalidate_,
_oPropagatedProperties_, _oModels_, _oBindingContexts_,
_mBindingInfos_, _sBindingPath_, _mBindingParameters_,
_mBoundObjects_
> _mEventRegistry_, _oEventPool_
> _oSource_, _mParameters_, _sId_
> _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_
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:
`js
/ eslint-disable sap-no-ui5base-prop /
...some_code_false_positives
/ eslint-enable sap-no-ui5base-prop /
`
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:
`js`
window.alert('hello world');
This rule checks if autoWait has been set to true in Opa5.extendConfig method.
`js`
autoWait: true
This rule finds calls to the setTimeout method with a timeout greater than 0.
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.
The following patterns are considered warnings:
`js`
window.setTimeout(jQuery.proxy(processChanges, this), 50);
The BaseMasterController is a deprecated controller and should be replaced by sap.ca.scfld.md.controller.ScfldMasterController.
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:
`js
sap.ca.scfld.md.controller.BaseMasterController.extend('myBaseController', {
config: 'myconfig',
});
define(['sap/ca/scfld/md/controller/BaseMasterController'], function (
Controller
) {
Controller.extend('myBaseController', {
config: 'myconfig',
});
});
`
The rule detects
1. invocation of function "jQuery.sap.globalEval(
2. invocation of function "jQuery.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;" );
In case you detect a problem with this check, please open a Github issue here.
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(
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"
});
In case you detect a problem with this check, please open a Github issue here.
The rule detects
1. Invocation of function "jQuery.sap.require(
2. Invocation of function "jQuery.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);
In case you detect a problem with this check, please open a Github issue here.
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.
The following code snippet is fine:
`js`
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');
`js`
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');
`js`
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:
`js`
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');
`js`
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');
`js``
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');
In case you think the finding is a false positive please open a Github issue here.