UI5 doesn't preserve core.HTML Component state. It re-renders the component from scratch.

[rafidashab]

OpenUI5 version: 1.84.17

Browser/version (+device/version): 98.0.4758.82

Any other tested browsers/devices(OK/FAIL): Microsoft Edge

Steps to reproduce the problem:

1. Render a core.HTML component with afterRendering prop that render children nodes to the core.HTML component with Deku JS. (3rd Party js library)
2. Stop the afterRendering function from running (the second time). This would show that UI5 didn't preserve the previously existing DOM.

What is the expected result? The core.HTML component is re-rendered instead of being preserved like it used to in version 1.60.39. The expected result would be the children nodes would disappear that was created by the intial afterRendering because the state of the core.HTML was not preserved.

[NHristov-sap]

Hi @rafidashab ,

Can you please give a live example that demonstrates the issue?

Best Regards, Nikolay Hristov

[aborjinik]

@rafidashab this works exactly as documented https://ui5.sap.com/#/api/sap.ui.core.HTML%23methods/getPreferDOM Even though I agree that https://github.com/SAP/openui5/commit/6c56823ad1bd5663fd512d1436d640c1c7b798a2 seems responsible, for your use case, rendering 3rd party component, should have been set the preferDom to true.

[rafidashab]

Hello Aborjinik. It seems like the preferDom had nothing to do with the render. I have tried setting preferDom to true manually. UI5 doesn't preserve the DOM element at all. The commit you shared mentions : https://github.com/SAP/openui5/commit/6c56823ad1bd5663fd512d1436d640c1c7b798a2

With this change, moving "to-be-preserved" control DOM nodes to the preserved area is left to the control responsibility. Controls should do this onBeforeRendering hook via RenderManager.preserveContent API.

However the node I am using already has data-sap-ui-preserve="__html3" tag. Do I still need do something else to make sure the DOM is preserved along with it's children.

[codeworrior]

Reading the initial description and your last comment, I'm a bit confused whether you want the DOM to be preserved or not.

Can you please provide a code snippet that shows the faulty behavior? Ideally, your sample should not only show the HTML control but also the control hierarchy it lives in. At least it should show whether the HTML control is placed into a UIArea directly or whether there are intermediate UI5 controls. Also important: where is re-rendering triggered? On the HTML control or on one of its ancestor controls?

[aborjinik]

@rafidashab I am confused either. With the initial description (and title) I thought that the issue was, the preserving was working with previous UI5 versions even though preferDom=false but not any longer. Therefore I said that preferDom had to be true even with older UI5 versions.

From your last comment, without looking at the code, I am assuming that your 3rd party content has an ID but your HTML control does not. Please set your HTML controls id and the content id equal. e.g.

new sap.ui.core.HTML("myID", {
    content: "<div id='myID'>some text</div>"
});

Please note that even though preserving was working with different IDs in older UI5 versions it must be logging this case as warning with the following message. "[Unsupported Feature]: Id of HTML Control does not match with content id!" Since this was an unsupported feature I do not think we need any improvement here. Please align IDs and if this does not help please provide all the details that @codeworrior has mentioned.