fix(ui5-page): fix createElement error caused by adding new style pro…

…perty in the constructor (#9998)

Custom element must not gain any attributes or children in the constructor,
as this violates the expectations of consumers who use the createElement or createElementNS methods.

Fixes #9981

packages/fiori/src/Page.ts

@@ -115,7 +115,9 @@ class Page extends UI5Element {
 
 	constructor() {
 		super();
+	}
 
+	onEnterDOM(): void {
 		this.style.setProperty(getScopedVarName("--_ui5-page-animation-duration"), getAnimationMode() === AnimationMode.None ? "0s" : "0.35s");
 	}
 

packages/fiori/test/specs/Page.spec.js

@@ -30,7 +30,7 @@ describe("Page general interaction", () => {
 			timeoutMsg: "expected footer to not be visible after 500ms"
 		});
 	});
-	
+
 	it("tests animation off footer toggling" , async () => {
 		await browser.url(`test/pages/Page.html?sap-ui-animationMode=none`);
 
@@ -43,4 +43,17 @@ describe("Page general interaction", () => {
 
 		assert.ok(!(await footer.isDisplayedInViewport()), "Footer should not be visible.");
 	});
+
+	it("createElement does not throw exception", async () => {
+		let result;
+
+		result = await browser.executeAsync(async (done) => {
+			const p = document.createElement("ui5-page");
+			// createElement throws exception during attachInternals() call but the exception can not be caught
+			// so we check if the _internals property is added to the page object
+			done(p._internals !== undefined);
+		});
+
+		assert.ok( result, "No exception should be thrown");
+	});
 });