@ui5/mcp-server 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (221) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/LICENSE +201 -0
  3. package/LICENSES/Apache-2.0.txt +73 -0
  4. package/README.md +131 -0
  5. package/bin/ui5mcp.js +2 -0
  6. package/lib/Context.d.ts +28 -0
  7. package/lib/Context.js +71 -0
  8. package/lib/Context.js.map +1 -0
  9. package/lib/api.d.ts +3 -0
  10. package/lib/api.js +3 -0
  11. package/lib/api.js.map +1 -0
  12. package/lib/cli.d.ts +1 -0
  13. package/lib/cli.js +12 -0
  14. package/lib/cli.js.map +1 -0
  15. package/lib/registerTools.d.ts +133 -0
  16. package/lib/registerTools.js +59 -0
  17. package/lib/registerTools.js.map +1 -0
  18. package/lib/resources/documentation/getDocumentation.d.ts +18 -0
  19. package/lib/resources/documentation/getDocumentation.js +70 -0
  20. package/lib/resources/documentation/getDocumentation.js.map +1 -0
  21. package/lib/server.d.ts +10 -0
  22. package/lib/server.js +113 -0
  23. package/lib/server.js.map +1 -0
  24. package/lib/tools/create_ui5_app/ODataMetadata.d.ts +55 -0
  25. package/lib/tools/create_ui5_app/ODataMetadata.js +99 -0
  26. package/lib/tools/create_ui5_app/ODataMetadata.js.map +1 -0
  27. package/lib/tools/create_ui5_app/createSuccessMessage.d.ts +13 -0
  28. package/lib/tools/create_ui5_app/createSuccessMessage.js +45 -0
  29. package/lib/tools/create_ui5_app/createSuccessMessage.js.map +1 -0
  30. package/lib/tools/create_ui5_app/create_ui5_app.d.ts +8 -0
  31. package/lib/tools/create_ui5_app/create_ui5_app.js +273 -0
  32. package/lib/tools/create_ui5_app/create_ui5_app.js.map +1 -0
  33. package/lib/tools/create_ui5_app/index.d.ts +3 -0
  34. package/lib/tools/create_ui5_app/index.js +58 -0
  35. package/lib/tools/create_ui5_app/index.js.map +1 -0
  36. package/lib/tools/create_ui5_app/isValidUrl.d.ts +16 -0
  37. package/lib/tools/create_ui5_app/isValidUrl.js +59 -0
  38. package/lib/tools/create_ui5_app/isValidUrl.js.map +1 -0
  39. package/lib/tools/create_ui5_app/schema.d.ts +135 -0
  40. package/lib/tools/create_ui5_app/schema.js +67 -0
  41. package/lib/tools/create_ui5_app/schema.js.map +1 -0
  42. package/lib/tools/create_ui5_app/templateProcessor.d.ts +67 -0
  43. package/lib/tools/create_ui5_app/templateProcessor.js +59 -0
  44. package/lib/tools/create_ui5_app/templateProcessor.js.map +1 -0
  45. package/lib/tools/create_ui5_app/ui5Version.d.ts +2 -0
  46. package/lib/tools/create_ui5_app/ui5Version.js +6 -0
  47. package/lib/tools/create_ui5_app/ui5Version.js.map +1 -0
  48. package/lib/tools/get_api_reference/createUriForSymbol.d.ts +2 -0
  49. package/lib/tools/get_api_reference/createUriForSymbol.js +49 -0
  50. package/lib/tools/get_api_reference/createUriForSymbol.js.map +1 -0
  51. package/lib/tools/get_api_reference/getApiReference.d.ts +10 -0
  52. package/lib/tools/get_api_reference/getApiReference.js +51 -0
  53. package/lib/tools/get_api_reference/getApiReference.js.map +1 -0
  54. package/lib/tools/get_api_reference/index.d.ts +3 -0
  55. package/lib/tools/get_api_reference/index.js +38 -0
  56. package/lib/tools/get_api_reference/index.js.map +1 -0
  57. package/lib/tools/get_api_reference/lib/ApiReferenceProvider.d.ts +85 -0
  58. package/lib/tools/get_api_reference/lib/ApiReferenceProvider.js +452 -0
  59. package/lib/tools/get_api_reference/lib/ApiReferenceProvider.js.map +1 -0
  60. package/lib/tools/get_api_reference/lib/apiReferenceResources.d.ts +18 -0
  61. package/lib/tools/get_api_reference/lib/apiReferenceResources.js +138 -0
  62. package/lib/tools/get_api_reference/lib/apiReferenceResources.js.map +1 -0
  63. package/lib/tools/get_api_reference/lib/formatSymbol.d.ts +24 -0
  64. package/lib/tools/get_api_reference/lib/formatSymbol.js +109 -0
  65. package/lib/tools/get_api_reference/lib/formatSymbol.js.map +1 -0
  66. package/lib/tools/get_api_reference/schema.d.ts +16 -0
  67. package/lib/tools/get_api_reference/schema.js +12 -0
  68. package/lib/tools/get_api_reference/schema.js.map +1 -0
  69. package/lib/tools/get_guidelines/guidelines.d.ts +1 -0
  70. package/lib/tools/get_guidelines/guidelines.js +6 -0
  71. package/lib/tools/get_guidelines/guidelines.js.map +1 -0
  72. package/lib/tools/get_guidelines/index.d.ts +3 -0
  73. package/lib/tools/get_guidelines/index.js +30 -0
  74. package/lib/tools/get_guidelines/index.js.map +1 -0
  75. package/lib/tools/get_project_info/getProjectInfo.d.ts +2 -0
  76. package/lib/tools/get_project_info/getProjectInfo.js +205 -0
  77. package/lib/tools/get_project_info/getProjectInfo.js.map +1 -0
  78. package/lib/tools/get_project_info/index.d.ts +3 -0
  79. package/lib/tools/get_project_info/index.js +28 -0
  80. package/lib/tools/get_project_info/index.js.map +1 -0
  81. package/lib/tools/get_project_info/schema.d.ts +87 -0
  82. package/lib/tools/get_project_info/schema.js +28 -0
  83. package/lib/tools/get_project_info/schema.js.map +1 -0
  84. package/lib/tools/get_version_info/getVersionInfo.d.ts +8 -0
  85. package/lib/tools/get_version_info/getVersionInfo.js +41 -0
  86. package/lib/tools/get_version_info/getVersionInfo.js.map +1 -0
  87. package/lib/tools/get_version_info/index.d.ts +9 -0
  88. package/lib/tools/get_version_info/index.js +33 -0
  89. package/lib/tools/get_version_info/index.js.map +1 -0
  90. package/lib/tools/get_version_info/schema.d.ts +66 -0
  91. package/lib/tools/get_version_info/schema.js +16 -0
  92. package/lib/tools/get_version_info/schema.js.map +1 -0
  93. package/lib/tools/get_version_info/types.d.ts +5 -0
  94. package/lib/tools/get_version_info/types.js +2 -0
  95. package/lib/tools/get_version_info/types.js.map +1 -0
  96. package/lib/tools/run_ui5_linter/index.d.ts +3 -0
  97. package/lib/tools/run_ui5_linter/index.js +86 -0
  98. package/lib/tools/run_ui5_linter/index.js.map +1 -0
  99. package/lib/tools/run_ui5_linter/migrationGuides.d.ts +6 -0
  100. package/lib/tools/run_ui5_linter/migrationGuides.js +88 -0
  101. package/lib/tools/run_ui5_linter/migrationGuides.js.map +1 -0
  102. package/lib/tools/run_ui5_linter/resultContext.d.ts +3 -0
  103. package/lib/tools/run_ui5_linter/resultContext.js +236 -0
  104. package/lib/tools/run_ui5_linter/resultContext.js.map +1 -0
  105. package/lib/tools/run_ui5_linter/runUi5Linter.d.ts +2 -0
  106. package/lib/tools/run_ui5_linter/runUi5Linter.js +72 -0
  107. package/lib/tools/run_ui5_linter/runUi5Linter.js.map +1 -0
  108. package/lib/tools/run_ui5_linter/schema.d.ts +340 -0
  109. package/lib/tools/run_ui5_linter/schema.js +55 -0
  110. package/lib/tools/run_ui5_linter/schema.js.map +1 -0
  111. package/lib/utils/cdnHelper.d.ts +9 -0
  112. package/lib/utils/cdnHelper.js +50 -0
  113. package/lib/utils/cdnHelper.js.map +1 -0
  114. package/lib/utils/dataStorageHelper.d.ts +2 -0
  115. package/lib/utils/dataStorageHelper.js +65 -0
  116. package/lib/utils/dataStorageHelper.js.map +1 -0
  117. package/lib/utils/ui5Framework.d.ts +4 -0
  118. package/lib/utils/ui5Framework.js +6 -0
  119. package/lib/utils/ui5Framework.js.map +1 -0
  120. package/lib/utils.d.ts +10 -0
  121. package/lib/utils.js +87 -0
  122. package/lib/utils.js.map +1 -0
  123. package/npm-shrinkwrap.json +7880 -0
  124. package/package.json +121 -0
  125. package/resources/docs/1.136.7/00737d6c1b864dc3ab72ef56611491c4.md +155 -0
  126. package/resources/docs/1.136.7/0187ea5e2eff4166b0453b9dcc8fc64f.md +164 -0
  127. package/resources/docs/1.136.7/032be2cb2e1d4115af20862673bedcdb.md +12 -0
  128. package/resources/docs/1.136.7/28fcd55b04654977b63dacbee0552712.md +317 -0
  129. package/resources/docs/1.136.7/676b636446c94eada183b1218a824717.md +135 -0
  130. package/resources/docs/1.136.7/a87ca843bcee469f82a9072927a7dcdb.md +355 -0
  131. package/resources/docs/1.136.7/b0fb4de7364f4bcbb053a99aa645affe.md +126 -0
  132. package/resources/docs/1.136.7/fe1a6dba940e479fb7c3bc753f92b28c.md +670 -0
  133. package/resources/docs/1.136.7/index.json +58 -0
  134. package/resources/guidelines.md +104 -0
  135. package/resources/migrationGuides/deprecated-controller-factory.md +116 -0
  136. package/resources/migrationGuides/deprecated-getLibraryResourceBundle.md +62 -0
  137. package/resources/migrationGuides/deprecated-jquery-sap-require.md +141 -0
  138. package/resources/migrationGuides/deprecated-messagePage.md +162 -0
  139. package/resources/migrationGuides/deprecated-table-table-property.md +154 -0
  140. package/resources/template-js/LICENSE +201 -0
  141. package/resources/template-js/README.md +87 -0
  142. package/resources/template-js/_.editorconfig +22 -0
  143. package/resources/template-js/_.gitignore +17 -0
  144. package/resources/template-js/eslint.config.js +68 -0
  145. package/resources/template-js/karma-ci-cov.conf.js +20 -0
  146. package/resources/template-js/karma-ci.conf.js +9 -0
  147. package/resources/template-js/karma.conf.js +9 -0
  148. package/resources/template-js/package.json +34 -0
  149. package/resources/template-js/ui5-dist.yaml +18 -0
  150. package/resources/template-js/ui5.yaml +24 -0
  151. package/resources/template-js/webapp/Component.js +41 -0
  152. package/resources/template-js/webapp/controller/App.controller.js +10 -0
  153. package/resources/template-js/webapp/controller/BaseController.js +67 -0
  154. package/resources/template-js/webapp/controller/Main.controller.js +14 -0
  155. package/resources/template-js/webapp/i18n/i18n.properties +3 -0
  156. package/resources/template-js/webapp/i18n/i18n_en.properties +3 -0
  157. package/resources/template-js/webapp/index-cdn.html +34 -0
  158. package/resources/template-js/webapp/index.html +34 -0
  159. package/resources/template-js/webapp/manifest.json +103 -0
  160. package/resources/template-js/webapp/model/formatter.js +9 -0
  161. package/resources/template-js/webapp/model/models.js +11 -0
  162. package/resources/template-js/webapp/test/Test.qunit.html +16 -0
  163. package/resources/template-js/webapp/test/integration/HelloJourney.js +85 -0
  164. package/resources/template-js/webapp/test/integration/opaTests.qunit.js +1 -0
  165. package/resources/template-js/webapp/test/integration/pages/Main.js +112 -0
  166. package/resources/template-js/webapp/test/testsuite.qunit.html +18 -0
  167. package/resources/template-js/webapp/test/testsuite.qunit.js +37 -0
  168. package/resources/template-js/webapp/test/unit/controller/Main.qunit.js +11 -0
  169. package/resources/template-js/webapp/test/unit/unitTests.qunit.js +1 -0
  170. package/resources/template-js/webapp/test-lt1_124/integration/HelloJourney.js +85 -0
  171. package/resources/template-js/webapp/test-lt1_124/integration/opaTests.qunit.html +31 -0
  172. package/resources/template-js/webapp/test-lt1_124/integration/opaTests.qunit.js +11 -0
  173. package/resources/template-js/webapp/test-lt1_124/integration/pages/Main.js +112 -0
  174. package/resources/template-js/webapp/test-lt1_124/testsuite.qunit.html +13 -0
  175. package/resources/template-js/webapp/test-lt1_124/testsuite.qunit.js +9 -0
  176. package/resources/template-js/webapp/test-lt1_124/unit/controller/Main.qunit.js +11 -0
  177. package/resources/template-js/webapp/test-lt1_124/unit/unitTests.qunit.html +30 -0
  178. package/resources/template-js/webapp/test-lt1_124/unit/unitTests.qunit.js +12 -0
  179. package/resources/template-js/webapp/view/App.view.xml +9 -0
  180. package/resources/template-js/webapp/view/Main.view.xml +90 -0
  181. package/resources/template-ts/LICENSE +201 -0
  182. package/resources/template-ts/README.md +101 -0
  183. package/resources/template-ts/_.editorconfig +23 -0
  184. package/resources/template-ts/_.gitignore +18 -0
  185. package/resources/template-ts/_.nycrc.json +7 -0
  186. package/resources/template-ts/_tsconfig.json +21 -0
  187. package/resources/template-ts/eslint.config.mjs +27 -0
  188. package/resources/template-ts/package.json +40 -0
  189. package/resources/template-ts/ui5-coverage.yaml +40 -0
  190. package/resources/template-ts/ui5-dist.yaml +18 -0
  191. package/resources/template-ts/ui5.yaml +27 -0
  192. package/resources/template-ts/webapp/Component.ts +49 -0
  193. package/resources/template-ts/webapp/controller/App.controller.ts +11 -0
  194. package/resources/template-ts/webapp/controller/BaseController.ts +83 -0
  195. package/resources/template-ts/webapp/controller/Main.controller.ts +19 -0
  196. package/resources/template-ts/webapp/i18n/i18n.properties +3 -0
  197. package/resources/template-ts/webapp/i18n/i18n_en.properties +3 -0
  198. package/resources/template-ts/webapp/index-cdn.html +35 -0
  199. package/resources/template-ts/webapp/index.html +35 -0
  200. package/resources/template-ts/webapp/manifest.json +105 -0
  201. package/resources/template-ts/webapp/model/formatter.ts +5 -0
  202. package/resources/template-ts/webapp/model/models.ts +15 -0
  203. package/resources/template-ts/webapp/test/Test.qunit.html +16 -0
  204. package/resources/template-ts/webapp/test/integration/HelloJourney.ts +84 -0
  205. package/resources/template-ts/webapp/test/integration/opaTests.qunit.ts +2 -0
  206. package/resources/template-ts/webapp/test/integration/pages/MainPage.ts +112 -0
  207. package/resources/template-ts/webapp/test/testsuite.qunit.html +18 -0
  208. package/resources/template-ts/webapp/test/testsuite.qunit.ts +33 -0
  209. package/resources/template-ts/webapp/test/unit/controller/Main.qunit.ts +8 -0
  210. package/resources/template-ts/webapp/test/unit/unitTests.qunit.ts +2 -0
  211. package/resources/template-ts/webapp/test-lt1_124/integration/HelloJourney.ts +86 -0
  212. package/resources/template-ts/webapp/test-lt1_124/integration/opaTests.qunit.html +34 -0
  213. package/resources/template-ts/webapp/test-lt1_124/integration/opaTests.qunit.ts +8 -0
  214. package/resources/template-ts/webapp/test-lt1_124/integration/pages/MainPage.ts +112 -0
  215. package/resources/template-ts/webapp/test-lt1_124/testsuite.qunit.html +13 -0
  216. package/resources/template-ts/webapp/test-lt1_124/testsuite.qunit.ts +9 -0
  217. package/resources/template-ts/webapp/test-lt1_124/unit/controller/Main.qunit.ts +8 -0
  218. package/resources/template-ts/webapp/test-lt1_124/unit/unitTests.qunit.html +37 -0
  219. package/resources/template-ts/webapp/test-lt1_124/unit/unitTests.qunit.ts +8 -0
  220. package/resources/template-ts/webapp/view/App.view.xml +9 -0
  221. package/resources/template-ts/webapp/view/Main.view.xml +90 -0
@@ -0,0 +1,317 @@
1
+ # Best Practices for Developers
2
+
3
+ This page is a good starting point for you to ensure your code bases, specifically your SAPUI5 applications and libraries, are ready for the future and won't become outdated.
4
+
5
+ **On this page:**
6
+
7
+ - [Best Practices for Legacy-Free Code](best-practices-for-developers-28fcd55.md#loio28fcd55b04654977b63dacbee0552712__section_blfc)
8
+ - [App Development](best-practices-for-developers-28fcd55.md#loio28fcd55b04654977b63dacbee0552712__section_appdev)
9
+ - [Control Development](best-practices-for-developers-28fcd55.md#loio28fcd55b04654977b63dacbee0552712__section_ctrldev)
10
+ - [Library Development](best-practices-for-developers-28fcd55.md#loio28fcd55b04654977b63dacbee0552712__section_libdev)
11
+ - [Testing](best-practices-for-developers-28fcd55.md#loio28fcd55b04654977b63dacbee0552712__section_tst)
12
+
13
+ ## Best Practices for Legacy-Free Code
14
+
15
+ The SAPUI5 framework is always evolving to benefit from newer features in web browsers \(like ECMAScript support\) or to account for their end of maintenance \(like the end of IE11 support\). This is a continuous journey towards future major framework versions and improvements.
16
+
17
+ It is therefore important that you keep applying best practices. To help you, we frequently update the documentation in many places. This page collects fundamental information and offers practical guidance, and it will continue to evolve over time.
18
+
19
+ > ### Note:
20
+ > The following information is a preliminary yet practical collection of best practices to ensure legacy-free SAPUI5 development. We're continuously improving it to reflect our latest recommendations. It will be further enhanced to both help transform existing code bases and provide guidance for creating new code.
21
+
22
+ ### Goals
23
+
24
+ The main objectives when migrating existing code or keeping it up to date with framework best practices are:
25
+
26
+ - **No sync loading of code**
27
+
28
+ This is for compliance with our Content Security Policy. For more information, see [Make Your App CSP Compliant](make-your-app-csp-compliant-1f81a09.md).
29
+
30
+ - **No sync loading of data**
31
+
32
+ This helps avoid deprecation warnings of web browsers regarding sync XHR.
33
+
34
+ - **No use of global names**
35
+
36
+ This helps avoid pollution of the global namespace and conflicts with other code on the page.
37
+
38
+ - **No use of deprecated APIs**
39
+
40
+ This reduces the API surface for easier usage and maintenance.
41
+
42
+ ### Prerequisites
43
+
44
+ Before attempting to migrate or upgrade to a higher SAPUI5 version, make sure that your development does **not** use any undocumented internal framework resources. Also, double check that all compatibility guidelines have been followed, such as those mentioned in [Upgrading](../02_Read-Me-First/upgrading-9638e4f.md).
45
+
46
+ To build and serve your project in accordance with best practices, we recommend using the latest version of [UI5 Tooling](https://sap.github.io/ui5-tooling/).
47
+
48
+ ### Supporting Tool - UI5 Linter
49
+
50
+ [UI5 linter](https://github.com/SAP/ui5-linter) is a command-line tool to identify legacy code in your SAPUI5 project. It checks JavaScript, TypeScript, XML, JSON, and other files in your project and reports findings if legacy code is used. UI5 linter is our state-of-the-art tool to get and keep your SAPUI5 project legacy-free.
51
+
52
+ ### Deprecated APIs
53
+
54
+ In general, **you must not use deprecated APIs** anymore, such as `sap.ui.getCore()`. You can find deprecated APIs in the [API Reference](https://ui5.sap.com/#/api/deprecated), in the [What's New Viewer](https://help.sap.com/whats-new/67f60363b57f4ac0b23efd17fa192d60?Type=Deleted%3BDeprecated), and in the reports by our [Support Assistant](../04_Essentials/support-assistant-57ccd7d.md) and [UI5 linter](https://github.com/SAP/ui5-linter). For new projects, we recommend the use of TypeScript, because usage of deprecated APIs can then be detected easily.
55
+
56
+ Also, see the relevant warnings and errors logged to the browser's dev console during runtime. You might need to increase the `sap-ui-log-level`. For more information, see [Logging and Tracing](../04_Essentials/logging-and-tracing-9f4d62c.md).
57
+
58
+ Some APIs may be only partially deprecated, for instance passing a non-object `vName` to [`sap.ui.core.theming.Parameters.get`](https://ui5.sap.com/#/api/sap.ui.core.theming.Parameters%23methods/sap.ui.core.theming.Parameters.get). Refer to the API Reference for individual APIs. UI5 linter can also help detecting the deprecated usage of such APIs.
59
+
60
+ Using the native web API `XMLHttpRequest#open` with `false` as the third argument outside of workers is also deprecated, and browsers might end its support. Therefore, in addition to avoiding already deprecated SAPUI5 APIs, you must not call low-level APIs such as `jQuery.ajax` with a disabled `async` option either.
61
+
62
+ **Additional Information:**
63
+
64
+ - [Don't Use Deprecated or Experimental Features](don-t-use-deprecated-or-experimental-features-a8bd1a8.md)
65
+ - [Deprecated Core API](../04_Essentials/deprecated-core-api-798dd9a.md)
66
+ - [Deprecated Configuration API](../04_Essentials/deprecated-configuration-api-2acafbf.md)
67
+ - [Use Only Public APIs](use-only-public-apis-b0d5fe2.md)
68
+ - [Adapting to the Modularization of the Core](../04_Essentials/adapting-to-the-modularization-of-the-core-b8fdf0c.md)
69
+ - [Replacement of Deprecated jQuery APIs](../04_Essentials/replacement-of-deprecated-jquery-apis-a075ed8.md)
70
+ - [Deprecated Factories Replacement](../04_Essentials/deprecated-factories-replacement-491bd9c.md)
71
+ - [Synchronous `XMLHttpRequest`](https://xhr.spec.whatwg.org/#the-open()-method)
72
+
73
+ ### Modules
74
+
75
+ **Defining and Requiring Modules**
76
+
77
+ - Avoid accessing modules via global names.
78
+
79
+ - Use `sap.ui.define` for defining a new module, including its eager dependencies.
80
+
81
+ - Use `sap.ui.require` for requiring a module lazily at a later point in time.
82
+
83
+ - Add only valid module IDs from the API Reference \(documented as Module: .../.../...\) to the dependency list.
84
+
85
+
86
+ For more information, see [Best Practices for Loading Modules](../04_Essentials/best-practices-for-loading-modules-00737d6.md).
87
+
88
+ **Third-Party Libraries**
89
+
90
+ When requiring third-party libraries that export global names and support AMD at the same time, ensure having a `shim` with `amd:true` defined via [`sap.ui.loader.config`](https://ui5.sap.com/#/api/sap.ui.loader%23methods/sap.ui.loader.config) beforehand. Use the required module value instead of the global name of the third-party library.
91
+
92
+ **Troubleshooting**
93
+
94
+ Identify and resolve cyclic dependencies with the help of the SAPUI5 configuration parameter `sap-ui-xx-debug-module-loading=true`. Identified modules are logged in the browser console \([F12\]\) with the message '**cycle detected**'. Ensure that the console shows all levels of logs incl. "Verbose" ones to see this message.
95
+
96
+ ## App Development
97
+
98
+ In the following we'll focus on crucial aspects of app development, specifically on asynchronous loading and best practices around Components, Controllers, Views, Fragments, Models, and ResourceBundles.
99
+
100
+ ### Asynchronous Loading
101
+
102
+ - Use asynchronous loading for views, fragments, components, and resource bundles to enhance performance; see, for example, [Deprecated Factories Replacement](../04_Essentials/deprecated-factories-replacement-491bd9c.md).
103
+ - Implement the `sap.ui.core.IAsyncContentCreation` marker interface in your [Component.js file](../04_Essentials/component-controller-27ce0e4.md) to allow the content to be created fully asynchronously and for a stricter handling of certain types of errors during its view processing.
104
+ - Make sure that dependent libraries and components are preloaded before modules from the respective preload are accessed. For example, if the `sap.f.FlexibleColumnLayout` control is part of the root view, `"sap.f": {}` should be included in the `sap.ui5/dependencies/libs` section of the `manifest.json`. Avoid setting `{ "lazy": true }` if the application does not intend to preload the bundle manually. For more information, see [Ensure that Library Preloads are Enabled](../05_Developing_Apps/performance-speed-up-your-app-408b40e.md#loio408b40efed3c416681e1bd8cdd8910d4__section_LibraryPreloads).
105
+
106
+ **Additional Information:**
107
+
108
+ - [Use Asynchronous Loading](use-asynchronous-loading-676b636.md)
109
+ - [Is Your Application Ready for Asynchronous Loading?](is-your-application-ready-for-asynchronous-loading-493a15a.md)
110
+ - [Performance Checklist](performance-checklist-9c6400e.md)
111
+ - [Load Only What You Really Need](load-only-what-you-really-need-e8fca3e.md)
112
+ - [Performance: Speed Up Your App](../05_Developing_Apps/performance-speed-up-your-app-408b40e.md)
113
+
114
+ ### SAPUI5 Object Creation
115
+
116
+ When creating instances of SAPUI5 controls programmatically \(i.e. not declaratively via XML View or Fragment\), then:
117
+
118
+ - Don't use the global name of a control. Require the corresponding module dependency instead.
119
+ - Use `createId` to ensure there are no ID collisions, e.g. [`sap.ui.core.mvc.View#createId`](https://ui5.sap.com/#/api/sap.ui.core.mvc.View%23methods/createId) to prefix the control's ID with the view ID.
120
+
121
+ **Additional Information:**
122
+
123
+ - [Use Stable IDs](use-stable-ids-79e910e.md)
124
+
125
+ ### Data Binding
126
+
127
+ - When creating data binding programmatically, add the data types to the dependency list and create instances on your own. Do **not** specify their global names.
128
+
129
+ - When an [Expression Binding](../04_Essentials/expression-binding-daf6852.md) refers to any of the built-in global symbols `odata.compare`, `odata.fillUriTemplate`, or `odata.uriEncode`, the corresponding modules must be required by the surrounding code \(either via [`template:require`](../04_Essentials/require-263f6e5.md), [`core:require`](../04_Essentials/require-modules-in-xml-view-and-fragment-b11d853.md), or in the controller code\):
130
+
131
+ - `odata.compare`: `sap/ui/model/odata/v4/ODataUtils`
132
+ - `odata.fillUriTemplate`: `sap/ui/thirdparty/URITemplate`
133
+ - `odata.uriEncode`: `sap/ui/model/odata/ODataUtils`
134
+ - To cover **all** built-in global symbols of the `odata` namespace at once, you can import `sap/ui/model/odata/ODataExpressionAddons`
135
+
136
+
137
+ **Additional Information:**
138
+
139
+ - [Require Modules in XML View and Fragment](../04_Essentials/require-modules-in-xml-view-and-fragment-b11d853.md)
140
+ - [XML Templating](../04_Essentials/xml-templating-5ee619f.md)
141
+
142
+ ### Standalone Apps
143
+
144
+ - During SAPUI5 bootstrapping, assign `module:sap/ui/core/ComponentSupport` or a separate JavaScript file to `data-sap-ui-on-init`.
145
+
146
+ - Avoid inline scripts or inline styles.
147
+
148
+
149
+ **Additional Information:**
150
+
151
+ - [Declarative API for Initial Components](../04_Essentials/declarative-api-for-initial-components-82a0fce.md)
152
+
153
+ ### Component / `manifest.json`
154
+
155
+ **Component Creation**
156
+
157
+ - To create a root component, favor leveraging the `sap/ui/core/ComponentSupport` module over the `sap.ui.core.ComponentContainer`.
158
+
159
+ - When creating a component via `sap.ui.core.ComponentContainer`, avoid setting a falsy value to the `manifest` property if the `async` property is kept undefined. Do not set the `async` property to `false`.
160
+
161
+ - `sap.ui.core.Component#createComponent` must not be used with `async: false`.
162
+
163
+
164
+ **`manifest.json`**
165
+
166
+ - Don't use the section `sap.ui5/resources/js` as it's deprecated. Use regular dependencies in the `Component.js` file instead.
167
+
168
+ - Unless the component intends to load specific SAPUI5 libraries manually on demand, avoid adding `{ lazy: true }` to the `sap.ui5/dependencies/libs` section.
169
+
170
+
171
+ **Dependency Management**
172
+
173
+ Before using the Component's `EventBus` instance via `Component#getEventBus`, define the `sap/ui/core/EventBus` as a dependency in your component controller \(`Component.js`\).
174
+
175
+ **Bundling**
176
+
177
+ Prevent bundling modules \(`Component-preload.js`\) into strings.
178
+
179
+ - Leverage [UI5 Tooling](https://sap.github.io/ui5-tooling/) to build the bundle. Avoid generating the application bundle with legacy build tooling, such as grunt-openui5.
180
+
181
+ - Avoid declaring `var`, `let`, or `const` in the global scope above `sap.ui.define`. If absolutely required, replace e.g. `var myGlobal` with `globalThis.myGlobal` and/or wrap the module definition in an *Immediately Invoked Function Expression* \(IIFE\) if applicable.
182
+
183
+ - For third-party libraries that have to define variables globally or must be exempted from being modified \(e.g. due to legal or license reasons\), [exclude them from the bundle](https://sap.github.io/ui5-tooling/v3/pages/Configuration/#excludes).
184
+
185
+ ### Controller / Views / Fragments
186
+
187
+ - Don't use views of type `HTMLView`, `JSView`, or `JSONView` as they are deprecated. Use `XMLView` or [Typed View](../04_Essentials/typed-view-e6bb33d.md) instead.
188
+
189
+ - Don't use `sap.ui.getCore().byId()` or `Element.getElementById()`. Use `this.byId()` or `this.getView().byId()` to address controls in your views or fragments.
190
+
191
+ - Don't use native HTML, SVG, or inline CSS style within your XML view or fragment. Instead, consider using the [`sap.ui.core.HTML`](https://ui5.sap.com/#/api/sap.ui.core.HTML) control or your own notepad control. Existing inline CSS must be migrated to an external style sheet.
192
+
193
+ - Don't use view cloning via `sap.ui.core.mvc.View#clone` as it's deprecated. Instead, call the respective factory function \(e.g. `XMLView.create`\) with the View's name.
194
+
195
+ - Use the `loadFragment` method of the `sap.ui.core.mvc.Controller` to load fragments asynchronously.
196
+
197
+ - Don't use global names in your XML. Ensure that the target function or object is defined as a module and require the defined module via [`core:require` in the XML](../04_Essentials/require-modules-in-xml-view-and-fragment-b11d853.md). Use `template:require` if the XML content needs preprocessing.
198
+
199
+ - Use the module name syntax \(e.g., `module:myapp/views/MyView`\) when creating a Typed View, Controller, or JS Fragment via factory API. This syntax provides greater flexibility by allowing you to name entities without requiring the `.view.js`, `.controller.js`, or `.fragment.js` suffixes.
200
+
201
+
202
+ **Additional Information:**
203
+
204
+ - [Use the MVC Concept](use-the-mvc-concept-07afcf4.md)
205
+ - [Keep Your Views Short and Simple](keep-your-views-short-and-simple-b0d7db7.md)
206
+ - [View Cloning \(deprecated\)](../04_Essentials/view-cloning-deprecated-a575619.md)
207
+ - [Instantiation of Fragments](../04_Essentials/instantiation-of-fragments-04129b2.md)
208
+ - [Programmatically Instantiating XML Fragments](../04_Essentials/programmatically-instantiating-xml-fragments-d6af195.md)
209
+ - [Formatting, Parsing, and Validating Data](../04_Essentials/formatting-parsing-and-validating-data-07e4b92.md)
210
+
211
+ ### Models
212
+
213
+ - Take care of destroying programmatically created models to prevent memory leaks.
214
+
215
+ - Built-in framework models \(such as `ODataModel` or `JSONModel`\) and their related classes are considered *final*. They must not be modified or extended. For more information, see [Custom Model](../04_Essentials/custom-model-91f1c7e.md).
216
+
217
+
218
+ **OData V4 Model**
219
+
220
+ - When using computed annotations, do **not** use global names; use `template:require` instead.
221
+
222
+ - Don't use the [`synchronizationMode`](https://ui5.sap.com/#/api/sap.ui.model.odata.v4.ODataModel%23constructor) as it's deprecated.
223
+
224
+
225
+ **OData V2 Model**
226
+
227
+ - [`v2.ODataModel#createEntry`](https://ui5.sap.com/#/api/sap.ui.model.odata.v2.ODataModel%23methods/createEntry): Defining an array for the `mParameters.properties` is deprecated since SAPUI5 1.120. Pass the initial values as an object instead.
228
+
229
+ - [`v2.ODataModel#refreshSecurityToken`](https://ui5.sap.com/#/api/sap.ui.model.odata.v2.ODataModel%23methods/refreshSecurityToken): Pass `true` for the `bAsync` parameter explicitly as its default value is `false`.
230
+
231
+
232
+ **JSON Model**
233
+
234
+ [`JSONModel#loadData`](https://ui5.sap.com/#/api/sap.ui.model.json.JSONModel%23methods/loadData): Do **not** pass `false` to the `bAsync` and `bCache` parameters, which are deprecated.
235
+
236
+ **Additional Information:**
237
+
238
+ - [Meta Model for OData V4](../04_Essentials/meta-model-for-odata-v4-7f29fb3.md)
239
+ - OData V2 Model: [Creating Entities](../04_Essentials/odata-v2-model-6c47b2b.md#loio4c4cd99af9b14e08bb72470cc7cabff4)
240
+
241
+ ### Strict Error Handling
242
+
243
+ Implement strict error handling to address critical issues.
244
+
245
+ - Ensure that the minimum log level includes warnings \(e.g. `sap-ui-log-level=WARNING`\).
246
+
247
+ - Starting with SAPUI5 1.120.2, check for `[FUTURE FATAL]` log messages in the browser dev console.
248
+
249
+ - Starting with SAPUI5 1.121, use the experimental URL parameter `sap-ui-xx-future=true` to enforce throwing exceptions for fatal warnings and errors.
250
+
251
+ - Starting with SAPUI5 2.0, critical findings will throw exceptions by default, requiring prior resolution.
252
+
253
+ ## Control Development
254
+
255
+ ### Control Rendering
256
+
257
+ - Ensure a dependency on the renderer or embed it within the control class.
258
+
259
+ - Migrate to the rendering `apiVersion 2` or `apiVersion 4`. For more information, see the [API Reference](https://ui5.sap.com/#/api/sap.ui.core.RenderManager%23overview).
260
+
261
+ - When utilizing [`RenderManager#icon`](https://ui5.sap.com/#/api/sap.ui.core.RenderManager%23methods/icon) during rendering, include a dependency to `sap/ui/core/IconPool` in your code.
262
+
263
+ - Don't rely on [`rerender`](https://ui5.sap.com/#/api/sap.ui.core.Control%23methods/rerender) as it is deprecated.
264
+
265
+ - Avoid overriding `invalidate` for unintended purposes. Custom logic before or after rendering should be implemented in `onBeforeRendering` or `onAfterRendering`. The actual rendering should be implemented in the `render` function of the control's renderer.
266
+ - Let the framework handle the invalidation instead of calling `invalidate` directly. It takes care of properly invalidating all affected controls, for example, when a managed control state changes via generated mutators or data binding.
267
+
268
+ **Additional Information:**
269
+
270
+ - [`RenderManager`](https://ui5.sap.com/#/api/sap.ui.core.RenderManager)
271
+ - [SAPUI5 Control Development Guidelines](../09_Developing_Controls/sapui5-control-development-guidelines-4549da6.md)
272
+
273
+ ## Library Development
274
+
275
+ ### Library Dependency and Init
276
+
277
+ - Don't use `sap.ui.getCore().initLibrary` to initialize the library as it's deprecated. Use the import of `sap/ui/core/Lib` and call its [`Lib.init()`](https://ui5.sap.com/#/api/sap.ui.core.Lib%23methods/sap.ui.core.Lib.init) instead.
278
+
279
+ - Don't use the global namespace of the library to add types. Use the return value of `Lib.init` instead to add them.
280
+
281
+ - Migrate to the library `apiVersion 2`. For more information, see the [API Reference](https://ui5.sap.com/#/api/sap.ui.core.Lib%23methods/sap.ui.core.Lib.init).
282
+
283
+ - Use [`sap.ui.base.DataType.registerEnum`](https://ui5.sap.com/#/api/sap.ui.base.DataType%23methods/sap.ui.base.DataType.registerEnum) to register enums that shall be usable as a type of control properties.
284
+
285
+ - Define the `appData/manifest/i18n` section in the `.library` file or the `sap.app/i18n` section in the `manifest.json`, so that the framework can load resource bundles in advance.
286
+
287
+ - Properly define library dependencies in all places where it is required. For more information, see [Dependencies to Libraries](../04_Essentials/descriptor-dependencies-to-libraries-and-components-8521ad1.md#loio8521ad1955f340f9a6207d615c88d7fd__section_DEPLIB).
288
+
289
+
290
+ **Additional Information:**
291
+
292
+ - [The library.js File](../09_Developing_Controls/the-library-js-file-bd039ed.md)
293
+ - [Defining Control Properties](../09_Developing_Controls/defining-control-properties-ac56d92.md)
294
+ - [Manifest \(Descriptor for Applications, Components, and Libraries\)](../04_Essentials/manifest-descriptor-for-applications-components-and-libraries-be0cf40.md)
295
+
296
+ ### Bundling
297
+
298
+ Prevent bundling modules \(`library-preload.js`\) into strings.
299
+
300
+ - Leverage [UI5 Tooling](https://sap.github.io/ui5-tooling/) to build the bundle. Avoid generating the library bundle with legacy build tooling, such as grunt-openui5.
301
+
302
+ - Avoid declaring `var`, `let`, or `const` in the global scope above `sap.ui.define`.
303
+
304
+ - For third-party libraries, set `requiresTopLevelScope="false"` to the `/library/appData/packaging/raw-module` tag within the `.library` file, **provided that** the third-party library is allowed to be bundled together and does not require access to the global scope. Otherwise, consider [excluding the third-party library from the bundle](https://sap.github.io/ui5-tooling/v3/pages/Configuration/#excludes_1).
305
+
306
+ ## Testing
307
+
308
+ - When replacing deprecated APIs with their successors, additional care has to be taken in the test code. Sometimes, deprecated APIs have been handled via spies or stubs in tests. As the SAPUI5 framework also replaces calls to deprecated APIs, such **stubs or spies might no longer achieve what they're expected to achieve**. As creating spies or stubs usually involves a different syntax than that for normal calls, alternative search patterns might be required to identify such spies or stubs
309
+
310
+ - SAPUI5 entities that have previously been looked up via their global name \(controls, controllers, components\) are now looked up as modules.
311
+
312
+ - If tests create implementations of such entities, they must be implemented in a way that a module lookup can find them: either as individual files or as embedded and named `sap.ui.define` statements.
313
+ - As modules can only be loaded and executed once, each test implementation must have a unique module name. The same name cannot be used multiple times as was the case with globals.
314
+
315
+ - Migrate an existing QUnit and OPA test setup to the [Test Starter](../04_Essentials/test-starter-032be2c.md) concept.
316
+ - Transform existing QUnit tests that are based on the outdated QUnit 1 version to using QUnit 2.
317
+ - Do not rely on the outdated Blanket.js \(`qunit-coverage.js`\) anymore. As of SAPUI5 1.113, code coverage measurement via IstanbulJS \(`qunit-coverage-istanbul.js`\) is the recommended option. For more information, see [Code Coverage Measurement](../04_Essentials/code-coverage-measurement-7ef3242.md).
@@ -0,0 +1,135 @@
1
+ # Use Asynchronous Loading
2
+
3
+ Asynchronous loading is the way to go: It makes your applications a lot faster and, through that, better to use.
4
+
5
+ As SAPUI5 is evolving, the loading processes in the background were significantly improved. To get the best out of these changes in the core and to speed up your app, we recommend that you switch on asynchronous loading. With asynchronous loading, files are retrieved in parallel. This is much quicker than synchronous loading, where files are retrieved sequentially. You have several options to do that:
6
+
7
+ ## Enable Asynchronous Loading in the Bootstrap
8
+
9
+ Add the bootstrapping tag `data-sap-ui-async="true"` to your `index.html` file. It enables the runtime to load all the modules and preload files for declared libraries asynchronously if an asynchronous API is used.
10
+
11
+ ```html
12
+ <script
13
+ id="sap-ui-bootstrap"
14
+ src="/resources/sap-ui-core.js"
15
+ data-sap-ui-compat-version="edge"
16
+ data-sap-ui-async="true"
17
+ data-sap-ui-on-init="module:my/app/main"
18
+ data-sap-ui-resource-roots='{"my.app": "./"}'
19
+ >
20
+ ```
21
+
22
+ Setting `async=true` leverages the browser's capabilities to execute multiple requests in parallel, without blocking the UI. The attribute `data-sap-ui-on-init` defines the module `my.app.Main`, which will be loaded initially.
23
+
24
+ > ### Note:
25
+ > Configuration of the bootstrap can only be done for standalone applications and when the bootstrap is under control of the developer. The bootstrap of applications from a Fiori launchpad is managed by the launchpad.
26
+
27
+ > ### Note:
28
+ > The `data-sap-ui-async="true"` configuration option requires extensive testing as well as cooperation on the application side to ensure a stable and fully working application. It is, therefore, **not** activated automatically, but needs to be configured accordingly. If you encounter issues or want to prepare your application for asynchronous loading, see [Is Your Application Ready for Asynchronous Loading?](is-your-application-ready-for-asynchronous-loading-493a15a.md) The bootstrap attribute `data-sap-ui-async="true"` affects both modules **and** preload files.
29
+
30
+ If you listen to the `init` event as part of your `index.html` page, make sure that you implement the asynchronous behavior also here, as shown in the following code snippet:
31
+
32
+ ```html
33
+ <script>
34
+ sap.ui.require([
35
+ "sap/ui/core/ComponentContainer",
36
+ "sap/ui/core/Core"
37
+ ], function(ComponentContainer, Core) {
38
+ Core.ready().then( () => {
39
+ new ComponentContainer({
40
+ name: "your.component",
41
+ async: true,
42
+ height: "100%",
43
+ manifest: true,
44
+ componentCreated: function(oParams) {
45
+ var oComponent = oParams.getParameter("component");
46
+ // do something with the component instance
47
+ }
48
+ }).placeAt("content");
49
+ });
50
+ });
51
+ </script>
52
+ ```
53
+
54
+ > ### Note:
55
+ > Please note that this variant with inline scripting is not CSP-compliant. It is better to create a module with `sap.ui.define` which contains the startup code and load it via `data-sap-ui-on-init="module:my/app/main"` \( this usually also requires a declaration of `data-sap-ui-resource-roots`, e.g.: `data-sap-ui-resource-roots='{"my.app": "./"}` \).
56
+
57
+ > ### Note:
58
+ > Applications without a descriptor file can declare additional dependencies explicitly via the bootstrap parameter `data-sap-ui-libs`. If those dependencies are not listed, such as transitive dependencies that are inherited from a listed library, SAPUI5 will load them automatically, but then has to first read the configured libraries and find out about these dependencies. This can take time as the application might benefit less from parallel loading.
59
+
60
+ **Additional Information:**
61
+
62
+ - For more information about bootstrap attributes, see [Bootstrapping: Loading and Initializing](../04_Essentials/bootstrapping-loading-and-initializing-a04b0d1.md)
63
+ - Walkthrough tutorial, [Step 2: Bootstrap](step-2-bootstrap-fe12df2.md)
64
+ - [Standard Variant for Bootstrapping](../04_Essentials/standard-variant-for-bootstrapping-91f1f45.md)
65
+ - [Best Practices for Asynchronous Loading in UI5](https://blogs.sap.com/2018/12/18/ui5ers-buzz-41-best-practices-for-async-loading-in-ui5/)
66
+
67
+ ## Ensure that Root View and Routing are Configured to Load Targets Asynchronously
68
+
69
+ Please check the `rootView` of the application's `manifest.json` file for an `async=true` parameter. This allows the root view to be loaded asynchronously.
70
+
71
+ To configure the targets for asynchronous loading, please also check the [Routing Configuration](../04_Essentials/routing-configuration-9023130.md) for the `async=true` parameter.
72
+
73
+ ```json
74
+ "sap.ui5": {
75
+ "rootView": {
76
+ "viewName": "my.app.view.App",
77
+ "type": "XML",
78
+ "id": "app",
79
+ "async": true
80
+ },
81
+ "routing": {
82
+ "config": {
83
+ "routerClass": "sap.m.routing.Router",
84
+ "viewType": "XML",
85
+ "path": "my.app.view",
86
+ "controlId": "app",
87
+ "controlAggregation": "pages",
88
+ "async": true
89
+ }
90
+ },
91
+ ...
92
+ }
93
+ ```
94
+
95
+ **Additional Information:**
96
+
97
+ - Set the rootView and routing to async via [`sap.ui.core.IAsyncContentCreation`](https://ui5.sap.com/#/api/sap.ui.core.IAsyncContentCreation)
98
+
99
+ ## Make Use of the `sap.ui.core.IAsyncContentCreation` Interface
100
+
101
+ The [`sap.ui.core.IAsyncContentCreation`](https://ui5.sap.com/#/api/sap.ui.core.IAsyncContentCreation) interface allows a subclass of `sap.ui.core.UIComponent` to be created fully asynchronously. Implementing this interface sets the component's `rootView` and router configuration implicitly to `async: true`. Nested views will then also be handled asynchronously.
102
+
103
+ > ### Note:
104
+ > For nested components \(via `sap.ui.core.ComponentContainer`\) the asynchronous behaviour will not be propagated per default.
105
+
106
+ The following code shows a sample UIComponent implementing the interface:
107
+
108
+ ```js
109
+ sap.ui.define(["sap/ui/core/UIComponent"], function(UIComponent) {
110
+ return UIComponent.extend("my.app.Component", {
111
+ metadata: {
112
+ interfaces: ["sap.ui.core.IAsyncContentCreation"],
113
+ manifest: "json"
114
+ }
115
+ });
116
+ });
117
+ ```
118
+
119
+ For more information on how `sap.ui.core.IAsyncContentCreation` affects the component's content creation, see [Methods Controlling the Initial Instantiation](../04_Essentials/methods-controlling-the-initial-instantiation-b430345.md).
120
+
121
+ **Additional Information:**
122
+
123
+ - Walkthrough tutorial, [Step 10: Descriptor for Applications](step-10-descriptor-for-applications-8f93bf2.md)
124
+
125
+ ## Make Use of Asynchronous Module Loading \(AMD Style\)
126
+
127
+ If modules follow the Asynchronous Module Definition \(AMD\) standard and the bootstrap flag `data-sap-ui-async` is set to `true`, custom scripts and other modules can also be loaded asynchronously when a preload is not available. It will help you in the future to enable asynchronous loading of individual modules combined with the usage of HTTP/2 or AMD-based module bundlers. It also ensures proper dependency tracking between modules.
128
+
129
+ But it isn't enough to write AMD modules. You also need to prevent access to SAPUI5 classes via global names. For instance, do not use global namespaces like `new sap.m.Button()` but require the `Button` and call its constructor via the local AMD reference instead.
130
+
131
+ For more information, see the [API Reference: `sap.ui.define`](https://ui5.sap.com/#/api/sap.ui/methods/sap.ui.define).
132
+
133
+ Always avoid usages of `jQuery.sap.require` ! In order to enable modules to load asynchronously, use `sap.ui.define` to create modules \(e.g. controllers or components\) or `sap.ui.require` in other cases.
134
+
135
+ Please follow the [Best Practices for Loading Modules](../04_Essentials/best-practices-for-loading-modules-00737d6.md).