Toasts: JS Error in console

[lscharmer]

Mantis Bug: https://mantis.ilias.de/view.php?id=34590

The ILIAS\UI\Renderer::renderAsync(...) method adds all JS code to the generated HTML and to the tpl.standardpage.html. This is no issue when used in an asynch request where the tpl.standardpage.html is not rendered anyways but when the method is used in a normal request the JS onload code is added twice.

The JS error in the mantis bug also occurs in the documentation / examples for the toasts because of this issue.

This PR doesn't fix the issue with renderAsync but prevents the JS error.

The question arises if the renderAync method must not be used in a non asynchronous call or if this is a bug.

[Amstutz]

This is no issue when used in an asynch request where the tpl.standardpage.html is not rendered anyways but when the method is used in a normal request the JS onload code is added twice.

This is more or less the core purpose of render async, rendering the code directly next to the rendered component inside the dom. Otherwise we lose this js on exit.

@lscharmer: Thx for the PR. Can you give me an example of why and when you would use this asyncRender in a non-async context?

[lscharmer]

@lscharmer: Thx for the PR. Can you give me an example of why and when you would use this asyncRender in a non-async context?

Currently they are used in all examples of the Toasts e.g.: https://github.com/ILIAS-eLearning/ILIAS/blob/da3e9a75fea5d0517bbad64f198f0a4d0aef76da/src/UI/examples/Toast/Standard/with_long_description.php#L27 As far as I understand the current toast implementation can only be used asynchronously (because they cannot be rendered everywhere in the DOM).

And I recently added them for the JS Toast API to prevent the initial AJAX call onload (#performance). PR: #5012: https://github.com/ILIAS-eLearning/ILIAS/blob/da3e9a75fea5d0517bbad64f198f0a4d0aef76da/Services/Notifications/classes/ilNotificationOSDGUI.php#L77

And once more in the same PR to render a template to create client side toasts (JS Toast API) without the need for an extra AJAX call: https://github.com/ILIAS-eLearning/ILIAS/blob/da3e9a75fea5d0517bbad64f198f0a4d0aef76da/Services/Notifications/classes/ilNotificationOSDGUI.php#L90

This is more or less the core purpose of render async, rendering the code directly next to the rendered component inside the dom. Otherwise we lose this js on exit.

Yes it needs to be rendered next to the component but imo it should not be added to the tpl.standardpage.html as well when using renderAsync.

[klees]

Hi @lscharmer,

I had the same question than @Amstutz and frankly, I'm not 100% sure I have understood you answer...

For the example, the async rendering is used because the result in fact enters the dom asynchronously. This won't work in normal ILIAS workkflow, as you have discovered, since the js will be added to the page as well. Maybe this could be documented a little better in the example. But why do you think the toast can only be used asynchronously?

If I understand correctly, you try to save one asyn ajax call by pretending to have loaded toasts asynchronously (in PR #5012). To do that, you render the toasts and deliver them as JSON to the client, to unpack them there again. But why don't you just include the toasts synchronously?

Best regards!

[iszmais]

I agree with @klees in that point, therefore i made an additional PR to move the rendering of initial toasts to the page builder instead of simulating a asynchronous request: https://github.com/ILIAS-eLearning/ILIAS/pull/5121

This dont solve the "problem" within the examples though but i see this more as a form of comfort in display than as an actual issue.

[klees]

@lscharmer @Amstutz: Do we need to keep this PR?

[Amstutz]

@lscharmer feel free to re-open if needed.