SAP Community - Volker Buzek

Re: SAP Fiori Application Model - Page Map not loading

2023-10-06T14:32:50+02:00

Hi christoph.gollmick - any updates on your investigation?

Just ran into a similar issue with a colleague's project.

Re: SAP Fiori Application Model - Page Map not loading

2023-10-09T09:25:50+02:00

Hi, yeah, even with the latest version of ux-specification, this didn't work. I'll ask the colleague to zip the proj up and send it over. Thanks!

UI5's unified test tech stack

2023-10-19T16:00:15+02:00

Since many moons, karma was the go-to testrunner for executing Unit- and Integration-tests of UI5 applications. For end-to-end tests, wdi5 has become the default tool.

With karma being deprecated, a void opened for a successor for running QUnit- and OPA-tests within the existing UI5 test tech stack - until wdio-qunit-service arrived, allowing you to run Unit-, Integration- and end-to-end tests on the same stack.

🔥 clone yourself this sample repo https://github.com/vobu/ui5-unified-test-stack, npm i && npm run test and see for yourself ✌️

"QUnit service" replaces `karma`

wdio-qunit-service is the awesome work by longtime community member Mauricio Lauffer. As Mauricio puts it himself in the README, "QUnit Service is a drop-in replacement for those using Karma JS to run their QUnit tests".

It is the same way a Webdriver.IO-extension as wdi5, following the respective naming convention:

wdio-qunit-service → human readable "QUnit Service"

wdio-ui5-service → human readable "wdi5"

Both "services" extend Webdriver.IO with UI5-specific functionality - "QUnit Service" for running Unit- and Integration-tests, wdi5 for running end-to-end tests.

Don't be fooled by neither the technical service name wdio-qunit-service, nor by "QUnit service" - the Webdriver.IO-extension is perfectly capable of running OPA tests as well, as they are based on QUnit!

With both services using Webdriver.IO, the UI5 test tech stack gets harmonised by eliminating the karma dependency and using the same test runner for executing all Unit-, Integration- and end-to-end tests.

By the way: migration from karma to "Qunit Service" is as easy declaring qunit as a required service in the config file and putting a 7 (!) lines of JS code in a .test.(j|t)s file.

No believe?

Either look at the sample repo source (config file, test file) or follow along here, as we embark on a journey of creating

a UI5 app from scratch

installing wdi5 and "QUnit Service"

migrating the Unit- and Integration-Tests

...all in under 15 minutes.

Even if you're a slow typer, promised.

Challenge: UI5 app and unified test stack in less than 15 minutes

Let's go 🏃🏃🏃!

Open a terminal:

$> yo easy-ui5 app

and answer to the prompts.

(yes, I'll wait)

...

Done? Good.

Install wdi5 in the directory your app was created in:

$> cd <your app dir>

$> npm init wdi5@latest

(yes, I'll wait again)

This creates a wdi5 config for you at webapp/test/e2e/wdio.conf.js- which in turn is a Webdriver.IO-config file that can be re-used for executing the QUnit- and OPA-tests via wdio-qunit-service!

Copy webapp/test/e2e/wdio.conf.js to the unit test folder webapp/test/unit/.

Add qunit to the services array in ~line 134: services: ["ui5", "qunit"] of webapp/test/unit/wdio.conf.js.

exports.config = {

    // ...

    services: ["ui5", "qunit"],

    // ...

}

Create a new file webapp/test/unit/unitTests.test.js with this content:

describe("QUnit test page", () => {

    it("should pass QUnit tests", async () => {

        await browser.url("http://localhost:8080/test/unit/unitTests.qunit.html");

        const qunitResults = await browser.getQUnitResults();

        expect(qunitResults).toBeTruthy();

    });

});

(Excerpt: what does this do? It is taken straight from the QUnit Service documentation. And it starts the browser configured in webapp/test/unit/wdio.conf.js (here: Chrome), opens the URL http://localhost:8080/test/unit/unitTests.qunit.html, and waits for the Unit Tests to run and finish via await browser.getQUnitResults())

You end up with this dir/file structure:

.

└── webapp

    └── test

        ├── e2e

        │   ├── sample.test.js

        │   └── wdio.conf.js

        └── unit

            ├── unitTests.test.js

            └── wdio.conf.js

Now, head back to the terminal.

Run $> npm start for starting the UI5 app.

Open a second terminal, run $> npx wdio run ./webapp/test/unit/wdio.conf.js ...
...and marvel at UI5's QUnit tests running with Webdriver.IO.

With the help of "Qunit Service", on the same tech base as wdi5.

And with the same configuration file.

Webdriver.IO and wdio-qunit-service running Unit tests

💣

Clean up + porting integration test runner

We could end here. But now that we've seen that the same config file can be re-used for Unit-, Integration- and end-to-end tests, let's exactly do this:

Copy webapp/test/unit/wdio.conf.js into webapp/test/ and name it wdio.conf.shared.js.

Then put a dedicated wdio.conf.{e2e,integration,unit}.js into each respective folder.

With the contents of each being the same:

const { config } = require("../wdio.conf.shared");

exports.config = config;

This requires the shared file, would allow for on-the-fly config changes, and exports it again.

So the directory/file structure now looks like:

.

└── webapp

    └── test

        ├── e2e

        │   └── wdio.conf.e2e.js

        ├── integration

        │   └── wdio.conf.integration.js

        ├── unit        

        │   └── wdio.conf.unit.js

        └── wdio.conf.shared.js

Create a file for running the OPA integration tests with wdio-qunit-service / wdio the same way as it is for the QUnit unit tests:

webapp/test/integration/integrationTests.test.js:

describe("QUnit test page", () => {

    it("should pass QUnit tests", async () => {

        await browser.url(

            "http://localhost:8080/test/integration/opaTests.qunit.html"

        );

        const qunitResults = await browser.getQUnitResults();

        expect(qunitResults).toBeTruthy();

    });

});

So our test- and config-file tree looks like:

.

└── webapp

    ├── test

    │   ├── e2e

    │   │   ├── sample.test.js

    │   │   └── wdio.conf.e2e.js

    │   ├── integration

    │   │   ├── integrationTests.test.

    │   │   └── wdio.conf.integration.js

    │   ├── unit

    │   │   ├── unitTests.test.js

    │   │   └── wdio.conf.unit.js

    │   └── wdio.conf.shared.js

    └── view

Spice up package.json with npm scripts for running each test scope:

{

//...

    "scripts": {

    //...

        "test:unit": "wdio run ./webapp/test/unit/wdio.conf.unit.js",

        "test:integration": "wdio run ./webapp/test/integration/wdio.conf.integration.js",

        "test:e2e": "npm run wdi5",

        "wdi5": "wdio run ./webapp/test/e2e/wdio.conf.e2e.js"

    }

//...

}

Now you have

Unit tests (QUnit)

Integration tests (OPA)

end-to-end tests (wdi5)

all running on the same tech stack (Webdriver.IO)!

Thanks to Mauricio's awesome work on wdio-qunit-service !

Is this the official UI5 approach for running tests on a unified test stack?

No. Not yet 😄.

From an architectural point of view, it makes a lot of sense - single test runner, fewer module dependencies, reduced technical debt.

From a business perspective, it makes a lot of sense - Webdriver.IO is community-owned and will not go away by the decision of a single company. Both wdio-qunit-service and wdi5 are Open Source and permit commercial use with their Apache 2.0 license.

From a developer perspective, it makes a lot of sense - keep on writing QUnit- and OPA-tests as it always was, re-use the same test-runner as for wdi5-tests.

From the SAP perspective, it makes a lot of sense - as it once again proves that a cooperation with the community enables quicker innovation.

Everybody wins. Heck yeah 🍾 💪

Re: UI5's unified test tech stack

2023-10-20T08:55:19+02:00

cool! merged!

using suites instead of different config files → only one wdio.config.js to run all tests 👍

Re: UI5's unified test tech stack

2023-10-26T09:13:51+02:00

well, yo easy-ui5 ts-app && npm init wdi5@latest -- --ts allows for a quick start similar to the JS-approach in the blog post.

Do you want to give it a shot? I'd be happy to collaborate on both code and writing 🙂

Re: How to 'properly' type an ENUM for CodeCompletion - JS based UI5 app (JSDoc + TS, no d.ts files)

2023-12-11T09:13:57+01:00

inline JSDoc declarations usually work right before the relevant parenthesis (e.g. https://www.typescriptlang.org/docs/handbook/jsdoc-supported-types.html#casts)

What worked for me in a quick test:

sap.ui.define([], () => {
  return Object.freeze(
    /**
     * this is your ENUM right before the parenthesis
     *
     * @property {string} SOME_KEY1 bla
     * @property {string} SOME_KEY2 fasel
     */ {
      SOME_KEY1: "first-value",
      SOME_KEY2: "second-value"
    }
  )
})

hth, v.

Re: How to develop cap application with external database

2023-12-11T09:30:34+01:00

for PostgreSQL it's absolutely possible with https://github.com/cap-js/cds-dbs/tree/main/postgres, see sample config over at https://github.com/cap-js/cds-dbs/blob/main/postgres/test/service-az.json

For MySQL there is https://github.com/Soontao/cds-mysql - haven't tried it, but might be worth a shot 🙂

Re: How to develop cap application with external database

2023-12-11T10:46:12+01:00

well, CAP apps don't deploy to a DB, but into a runtime env such as CF. The DB used by the CAP app is just "another service" (in CAP "speak"), whether it sits within the same runtime env or remote. Note that "within the same runtime env" doesn't necessarily mean HTTP roundtrip cost saving as for example the PostgreSQL service "in BTP" also sits externally, requiring HTTP roundtrips.

Additionally, the CAP doc is excellent in terms of deployment: https://cap.cloud.sap/docs/guides/deployment/

Re: How to develop cap application with external database

2023-12-12T08:53:40+01:00

correct, no official MySQL support for CAP, "only" community support.

Re: Unveiling Critical Security Updates: SAP BTP Security Note 3411067

2023-12-13T15:56:09+01:00

Hi, first of all thanks for the detailed info on the potential privilege escalation vulnerability.

But if I'm not mistaken, only one of the three affected Node.js libraries is Open Source* - all others are Source Open, as in available on npm, but neither with a public source code repo, nor with an associated Open Source license.

In fact it stands to argue that if they were Open Source, the vulnerabilities might have been discovered sooner (b/c more eyes to the cause) and fixed quicker (b/c more hands to the rescue).

Just my .02€, Volker

*
- https://www.npmjs.com/package/@sap/xssec (not OS)
- https://www.npmjs.com/package/@sap/approuter (not OS)
- https://github.com/SAP/cloud-sdk-js (OS)

Re: Asking and Answering Questions in the Community After Migration

2024-01-30T11:40:05.328000+01:00

Hey @jerryjanda , the old community site offered RSS feeds for topics. We now have labels here, but they don't seem to have an associated RSS feed. Only the "Categories" seem to have one (e.g. "Supply Chain Management"), but not the topics (e.g. "UI5"), nor the labels (e.g. "SAP BTP").

So essentially my question is:

how do I best subscribe to all blogs (no matter whether they're from SAP employees or Community members") for a certain technology/framework by RSS (e.g. "all blog posts tagged 'UI5'")?

Thanks for any pointers, V.

Re: Asking and Answering Questions in the Community After Migration

2024-02-13T16:20:30.922000+01:00

Hi @jerryjanda,

thanks for riding this train along so openly 😁

By the amount of requests only in this thread, it's become clear that RSS subscriptions on managed and unmanaged tags as well as on "blogs only" is a highly thought-after functionality that we'll hopefully get soon™.

But I'd like to also re-iterate the demand for a more fine-grained breakdown of the "Technology Category". There's just too much diverse technology within SAP products to summarise it all unter a "Technology" section. This doesn't do justice to the great effort of many community members, both from inside and outside SAP, who blogged on manifold tech topics on blogs.sap.com, providing invaluable help for all SAP technologists out there. Please make this possible again by introducing actual technology categories to the "Technology category" 😸!

Thanks, V.

Re: What's New for SAP Build Apps - Enhanced Fusion Development

2024-02-14T09:04:05.405000+01:00

Hi, this is good to hear. Are IAS-based authorizations meanwhile also available in the mobile app itself?

Re: Addressing Common Questions and Complaints About the New Platform

2024-02-14T09:22:11.579000+01:00

Hi, is it just on my machine™ or do code sections not show up in the RSS feed?

Screenshot of RSS feed:

Screenshot of Blog Post:

Re: Asking and Answering Questions in the Community After Migration

2024-02-19T10:27:36.088000+01:00

thanks for explaining and clarifying @jerryjanda on the topic of the "Categories". So I take it "Technology" is never going to be detailed any further. This is very unfortunate. By the same logic, the "Categories" could just be "Modules" and "Technology" and it would still fulfil the taxonomy you explained.

Anyway, let's hope that with the concentration on "tags", we're getting a better structure into the vast tech content category.

Re: UI5's unified test tech stack

2024-02-27T16:09:58.972000+01:00

there's an important install command missing:

after init'ing wdi5 via npm init wdi5@latest, there'd have to be an additional command installing the qunit-service:

$> npm i wdio-qunit-service

(I tried editing the blog post, but that completely messed up the overall layout. Including removing all code-formatted words. Thanks, but no thanks.)

Re: Addressing Common Questions and Complaints About the New Platform

2024-02-28T16:35:50.658000+01:00

hey @jerryjanda, I'm using the web-based RSS reader Feedly (feedly.com), usually either from iOS or macOS, with (mobile) Safari respectively

Re: What's New for SAP Build Apps - Enhanced Fusion Development

2024-03-08T11:34:15.129000+01:00

@EsmeeX nice! Authorisation possible as well (Groups/Roles from IdP)?

Re: SAP UI5 How to keep a view Session alive on TV?

2024-04-16T10:07:14.707000+02:00

as with any statleess http-base app, this would require to continuously poll an endpoint on the backend, so the session doesn't die.

https://developer.mozilla.org/en-US/docs/Web/API/setInterval might help here - but be careful of not doing this on the main thread to avoid blocking the UI. Instead, either do it in a web worker (https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API) or as an async function/Promise (e.g. famous "sleep" one-liner

const sleep = duration => new Promise(resolve => setTimeout(resolve, duration))

hth, v.

Re: Upload Excel using SAP RAP Only

2024-04-19T09:03:44.292000+02:00

Hi,

my guesstimate is that

https://github.com/abap2xlsx/abap2xlsx and

https://spreadsheet-importer.com/

is all you'll ever need 🙂

- v.

SAP Community - Volker Buzek

Re: SAP Fiori Application Model - Page Map not loading

Re: SAP Fiori Application Model - Page Map not loading

UI5's unified test tech stack

"QUnit service" replaces karma

Challenge: UI5 app and unified test stack in less than 15 minutes

Clean up + porting integration test runner

Re: UI5's unified test tech stack

Re: UI5's unified test tech stack

Re: How to 'properly' type an ENUM for CodeCompletion - JS based UI5 app (JSDoc + TS, no d.ts files)

Re: How to develop cap application with external database

Re: How to develop cap application with external database

Re: How to develop cap application with external database

Re: Unveiling Critical Security Updates: SAP BTP Security Note 3411067

Re: Asking and Answering Questions in the Community After Migration

Re: Asking and Answering Questions in the Community After Migration

Re: What's New for SAP Build Apps - Enhanced Fusion Development

Re: Addressing Common Questions and Complaints About the New Platform

Re: Asking and Answering Questions in the Community After Migration

Re: UI5's unified test tech stack

Re: Addressing Common Questions and Complaints About the New Platform

Re: What's New for SAP Build Apps - Enhanced Fusion Development

Re: SAP UI5 How to keep a view Session alive on TV?

Re: Upload Excel using SAP RAP Only

"QUnit service" replaces `karma`