eclipsesource / eclipsesource/tabris-js

Widgets created in async functions do not appear

Open
#2,191 1 comment 0 reactions 2 assignees Claimed by @tbuschto View on GitHub
bug
Dominant language
JavaScript
Stars
1.4k
Forks
171
PR merge metrics
No merged PRs in 30d

Description

### Problem description

When we append a new view to the `contentView` within `async` function, it is not rendered. However, it appears when we move the app to the background and then come back to the foreground. We can reproduce the issue with the following snippet, which new screen (with red background) should be opened after 4 seconds when we click the button on the first yellow screen.

### Expected behavior

The rendering of the view should not be affected by any `async` functions.

### Environment

- Tabris.js version: 3.7.2
- Device: iPad 10.2, Samsung A70
- OS: iOS 14.6, Android 11

### Code snippet

```js
import {Button, Color, Composite, LayoutData, contentView} from 'tabris';

class Screen extends Composite {

constructor(background) {
super({
layoutData: LayoutData.stretch,
background
});
this.append(
new Button({
left: 16,
right: 16,
centerY: 0,
text: 'Click'
}).onSelect(async () => {
await new Promise(resolve => setTimeout(resolve, 4000)); // without this line it works fine
new Screen(Color.red).appendTo(contentView);
})
);
}

}

new Screen(Color.yellow).appendTo(contentView);
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.