Skip to content

Latest commit

 

History

History
4136 lines (2644 loc) · 41.9 KB

Replacement_of_Deprecated_jQuery_APIs_a075ed8.md

File metadata and controls

4136 lines (2644 loc) · 41.9 KB
loio
a075ed88ef324261bca41813a6ac4a1c

Replacement of Deprecated jQuery APIs

Overview of the mapping of legacy APIs to the new APIs for the migration

The deprecation of the jQuery.sap APIs and some native jQuery APIs requires that usages of them are replaced in favor of new APIs. The following lists provide an overview of the required replacements.

Note:

For the deprecated native jQuery APIs, we only provide replacements for the most important and most frequently used ones. If you cannot find such a native jQuery API in any of the tables below, refer to the jQuery documentation.



Replacement With New Modules

To migrate the simple replacements, add the new module dependency and replace the call with the added argument name as shown in the following example:

Example:

Old API

New API

sap.ui.define([], function() {
  jQuery.sap.log.info("My log message");
});
sap.ui.define(['sap/base/Log'], function(Log) {
  Log.info("My log message");
});

Old API Call

New Module

Replacement Type

Replace with

jQuery.sap.assert

sap/base/assert

Simple replacement

assert

jQuery.sap.resources

sap/base/i18n/ResourceBundle

Method changed

ResourceBundle.create

jQuery.sap.log

sap/base/Log

Simple replacement

Log

jQuery.sap.log.addLogListener

sap/base/Log

Simple replacement

Log.addLogListener

jQuery.sap.log.debug

sap/base/Log

Simple replacement

Log.debug

jQuery.sap.log.error

sap/base/Log

Simple replacement

Log.error

jQuery.sap.log.fatal

sap/base/Log

Simple replacement

Log.fatal

jQuery.sap.log.getLevel

sap/base/Log

Simple replacement

Log.getLevel

jQuery.sap.log.getLog

sap/base/Log

Method changed

Log.getLogEntries

jQuery.sap.log.getLogEntries

sap/base/Log

Simple replacement

Log.getLogEntries

jQuery.sap.log.getLogger

sap/base/Log

Simple replacement

Log.getLogger

jQuery.sap.log.info

sap/base/Log

Simple replacement

Log.info

jQuery.sap.log.isLoggable

sap/base/Log

Simple replacement

Log.isLoggable

jQuery.sap.log.Level

sap/base/Log

Simple replacement

Log.Level

jQuery.sap.log.logSupportInfo

sap/base/Log

Simple replacement

Log.logSupportInfo

jQuery.sap.log.removeLogListener

sap/base/Log

Simple replacement

Log.removeLogListener

jQuery.sap.log.trace

sap/base/Log

Simple replacement

Log.trace

jQuery.sap.log.warning

sap/base/Log

Simple replacement

Log.warning

jQuery.sap.encodeCSS

sap/base/security/encodeCSS

Simple replacement

encodeCSS

jQuery.sap.encodeJS

sap/base/security/encodeJS

Simple replacement

encodeJS

jQuery.sap.encodeURL

sap/base/security/encodeURL

Simple replacement

encodeURL

jQuery.sap.encodeURLParameters

sap/base/security/encodeURLParameters

Simple replacement

encodeURLParameters

jQuery.sap.encodeHTML

sap/base/security/encodeXML

Simple replacement

encodeXML

jQuery.sap.encodeXML

sap/base/security/encodeXML

Simple replacement

encodeXML

jQuery.sap.addUrlWhitelist

sap/base/security/URLListValidator

Method changed

URLListValidator.add

jQuery.sap.clearUrlWhitelist

sap/base/security/URLListValidator

Method changed

URLListValidator.clear

jQuery.sap.getUrlWhitelist

sap/base/security/URLListValidator

Method changed

URLListValidator.entries

jQuery.sap.removeUrlWhitelist

sap/base/security/URLListValidator

Complex replacement

URLListValidator.clear and URLListValidator.add

jQuery.sap.validateUrl

sap/base/security/URLListValidator

Method changed

URLListValidator.validate

jQuery.sap.camelCase

sap/base/strings/camelize

Simple replacement

camelize

jQuery.sap.charToUpperCase

sap/base/strings/capitalize

Simple replacement

capitalize

jQuery.sap.escapeRegExp

sap/base/strings/escapeRegExp

Simple replacement

escapeRegExp

jQuery.sap.formatMessage

sap/base/strings/formatMessage

Simple replacement

formatMessage

jQuery.sap.hashCode

sap/base/strings/hash

Simple replacement

hash

jQuery.sap.hyphen

sap/base/strings/hyphenate

Simple replacement

hyphenate

jQuery.sap.unicode

jQuery.sap.isStringNFC

sap/base/strings/NormalizePolyfill

Simple replacement

NormalizePolyfill

-

sap/base/strings/toHex

-

-

jQuery.sap.arraySymbolDiff

sap/base/util/array/diff

Simple replacement

diff

jQuery.sap.unique

sap/base/util/array/uniqueSort

Simple replacement

uniqueSort

jQuery.sap.equal

sap/base/util/deepEqual

Simple replacement

deepEqual

-

sap/base/util/defineLazyProperty

-

-

jQuery.sap.each

sap/base/util/each

Simple replacement

each

jQuery.sap.forIn

sap/base/util/each

Simple replacement

each

-

sap/base/util/includes

-

-

jQuery.isPlainObject

sap/base/util/isPlainObject

Simple replacement

isPlainObject

jQuery.sap.parseJS

sap/base/util/JSTokenizer

Simple Replacement

JSTokenizer.parseJS

jQuery.sap.extend

sap/base/util/merge

Complex Replacement

Old:

// Shallow
jQuery.sap.extend({}, sContent);

// Deep
jQuery.sap.extend(true, {}, sContent)

New:

// Shallow
//
// No actual replacement for shallow copies available, see the note below for more info.

// Deep
merge({}, sContent);

Note:

jQuery.sap.extend vs. jQuery.extend

The use of jQuery.sap.extend() is the same as jQuery.extend(), but arguments that are null or undefined are not ignored.

Object.assign

The Object.assign() method only copies enumerable and own properties, but does not copy properties on the prototype chain and non-enumerable properties.

Considering this, Object.assign() might be a suitable replacement for jQuery.sap.extend for a shallow copy.

null and undefined arguments are not ignored.

jQuery.sap.now

sap/base/util/now

Simple Replacement

now

jQuery.sap.getObject

sap/base/util/ObjectPath

Complex Replacement

ObjectPath.get("some.object.path", "someProperty");

If the object path does not exist, the method doesn't create it anymore. If the path needs to be create it has do be done separately:

ObjectPath.create("some.object.path", window.myLib);

jQuery.sap.setObject

sap/base/util/ObjectPath

Complex Replacement

ObjectPath.set("some.object.path", "myValue", window.myLib);

The object path is created if it does not exist.

jQuery.sap.properties

sap/base/util/Properties

Method changed

Properties.create

jQuery.sap.uid

sap/base/util/uid

Simple Replacement

uid

jQuery.sap.getUriParameters

URLSearchParams

URL

Use URL web standard classes

jQuery.sap.getUriParameters() can be migrated to new URLSearchParams(window.location.search)

jQuery.sap.getUriParameters(sUrl) can be migrated to new URL(sUrl).searchParams

Caveats

The APIs have already been designed to be drop-in replacements, but there are some important caveats to consider when switching to URLSearchParams / URL:

  • new URL(input).searchParams validates the given URL according to the WHATWG URL Standard. UriParameters.fromURL(input) only extracts the query string from the given input but does not perform any validation.

  • In some edge cases, especially for incomplete/invalid encoding, decoding behaves differently. The factory method jQuery.sap.getUriParameters expects percentage-encoded input, whereas all other APIs expect and return decoded strings. After parsing the query string, any plus sign (0x2b) in names or values is replaced by a blank (0x20), and the resulting strings are percentage-decoded (decodeURIComponent).

    For details about the encoding/decoding of URLSearchParams, see the WHATWG URL Standard.

  • The get method's second parameter, bAll, is not available; use the getAll method instead.

  • The keys method's return value contains an entry for every occurrence of the key within the query, in the defined order and including duplicates.

    In contrast, UriParameters#keys() yields unique key values, even when there are multiple values for the same key.

  • The internal mParams property is not available anymore (you should never access internal properties of UI5 classes or objects). With the predecessor of the new APIs, access to mParams was often used to check whether a parameter is defined at all. Using the has method or checking the result of get against null serves the same purpose.

var oUrlParams = new URLSearchParams(window.location.search);
oUrlParams.get("my-param");
var oUrlParams = new URL(sUrl).searchParams;
oUrlParams.get("my-param");

-

sap/base/util/values

Simple Replacement

-

jQuery.sap.Version

sap/base/util/Version

Simple Replacement

Version

-

sap/ui/core/support/HotKeys

-

-

jQuery.sap.syncStyleClass

sap/ui/core/syncStyleClass

Simple Replacement

syncStyleClass

jQuery.device.is.android_phone

sap/ui/Device

Complex Replacement

Device.os.android && Device.system.phone

jQuery.device.is.android_tablet

sap/ui/Device

Complex Replacement

Device.os.android && Device.system.tablet

jQuery.device.is.desktop

sap/ui/Device

Complex Replacement

Device.system.desktop

jQuery.device.is.ipad

sap/ui/Device

Complex Replacement

Device.os.ios && Device.system.ipad

jQuery.device.is.iphone

sap/ui/Device

Complex Replacement

Device.os.ios && Device.system.phone

jQuery.device.is.landscape

sap/ui/Device

Complex Replacement

Device.orientation.landscape

jQuery.device.is.phone

sap/ui/Device

Complex Replacement

Device.system.phone

jQuery.device.is.portrait

sap/ui/Device

Complex Replacement

Device.orientation.portrait

jQuery.device.is.tablet

sap/ui/Device

Complex Replacement

Device.system.tablet

jQuery.os.Android

sap/ui/Device

Complex Replacement

Device.os.name === "Android"

jQuery.os.bb

sap/ui/Device

Complex Replacement

Device.os.name === "bb"

jQuery.os.fVersion

sap/ui/Device

Complex Replacement

Device.os.version

jQuery.os.iOS

sap/ui/Device

Complex Replacement

Device.os.name === "iOS"

jQuery.os.linux

sap/ui/Device

Complex Replacement

Device.os.name === "linux"

jQuery.os.mac

sap/ui/Device

Complex Replacement

Device.os.name === "mac"

jQuery.os.os

sap/ui/Device

Complex Replacement

Device.os.name

jQuery.os.version

sap/ui/Device

Complex Replacement

Device.os.versionStr

jQuery.os.win

sap/ui/Device

Complex Replacement

Device.os.name === "win"

jQuery.os.winphone

sap/ui/Device

Complex Replacement

Device.os.name === "winphone"

jQuery.sap.containsOrEquals

sap/ui/dom/containsOrEquals

Simple Replacement

containsOrEquals

jQuery.sap.denormalizeScrollBeginRTL

sap/ui/dom/denormalizeScrollBeginRTL

Simple Replacement

denormalizeScrollBeginRTL

jQuery.sap.denormalizeScrollLeftRTL

sap/ui/dom/denormalizeScrollLeftRTL

Simple Replacement

denormalizeScrollLeftRTL

jQuery.sap.ownerWindow

sap/ui/dom/getOwnerWindow

Simple Replacement

getOwnerWindow

jQuery.sap.scrollbarSize

sap/ui/dom/getScrollbarSize

Simple Replacement

getScrollbarSize

jQuery.sap.includeScript

sap/ui/dom/includeScript

Simple Replacement

includeScript

jQuery.sap.includeStylesheet

sap/ui/dom/includeStylesheet

Simple Replacement

includeStylesheet

jQuery.sap.replaceDOM

sap/ui/dom/patch

Simple Replacement

patch

jQuery.sap.pxToRem

sap/ui/dom/units/Rem

Simple Replacement

Rem.fromPx

jQuery.sap.remToPx

sap/ui/dom/units/Rem

Simple Replacement

Rem.toPx

jQuery.sap.checkMouseEnterOrLeave

sap/ui/events/checkMouseEnterOrLeave

Simple Replacement

checkMouseEnterOrLeave

jQuery.sap.bindAnyEvent

sap/ui/events/ControlEvents

Simple Replacement

bindAnyEvent

jQuery.sap.ControlEvents

sap/ui/events/ControlEvents

Simple Replacement

events

jQuery.sap.unbindAnyEvent

sap/ui/events/ControlEvents

Simple Replacement

unbindAnyEvent

jQuery.sap.handleF6GroupNavigation

sap/ui/events/F6Navigation

Simple Replacement

handleF6GroupNavigation

jQuery.sap.isMouseEventDelayed

sap/ui/events/isMouseEventDelayed

Simple Replacement

isMouseEventDelayed

jQuery.sap.isSpecialKey

sap/ui/events/isSpecialKey

Simple Replacement

isSpecialKey

jQuery.sap.touchEventMode

sap/ui/events/jquery/EventSimulation

Simple Replacement

touchEventMode

jQuery.sap.keycodes

sap/ui/events/KeyCodes

Simple Replacement

KeyCodes

jQuery.sap.PseudoEvents

sap/ui/events/PseudoEvents

Simple Replacement

PseudoEvents

jQuery.sap.disableTouchToMouseHandling

sap/ui/events/TouchToMouseMapping

Simple Replacement

disableTouchToMouseHandling

jQuery.sap.registerModulePath

-

Complex Replacement

Apps Used Within the SAP Fiori launchpad

Register your local UI5 reuse components and UI5 libraries in the manifest.json under sap.ui5/componentUsages and sap.ui5/dependencies/libs, respectively. For more information, see Manifest (Descriptor for Applications, Components, and Libraries) and Manifest Dependencies to Libraries and Components.

Standalone Apps

jQuery.sap.registerModulePath can also be replaced with data-sap-ui-resource-roots in the index.html.

To load resources from a third-party server, use

sap.ui.loader.config({paths:{"myPath": "some/path"}});

jQuery.sap.registerResourcePath

-

Complex Replacement

Apps Used Within the SAP Fiori launchpad

Register your local UI5 reuse components and UI5 libraries in the manifest.json under sap.ui5/componentUsages and sap.ui5/dependencies/libs, respectively. For more information, see Manifest (Descriptor for Applications, Components, and Libraries) and Manifest Dependencies to Libraries and Components.

Standalone Apps

jQuery.sap.registerResourcePath can also be replaced with data-sap-ui-resource-roots in the index.html.

To load resources from a third-party server, use

sap.ui.loader.config({paths:{"myPath": "some/path"}});

jQuery.sap.measure.add

sap/ui/performance/Measurement

Simple Replacement

Measurement.add

jQuery.sap.measure.average

sap/ui/performance/Measurement

Simple Replacement

Measurement.average

jQuery.sap.measure.clear

sap/ui/performance/Measurement

Simple Replacement

Measurement.clear

jQuery.sap.measure.end

sap/ui/performance/Measurement

Simple Replacement

Measurement.end

jQuery.sap.measure.filterMeasurements

sap/ui/performance/Measurement

Simple Replacement

Measurement.filterMeasurements

jQuery.sap.measure.getActive

sap/ui/performance/Measurement

Simple Replacement

Measurement.getActive

jQuery.sap.measure.getAllMeasurements

sap/ui/performance/Measurement

Simple Replacement

Measurement.getAllMeasurements

jQuery.sap.measure.getMeasurement

sap/ui/performance/Measurement

Simple Replacement

Measurement.getMeasurement

jQuery.sap.measure.pause

sap/ui/performance/Measurement

Simple Replacement

Measurement.pause

jQuery.sap.measure.registerMethod

sap/ui/performance/Measurement

Simple Replacement

Measurement.registerMethod

jQuery.sap.measure.remove

sap/ui/performance/Measurement

Simple Replacement

Measurement.remove

jQuery.sap.measure.resume

sap/ui/performance/Measurement

Simple Replacement

Measurement.resume

jQuery.sap.measure.setActive

sap/ui/performance/Measurement

Simple Replacement

Measurement.setActive

jQuery.sap.measure.start

sap/ui/performance/Measurement

Simple Replacement

Measurement.start

jQuery.sap.measure.unregisterAllMethods

sap/ui/performance/Measurement

Simple Replacement

Measurement.unregisterAllMethods

jQuery.sap.measure.unregisterMethod

sap/ui/performance/Measurement

Simple Replacement

Measurement.unregisterMethod

jQuery.sap.fesr.getActive

sap/ui/performance/trace/FESR

Simple Replacement

FESR.getActive

jQuery.sap.fesr.setActive

sap/ui/performance/trace/FESR

Simple Replacement

FESR.setActive

jQuery.sap.fesr.addBusyDuration

sap/ui/performance/trace/Interaction

Simple Replacement

Interaction.addBusyDuration

jQuery.sap.interaction.*

sap/ui/performance/trace/Interaction

Method changed

Interaction.*

jQuery.sap.measure.clearInteractionMeasurements

sap/ui/performance/trace/Interaction

Method changed

Interaction.clear

jQuery.sap.measure.endInteraction

sap/ui/performance/trace/Interaction

Method changed

Interaction.end

jQuery.sap.measure.filterInteractionMeasurements

sap/ui/performance/trace/Interaction

Method changed

Interaction.filter

jQuery.sap.measure.getAllInteractionMeasurements

sap/ui/performance/trace/Interaction

Method changed

Interaction.getAll

jQuery.sap.measure.getPendingInteractionMeasurement

sap/ui/performance/trace/Interaction

Method changed

Interaction.getPending

jQuery.sap.measure.startInteraction

sap/ui/performance/trace/Interaction

Method changed

Interaction.start

jQuery.sap.fesr.getCurrentTransactionId

sap/ui/performance/trace/Passport

Method changed

Passport.getTransactionId

jQuery.sap.fesr.getRootId

sap/ui/performance/trace/Passport

Method changed

Passport.getRootId

jQuery.sap.passport.*

sap/ui/performance/trace/Passport

Simple replacement

Passport.*

jQuery.sap.getModulePath

-

Complex replacement

sap.ui.require.toUrl("some/path/to/module.js");

jQuery.sap.getResourcePath

-

Complex replacement

sap.ui.require.toUrl("some/path/to/resource.json");

jQuery.sap.FrameOptions

sap/ui/security/FrameOptions

Simple replacement

FrameOptions

jQuery.sap.act

sap/ui/util/ActivityDetection

Simple replacement

ActivityDetection

jQuery.sap.initMobile

sap/ui/util/Mobile

Method changed

Mobile.init

jQuery.sap.setIcons

sap/ui/util/Mobile

Simple replacement

Mobile.setIcons

jQuery.sap.setMobileWebAppCapable

sap/ui/util/Mobile

Simple replacement

Mobile.setWebAppCabable

jQuery.sap.storage

sap/ui/util/Storage

Method changed

Storage

jQuery.sap.storage.Type.*

sap/ui/util/Storage

Simple replacement

Storage.Type

jQuery.sap.getParseError

sap/ui/util/XMLHelper

Simple replacement

Helper.getParseError

jQuery.sap.parseXML

sap/ui/util/XMLHelper

Method changed

Helper.parse

jQuery.sap.serializeXML

sap/ui/util/XMLHelper

Method changed

Helper.serialize


Replacement with Native Browser APIs

Old API Call

New Native Replacement

jQuery.device.is.standalone

window.navigator.standalone

jQuery.inArray

var b = (aElements ? Array.prototype.indexOf.call(aElements, 4) : -1);

jQuery.isArray

Array.isArray

jQuery.sap.clearDelayedCall

window.clearTimout

jQuery.sap.clearIntervalCall

window.clearInterval

jQuery.sap.delayedCall

window.setTimeout

jQuery.sap.domById

window.document.getElementById

jQuery.sap.endsWith

sMyString.endsWith("abc")

jQuery.sap.endsWithIgnoreCase

sMyString.toLowerCase().endsWith(sMyOtherString.toLowerCase())

jQuery.sap.getter

function(value) { return function() { return value; }; }(myValue);

jQuery.sap.intervalCall

window.setInterval

jQuery.sap.isEqualNode

Node.isEqualNode

jQuery.sap.newObject

Object.create

jQuery.sap.padLeft

"a".padStart(110, "0");

jQuery.sap.padRight

"a".padEnd(110, "0");

jQuery.sap.resources.isBundle

instanceof

jQuery.sap.startsWith

sMyString.startsWith("abc");

jQuery.sap.startsWithIgnoreCase

sMyString.toLowerCase().startsWith(sMyOtherString.toLowerCase())

jQuery.support.retina

window.devicePixelRatio >= 2

jQuery Extensions Dependencies

jQuery extensions have been extracted into different modules. If the jQuery extension is required, it needs to be added to the module dependencies.

Example:

Change from the global dependencies to adding the module dependencies to the jQuery extensions:

Previously the dependency was global

Dependencies should be added

sap.ui.define([], function() {
  var oDomRef = jQuery("#myElement").firstFocusableDomRef();
});
sap.ui.define(["sap/ui/thirdparty/jquery", "sap/ui/dom/jquery/Focusable"], function(jQuery) {
  var oDomRef = jQuery("#myElement").firstFocusableDomRef();
});

jQuery Call

Old Module

New Module

jQuery.*

jQuery.sap.global

sap/ui/thirdparty/jquery

jQuery.position

jQuery.sap.global

sap/ui/thirdparty/jqueryui/jquery-ui-position

jQuery.fn.control

jquery.sap.ui

Element.closestTo in sap/ui/core/Element

jQuery.fn.addLabelledBy

jquery.sap.dom

sap/ui/dom/jquery/Aria

jQuery.fn.removeLabelledBy

jquery.sap.dom

sap/ui/dom/jquery/Aria

jQuery.fn.addDescribedBy

jquery.sap.dom

sap/ui/dom/jquery/Aria

jQuery.fn.removeDescribedBy

jquery.sap.dom

sap/ui/dom/jquery/Aria

jQuery.fn.cursorPos

jquery.sap.dom

sap/ui/dom/jquery/cursorPos

jQuery.fn.firstFocusableDomRef

jquery.sap.dom

sap/ui/dom/jquery/Focusable

jQuery.fn.lastFocusableDomRef

jquery.sap.dom

sap/ui/dom/jquery/Focusable

jQuery.fn.getSelectedText

jquery.sap.dom

sap/ui/dom/jquery/getSelectedText

jQuery.fn.hasTabIndex

jquery.sap.dom

sap/ui/dom/jquery/hasTabIndex

jQuery.fn.parentByAttribute

jquery.sap.dom

sap/ui/dom/jquery/parentByAttribute

jQuery.fn.rect

jquery.sap.dom

sap/ui/dom/jquery/rect

jQuery.fn.rectContains

jquery.sap.dom

sap/ui/dom/jquery/rectContains

jQuery.fn.scrollLeftRTL

jquery.sap.dom

sap/ui/dom/jquery/scrollLeftRTL

jQuery.fn.scrollRightRTL

jquery.sap.dom

sap/ui/dom/jquery/scrollRightRTL

jQuery.fn.enableSelection

jquery.sap.dom

sap/ui/dom/jquery/Selection

jQuery.fn.disableSelection

jquery.sap.dom

sap/ui/dom/jquery/Selection

:sapTabbable, :focusable, :sapFocusable

jquery.sap.dom

sap/ui/dom/jquery/Selectors

jQuery.fn.selectText

jquery.sap.dom

sap/ui/dom/jquery/selectText

jQuery.fn.zIndex

jquery.sap.dom

sap/ui/dom/jquery/zIndex