|
| 1 | +<!-- loio799291a4be7542c9a0a96ba425d0dec2 --> |
| 2 | + |
| 3 | +# What's New in SAPUI5 1.108 |
| 4 | + |
| 5 | +With this release SAPUI5 is upgraded from version 1.107 to 1.108. |
| 6 | + |
| 7 | + |
| 8 | + |
| 9 | +<a name="loio799291a4be7542c9a0a96ba425d0dec2__section_pzq_t5d_s5b"/> |
| 10 | + |
| 11 | +## Preview and Announcements |
| 12 | + |
| 13 | +The following information concerns important upcoming changes. UI changes may have an impact on the user experience and may require test cases to be adapted. |
| 14 | + |
| 15 | + |
| 16 | +<table> |
| 17 | +<tr> |
| 18 | +<th valign="top"> |
| 19 | + |
| 20 | +Type |
| 21 | + |
| 22 | + |
| 23 | + |
| 24 | +</th> |
| 25 | +<th valign="top"> |
| 26 | + |
| 27 | +Description |
| 28 | + |
| 29 | + |
| 30 | + |
| 31 | +</th> |
| 32 | +<th valign="top"> |
| 33 | + |
| 34 | +Available as of SAPUI5 Version |
| 35 | + |
| 36 | + |
| 37 | + |
| 38 | +</th> |
| 39 | +</tr> |
| 40 | +<tr> |
| 41 | +<td valign="top"> |
| 42 | + |
| 43 | +Announcement |
| 44 | + |
| 45 | + |
| 46 | + |
| 47 | +</td> |
| 48 | +<td valign="top"> |
| 49 | + |
| 50 | +**Reminder: Outdated SAPUI5 Versions to Be Removed from the CDN** |
| 51 | + |
| 52 | +For security reasons, SAPUI5 versions that are no longer maintained will be removed from the UI5 content delivery network \(CDN\) one year after their end of maintenance. If a version is still in maintenance, patches of that version that are older than one year will also be removed. We have noted that a number of customers are still using such outdated versions or patches. If this affects you, please note that once these versions or patches are removed, your applications will break. Please update to a more recent version or patch. For more information, see: [Removing Outdated UI5 Versions from UI5 CDN](https://blogs.sap.com/2021/01/26/removing-outdated-ui5-versions-from-ui5-cdn/) as well as the UI5 notifications in the Demo Kit. |
| 53 | + |
| 54 | + |
| 55 | + |
| 56 | +</td> |
| 57 | +<td valign="top"> |
| 58 | + |
| 59 | +n/a |
| 60 | + |
| 61 | + |
| 62 | + |
| 63 | +</td> |
| 64 | +</tr> |
| 65 | +<tr> |
| 66 | +<td valign="top"> |
| 67 | + |
| 68 | +UI Change |
| 69 | + |
| 70 | + |
| 71 | + |
| 72 | +</td> |
| 73 | +<td valign="top"> |
| 74 | + |
| 75 | +**Analytical List Pages: Date Ranges Supported** |
| 76 | + |
| 77 | +Filter fields on analytical list pages now provide date range options. |
| 78 | + |
| 79 | + |
| 80 | + |
| 81 | +</td> |
| 82 | +<td valign="top"> |
| 83 | + |
| 84 | +1.108 |
| 85 | + |
| 86 | + |
| 87 | + |
| 88 | +</td> |
| 89 | +</tr> |
| 90 | +</table> |
| 91 | + |
| 92 | +> ### Note: |
| 93 | +> Content marked as **Preview** is provided as a courtesy, without a warranty, and may be subject to change. For more information, see the [preview disclaimer](https://help.sap.com/viewer/wnp_disclaimer). |
| 94 | +
|
| 95 | + |
| 96 | + |
| 97 | +<a name="loio799291a4be7542c9a0a96ba425d0dec2__section_qwl_pb5_zcb"/> |
| 98 | + |
| 99 | +## Improved Features |
| 100 | + |
| 101 | + |
| 102 | +<table> |
| 103 | +<tr> |
| 104 | +<td valign="top"> |
| 105 | + |
| 106 | +**Replacement for `jQuery.fn.control`** |
| 107 | + |
| 108 | +To become more independent from specific jQuery functionality, we now provide the new `sap.ui.core.Element#closestTo` method as a replacement for the `jQuery.fn.control` extension function, which is commonly used to retrieve the nearest SAPUI5 control that wraps a given DOM element. The new method returns a single SAPUI5 element instead of the array of SAPUI5 elements returned by `jQuery.fn.control`. You might therefore need to add an outer loop when migrating your code to the new API. |
| 109 | + |
| 110 | +For more information, see [Legacy jQuery.sap Replacement](../04_Essentials/legacy-jquery-sap-replacement-a075ed8.md)and the [API Reference](https://ui5.sap.com/#/api/sap.ui.core.Element/methods/sap.ui.core.Element.closestTo). |
| 111 | + |
| 112 | + |
| 113 | + |
| 114 | +</td> |
| 115 | +</tr> |
| 116 | +<tr> |
| 117 | +<td valign="top"> |
| 118 | + |
| 119 | +**SAPUI5 OData V2 Model** |
| 120 | + |
| 121 | +The new version of the SAPUI5 OData V2 model introduces the following features: |
| 122 | + |
| 123 | +- We now support "deep create" requests for navigation properties of cardinality "many". For more information, see [Deep Create](../04_Essentials/odata-v2-model-6c47b2b.md#loio4c4cd99af9b14e08bb72470cc7cabff4__section_DCR). |
| 124 | +- We now provide the new `sap.ui.model.ClientTreeBinding#getCount` method.For more information, see the [API Reference](https://ui5.sap.com/#/api/sap.ui.model.ClientTreeBinding/methods/getCount). |
| 125 | +- When you use an `sap.ui.model.type.Currency`, `sap.ui.model.odata.type.Currency`, or the currency instance of `sap.ui.core.format.NumberFormat`, entered currency codes are now parsed case-insensitively where possible. |
| 126 | +- We have introduced the new `calendarWeekNumbering` format option for `sap.ui.core.format.DateFormat`. |
| 127 | + |
| 128 | + |
| 129 | + |
| 130 | +</td> |
| 131 | +</tr> |
| 132 | +<tr> |
| 133 | +<td valign="top"> |
| 134 | + |
| 135 | +**SAPUI5 OData V4 Model** |
| 136 | + |
| 137 | +The new version of the SAPUI5 OData V4 model introduces the following features: |
| 138 | + |
| 139 | +- We now provide "deferred delete" requests: You can call the `sap.ui.model.odata.v4.Context#delete` method with an API group; the back-end request is then only sent when `ODataModel#submitBatch` is called for this API group. For more information, see [Deleting an Entity](../04_Essentials/deleting-an-entity-2613ebc.md). |
| 140 | +- We have improved our documentation of how to overwrite value list annotations in local annotation files. For more information, see [Value Lists](../04_Essentials/value-lists-ab267a6.md). |
| 141 | +- The `dataRequested` and `dataReceived` events introduced with SAPUI5 1.106 for the `sap.ui.model.odata.v4.ODataModel` now provide the path for additional property requests.For more information, see the API Reference for [`ODataModel.dataReceived`](https://ui5.sap.com/#/api/sap.ui.model.odata.v4.ODataModel/events/dataReceived) and [`ODataModel.dataRequested`](https://ui5.sap.com/#/api/sap.ui.model.odata.v4.ODataModel/events/dataRequested). |
| 142 | + |
| 143 | + |
| 144 | + |
| 145 | +</td> |
| 146 | +</tr> |
| 147 | +<tr> |
| 148 | +<td valign="top"> |
| 149 | + |
| 150 | +**Visualization of Changes in Key User Adaptation** |
| 151 | + |
| 152 | +When visualizing UI changes in key user adaptation, key users can now filter for unsaved changes. On platforms where the draft feature is available, key users can also filter for draft changes. |
| 153 | + |
| 154 | +See the [Demo App](https://ui5.sap.com/test-resources/sap/ui/demoapps/demokit/rta/freestyle/test/flpSandbox.html?sap-ui-theme=sap_horizon#masterDetail-display). |
| 155 | + |
| 156 | + |
| 157 | + |
| 158 | +</td> |
| 159 | +</tr> |
| 160 | +</table> |
| 161 | + |
| 162 | + |
| 163 | + |
| 164 | +<a name="loio799291a4be7542c9a0a96ba425d0dec2__section_rqn_wd5_zcb"/> |
| 165 | + |
| 166 | +## Improved Controls |
| 167 | + |
| 168 | + |
| 169 | +<table> |
| 170 | +<tr> |
| 171 | +<td valign="top"> |
| 172 | + |
| 173 | +**`sap.m.Avatar`** |
| 174 | + |
| 175 | +Up to three Latin letters can be displayed as initials in a `sap.m.Avatar`. For more information, see the [API Reference](https://ui5.sap.com/#/api/sap.m.Avatar) and the [Sample](https://ui5.sap.com/#/entity/sap.m.Avatar/sample/sap.m.sample.Avatar). |
| 176 | + |
| 177 | + |
| 178 | + |
| 179 | +</td> |
| 180 | +</tr> |
| 181 | +<tr> |
| 182 | +<td valign="top"> |
| 183 | + |
| 184 | +**`sap.m.Carousel`** |
| 185 | + |
| 186 | +We have improved the keyboard interaction and accessibility of the control. The initial focus is now on the active carousel item, unlike before, when it was on the carousel container. This allows you to focus on a concrete item and provides more information to the screen readers.For more information, see the [Sample](https://ui5.sap.com/#/entity/sap.m.Carousel/sample/sap.m.sample.CarouselWithMorePages). |
| 187 | + |
| 188 | + |
| 189 | + |
| 190 | +</td> |
| 191 | +</tr> |
| 192 | +<tr> |
| 193 | +<td valign="top"> |
| 194 | + |
| 195 | +**`sap.m.IllustratedMessage`** |
| 196 | + |
| 197 | +We have introduced a new illustration breakpoint variant `Dot`, suitable for spaces that don't have a lot of vertical space. For more information, see the [API Reference](https://ui5.sap.com/#/api/sap.m.IllustratedMessageSize). |
| 198 | + |
| 199 | + |
| 200 | + |
| 201 | +</td> |
| 202 | +</tr> |
| 203 | +<tr> |
| 204 | +<td valign="top"> |
| 205 | + |
| 206 | +**`sap.ui.comp.smarttable.SmartTable` and `sap.ui.comp.smartchart.SmartChart`** |
| 207 | + |
| 208 | +To improve the user experience, we have changed the filter panel in the table personalization dialog. |
| 209 | + |
| 210 | +Until now, the user had to add each filtering operator on a new line: |
| 211 | + |
| 212 | +  |
| 213 | + |
| 214 | +As of now, there is a value help available for the input field and all selected filtering operators are displayed in one line per each filtered column: |
| 215 | + |
| 216 | +  |
| 217 | + |
| 218 | +For more information, see the [Sample](https://ui5.sap.com/#/entity/sap.ui.comp.smarttable.SmartTable/sample/sap.ui.comp.sample.smarttable). |
| 219 | + |
| 220 | + |
| 221 | + |
| 222 | +</td> |
| 223 | +</tr> |
| 224 | +<tr> |
| 225 | +<td valign="top"> |
| 226 | + |
| 227 | +**`sap.ui.comp.smarttable.SmartTable`** |
| 228 | + |
| 229 | +- We have enhanced the `customizeConfig` property: It now supports `autoColumnWidth` configuration settings, which influence the automatic calculation of the column width for columns generated by the `SmartTable` control itself. For more information, see the [API Reference](https://ui5.sap.com/#/api/sap.ui.comp.smarttable.SmartTable%23methods/getCustomizeConfig). |
| 230 | + |
| 231 | +- We have enhanced the data export to the cloud: Now it is possible to select a file in a Google Sheets format and export it to a Google Workspace file share. For more information, see the SAP Note [3216632](https://launchpad.support.sap.com/#/notes/3216632). |
| 232 | + |
| 233 | + |
| 234 | + |
| 235 | + |
| 236 | +</td> |
| 237 | +</tr> |
| 238 | +<tr> |
| 239 | +<td valign="top"> |
| 240 | + |
| 241 | +**`sap.ui.integration.widgets.Card`** |
| 242 | + |
| 243 | +- The Adaptive card now uses the recently released 1.7.0 UI5 WebComponents bundle. For more information, see the [Adaptive Card](https://ui5.sap.com/test-resources/sap/ui/integration/demokit/cardExplorer/webapp/index.html#/learn/typesOther/adaptive) Learn section in the Card Explorer. |
| 244 | + |
| 245 | +- You can now configure the visibility of the card footer using the new `visible` boolean property. Card developers can set this property in the manifest. Additionally, they can add it to the `Configuration.js`, which will also enable card administrators, who are using the Configuration editor, to control the visibility of the card footer. For more information, see the [Card Footer](https://ui5.sap.com/test-resources/sap/ui/integration/demokit/cardExplorer/webapp/index.html#/learn/footer) section and the [Sample](https://ui5.sap.com/test-resources/sap/ui/integration/demokit/cardExplorer/webapp/index.html#/explore/footer/hiddenFooter) in the Card Explorer. |
| 246 | + |
| 247 | +- We have made the loading placeholder for Analytical cards more detailed to better reveal the expected loading content. For more information, see the [Sample](https://ui5.sap.com/#/entity/sap.ui.integration.widgets.Card/sample/sap.ui.integration.sample.LazyLoading). |
| 248 | + |
| 249 | +- We have \(experimentally\) enhanced the `sap.ui.integration.Extension` with a new `loadDependencies` lifecycle hook. As a card developer, you can use it to load critical dependencies for your extension, without which the data cannot be displayed. While the dependencies are loaded, the card displays a loading animation. This hook is asynchronous, so other tasks won’t be blocked. For more information, see the [Card Extension](https://ui5.sap.com/test-resources/sap/ui/integration/demokit/cardExplorer/webapp/index.html#/learn/features/extension) section and the [Sample](https://ui5.sap.com/test-resources/sap/ui/integration/demokit/cardExplorer/webapp/index.html#/explore/extension/loadDependencies) in the Card Explorer, and the [API Reference](https://ui5.sap.com/#/api/sap.ui.integration.Extension). |
| 250 | + |
| 251 | +- A new `visible` property is now introduced for icons and avatars to achieve consistency in representation if an empty value for the `src` property is used in the card manifest. The new property is available for: |
| 252 | + |
| 253 | + - Default Header |
| 254 | + - Sap.f.CardHeader |
| 255 | + - ObjectContent |
| 256 | + - TableContent |
| 257 | + - List Content |
| 258 | + |
| 259 | + For more information, see the [Sample](https://ui5.sap.com/test-resources/sap/ui/integration/demokit/cardExplorer/webapp/index.html#/explore/object/iconVisibility) in the Card Explorer. |
| 260 | + |
| 261 | + |
| 262 | + |
| 263 | + |
| 264 | +</td> |
| 265 | +</tr> |
| 266 | +</table> |
| 267 | + |
| 268 | + |
| 269 | + |
| 270 | +<a name="loio799291a4be7542c9a0a96ba425d0dec2__section_cps_cg5_zcb"/> |
| 271 | + |
| 272 | +## Deprecations |
| 273 | + |
| 274 | + |
| 275 | +<table> |
| 276 | +<tr> |
| 277 | +<td valign="top"> |
| 278 | + |
| 279 | +There are currently no major deprecations. For a complete list of all deprecations, see [Deprecated APIs](https://ui5.sap.com/#/api/deprecated). |
| 280 | + |
| 281 | + |
| 282 | + |
| 283 | +</td> |
| 284 | +</tr> |
| 285 | +</table> |
| 286 | + |
| 287 | + |
| 288 | + |
| 289 | +<a name="loio799291a4be7542c9a0a96ba425d0dec2__section_g3r_bf5_zcb"/> |
| 290 | + |
| 291 | +## SAP Fiori Elements |
| 292 | + |
| 293 | + |
| 294 | +<table> |
| 295 | +<tr> |
| 296 | +<td valign="top"> |
| 297 | + |
| 298 | +The following changes and new features are available for SAP Fiori elements for OData V2: |
| 299 | + |
| 300 | +- For controls such as the combo box, checkbox, date picker, or date time picker, a side effect is now triggered as soon as the value is set, instead of when the control is out of focus. For more information, see [Side Effects](../06_SAP_Fiori_Elements/side-effects-18b17bd.md). |
| 301 | + |
| 302 | +- The analytical list page now supports the dynamic date range in `SmartFilterBar`. For more information, see [Enabling Semantic Operators in the Filter Bar](../06_SAP_Fiori_Elements/enabling-semantic-operators-in-the-filter-bar-fef65d0.md). |
| 303 | + |
| 304 | +- The section title is now hidden in cases where the section contains only a table or a chart, and their title is a duplicate of the section title. For more information, see [Defining and Adapting Sections](../06_SAP_Fiori_Elements/defining-and-adapting-sections-facfea0.md). |
| 305 | + |
| 306 | + |
| 307 | + |
| 308 | + |
| 309 | +</td> |
| 310 | +</tr> |
| 311 | +<tr> |
| 312 | +<td valign="top"> |
| 313 | + |
| 314 | +The following changes and new features are available for SAP Fiori elements for OData V4: |
| 315 | + |
| 316 | +- You can now define exactly which application links are shown in the *Related Apps* menu. For more information, see [Enabling the Related Apps Button](../06_SAP_Fiori_Elements/enabling-the-related-apps-button-8dcfe2e.md). |
| 317 | + |
| 318 | +- You can now execute the `PrepareAction` or global side effects by pressing *Enter* in draft mode. For more information, see [Draft Handling](../06_SAP_Fiori_Elements/draft-handling-ed9aa41.md). |
| 319 | + |
| 320 | +- You can now add a custom message in the message bar above a table in the list report. For more information, see [Adding a Custom Message Strip to List Report, Analytical List Page and Object Page Tables](../06_SAP_Fiori_Elements/adding-a-custom-message-strip-to-list-report-analytical-list-page-and-object-page-tables-0fdbefb.md). |
| 321 | + |
| 322 | +- You can now render semantically connected fields as a link to enable navigation using these fields. For more information, see [Grouping of Fields](../06_SAP_Fiori_Elements/grouping-of-fields-cb1748e.md). |
| 323 | + |
| 324 | +- We now provide a keyboard shortcut to trigger the default positive action in a list report, object page, and subobject page. For more information, see [Keyboard Shortcuts](../06_SAP_Fiori_Elements/keyboard-shortcuts-0cd318c.md). |
| 325 | + |
| 326 | +- We now provide an option to skip the *Create* pop-up dialog for new actions in specific cases. For more information, see [Handling of the preferredMode Parameter](../06_SAP_Fiori_Elements/handling-of-the-preferredmode-parameter-bfaf3cc.md). |
| 327 | + |
| 328 | +- On mobile devices, header facets are now arranged horizontally and can be accessed via horizontal scrolling. For more information, see [Header Facets](../06_SAP_Fiori_Elements/header-facets-17dbd5b.md). |
| 329 | + |
| 330 | + |
| 331 | + |
| 332 | + |
| 333 | +</td> |
| 334 | +</tr> |
| 335 | +</table> |
| 336 | + |
| 337 | + |
| 338 | + |
| 339 | +<a name="loio799291a4be7542c9a0a96ba425d0dec2__section_r5v_3h5_zcb"/> |
| 340 | + |
| 341 | +## Demo Kit Improvements |
| 342 | + |
| 343 | + |
| 344 | +<table> |
| 345 | +<tr> |
| 346 | +<td valign="top"> |
| 347 | + |
| 348 | +**TypeScript Demo App** |
| 349 | + |
| 350 | +A new `TypeScript To-Do List` demo app is now available in both the Demo Apps and the Samples sections of the Demo Kit. For more information, see the [Samples](https://ui5.sap.com/#/entity/sap.m.sample.TsTodos). |
| 351 | + |
| 352 | + |
| 353 | + |
| 354 | +</td> |
| 355 | +</tr> |
| 356 | +</table> |
| 357 | + |
0 commit comments