Implementing the IAsyncContentCreation interface in UI5

Question

To ensure sap.ui.core.UIComponent to be created fully asynchronously, we need to implement the IAsyncContentCreation interface:

metadata: {
    interfaces: [
        "sap.ui.core.IAsyncContentCreation"
    ],
    manifest: "json"
}

That's totally OK.
Exploring the SAP apps samples, I've found out the following code snippet, where the hard-coded and, thus error prone, interface name is replaced with code, which can be automatically checked:

sap.ui.define([
    "sap/ui/core/library",
    "sap/ui/core/UIComponent",
    …
], function(library, UIComponent, models, History) {
    "use strict";

    return UIComponent.extend("sap.ui.demo.toolpageapp.Component", {

        metadata: {
            interfaces: [
                library.IAsyncContentCreation
            ],
            manifest: "json"
        }
        …

    }
}

I've tried to check the content of library in DevTools, but I get a ReferenceError exception instead of the library's values:

Uncaught ReferenceError: library is not defined
    at eval (eval at init (Component.js:24), <anonymous>:1:1)
    at f.init (Component.js:24)
    at sap-ui-core.js:315
    at f.constructor (sap-ui-core.js:315)
    at f.constructor (sap-ui-core.js:585)
    at f.constructor (library-preload.js:1154)
    at f [as constructor] (sap-ui-core.js:547)
    at new o1 (sap-ui-core.js:632)
    at H (sap-ui-core.js:628)
    at sap-ui-core.js:628

How can I ensure that library.IAsyncContentCreation is really properly defined and returns "sap.ui.core.IAsyncContentCreation" as intended?

score 3 · Accepted Answer · answered Oct 27 '21 at 21:24

3

I've tried to check the content of library in DevTools, but I get a ReferenceError exception.

Most probably, you've encountered the V8's debugger limitation, where the unused closure variables (here: library) are not evaluated by the V8 during the debugger session, and thus not accessible from the devtool console. See Why does Chrome debugger think closed local variable is undefined? and also the V8 issues #3491 and #2710.

The above limitation applies only to V8's debugger. When the code is executed at runtime, library.IAsyncContentCreation will be resolved to the string "sap.ui.core.IAsyncContentCreation" as expected so you won't get the ReferenceError.

Exploring the SAP apps samples, [...] interface name is replaced with code.

It's unclear why the sample author decided to require the core library in the first place. Those interfaces in UI5 Objects await string literals. And UI5 interfaces are simple marker interfaces (aka. tagging interfaces). They don't specify any behavior in code. Adding the interface name (string literal) simply tells how the class implementing the interface is supposed to behave. So adding the string literal is sufficient.

interfaces: [
  "sap.ui.core.IAsyncContentCreation"
],

answered Oct 27 '21 at 21:24

Boghyon Hoffmann

17,103
12
72
170

Thx for clarification!, I assume the main idea behind `library.IAsyncContentCreation` vs. `"sap.ui.core.IAsyncContentCreation"` is just to avoid the hard coded strings, which are typo error prone. The main question, does requiring the core library `sap.ui.core.library` significantly impacts the performance? – Mike Oct 27 '21 at 22:40
BTW, `console.log(library.IAsyncContentCreation);` prints `sap.ui.core.IAsyncContentCreation`. – Mike Oct 27 '21 at 22:49
2

@Mike _> does requiring the core library [...] significantly impact the performance?_ ... I wouldn't say so because requiring `sap/ui/core/library` is not the same as actually loading the entire library bundle. Still, I'd consider **not** to require an additional module if I could replace it with a single string literal in the `interfaces` section (personal preference). Generally, I focus on UX rather than DX in such cases. But of course, it would be nice if writing `"sap.ui.core.IAsyncCont..."` could be auto-completed. I wonder if TypeScript could help – Boghyon Hoffmann Oct 27 '21 at 23:16
[According](https://github.com/SAP/openui5/pull/3371#issuecomment-953548708) to the UI5 team, _«Right now, we have no plans to move the OpenUI5 codebase towards TypeScript»_. – Mike Oct 28 '21 at 06:59

Implementing the IAsyncContentCreation interface in UI5

1 Answers1