From 4e216e62bc8cf87aa4a9540184dfc20f75e0ef99 Mon Sep 17 00:00:00 2001 From: Florian Vogt Date: Thu, 4 Jul 2024 16:06:18 +0200 Subject: [PATCH 1/3] [INTERNAL] docs/pages/Builder.md: Explain bundling of files requiring top level scope JIRA: CPOUI5FOUNDATION-794 --- docs/pages/Builder.md | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/docs/pages/Builder.md b/docs/pages/Builder.md index 76f487f3b9..8ee77f887e 100644 --- a/docs/pages/Builder.md +++ b/docs/pages/Builder.md @@ -149,3 +149,28 @@ To get a list of all available processors, please visit [the API reference](http ## Legacy Bundle Tooling (lbt) JavaScript port of the "legacy" Maven/Java based bundle tooling. + + +### JavaScript files requiring top level scope +UI5 Tooling packages JavaScript files requiring top level scope as a string as long as your project using specVersion lower than `4.0`. This stringified code is evaluated via [`eval`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) at runtime. This behavior ensures that the script works as expected, e.g. with regards to implicit globals. However this `eval` runtime feature will be discontinued with UI5 2.x because of security best practices (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) and to comply with stricter CSP settings (`unsafe-eval`). When your project defines [Specification Version 4.0](./Configuration.md#specification-version-40) or higher files requiring top level scope are no longer part of the created bundle and an error is logged by UI5 Tooling. Therefore, please adjust your code with the help of one of the following options: + +**Option 1**: Use [ui5-tooling-modules](https://www.npmjs.com/package/ui5-tooling-modules) to bundle third-party `npm` packages. It converts files to `sap.ui.define` modules automatically. + +**Option 2**: Wrap the respective files manually in `sap.ui.define` modules. + +*Before*: +```js +const myFancyModule = {}; +``` + +*After*: +```js +sap.ui.define([], () => { + "use strict"; + const myFancyModule = {}; + return myFancyModule; +}) +``` + + + From fdc0ace4384d41d09b7e28f1994337d1421245ca Mon Sep 17 00:00:00 2001 From: Florian Vogt Date: Tue, 9 Jul 2024 08:39:05 +0200 Subject: [PATCH 2/3] [INTERNAL]docs/pages/Builder.md: Apply code review Co-authored-by: Merlin Beutlberger --- docs/pages/Builder.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/docs/pages/Builder.md b/docs/pages/Builder.md index 8ee77f887e..eac500124d 100644 --- a/docs/pages/Builder.md +++ b/docs/pages/Builder.md @@ -152,7 +152,9 @@ JavaScript port of the "legacy" Maven/Java based bundle tooling. ### JavaScript files requiring top level scope -UI5 Tooling packages JavaScript files requiring top level scope as a string as long as your project using specVersion lower than `4.0`. This stringified code is evaluated via [`eval`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) at runtime. This behavior ensures that the script works as expected, e.g. with regards to implicit globals. However this `eval` runtime feature will be discontinued with UI5 2.x because of security best practices (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) and to comply with stricter CSP settings (`unsafe-eval`). When your project defines [Specification Version 4.0](./Configuration.md#specification-version-40) or higher files requiring top level scope are no longer part of the created bundle and an error is logged by UI5 Tooling. Therefore, please adjust your code with the help of one of the following options: +UI5 Tooling packages JavaScript files that require "top level scope" as a string, as long as your project is using a Specification Version lower than `4.0`. In this case, the respective code is evaluated using [`eval`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) at runtime. + +This behavior ensures that the script works as expected, e.g. with regards to implicitly used globals. However this `eval` runtime feature will be discontinued with UI5 2.x because of security best practices (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) and to comply with stricter CSP settings (`unsafe-eval`). When your project defines [Specification Version 4.0](./Configuration.md#specification-version-40) or higher, files requiring top level scope are no longer part of the created bundle and an error is logged by UI5 Tooling. Therefore, please adjust your code with the help of one of the following options: **Option 1**: Use [ui5-tooling-modules](https://www.npmjs.com/package/ui5-tooling-modules) to bundle third-party `npm` packages. It converts files to `sap.ui.define` modules automatically. From 87cb717d97b370f7b90f3681c3fa8fbb18e0dca0 Mon Sep 17 00:00:00 2001 From: Florian Vogt Date: Tue, 9 Jul 2024 13:30:20 +0200 Subject: [PATCH 3/3] [INTERNAL] Apply suggestions from code review MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Günter Klatt <57760635+KlattG@users.noreply.github.com> --- docs/pages/Builder.md | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/docs/pages/Builder.md b/docs/pages/Builder.md index eac500124d..bc7a972d81 100644 --- a/docs/pages/Builder.md +++ b/docs/pages/Builder.md @@ -151,10 +151,10 @@ To get a list of all available processors, please visit [the API reference](http JavaScript port of the "legacy" Maven/Java based bundle tooling. -### JavaScript files requiring top level scope -UI5 Tooling packages JavaScript files that require "top level scope" as a string, as long as your project is using a Specification Version lower than `4.0`. In this case, the respective code is evaluated using [`eval`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) at runtime. +### JavaScript Files Requiring Top Level Scope +UI5 Tooling packages JavaScript files that require "top level scope" as a string, provided your project uses a Specification Version lower than `4.0`. In this case, the code is evaluated using [`eval`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) at runtime. -This behavior ensures that the script works as expected, e.g. with regards to implicitly used globals. However this `eval` runtime feature will be discontinued with UI5 2.x because of security best practices (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) and to comply with stricter CSP settings (`unsafe-eval`). When your project defines [Specification Version 4.0](./Configuration.md#specification-version-40) or higher, files requiring top level scope are no longer part of the created bundle and an error is logged by UI5 Tooling. Therefore, please adjust your code with the help of one of the following options: +This ensures that the script works as expected, e.g. with regards to implicitly used globals. However, this `eval` runtime feature will be discontinued with UI5 2.x because of security best practices (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) and to comply with stricter CSP settings (`unsafe-eval`). If your project defines [Specification Version 4.0](./Configuration.md#specification-version-40) or higher, files requiring top level scope are no longer part of the created bundle and following error is logged by UI5 Tooling `Module myFancyModule requires top level scope and can only be embedded as a string (requires 'eval'), which is not supported with specVersion 4.0 and higher. For more information, see the UI5 Tooling documentation https://sap.github.io/ui5-tooling/stable/pages/Builder/#javascript-files-requiring-top-level-scope`. Therefore, please adjust your code with one of the following options: **Option 1**: Use [ui5-tooling-modules](https://www.npmjs.com/package/ui5-tooling-modules) to bundle third-party `npm` packages. It converts files to `sap.ui.define` modules automatically. @@ -173,6 +173,3 @@ sap.ui.define([], () => { return myFancyModule; }) ``` - - -