From c452d60dce8050562703a75757a0581b0614bd9f Mon Sep 17 00:00:00 2001
From: Vladislav Tasev <vladitasev@users.noreply.github.com>
Date: Mon, 10 Jun 2019 13:44:38 +0300
Subject: [PATCH] feat(base): implement late validation (#522)

---
 packages/base/src/UI5Element.js         |  6 +++---
 packages/base/src/UI5ElementMetadata.js | 22 ++++++++++++++++------
 packages/main/src/List.js               | 13 -------------
 3 files changed, 19 insertions(+), 22 deletions(-)

diff --git a/packages/base/src/UI5Element.js b/packages/base/src/UI5Element.js
index 592b3977b327..c0045cf225c5 100644
--- a/packages/base/src/UI5Element.js
+++ b/packages/base/src/UI5Element.js
@@ -217,7 +217,7 @@ class UI5Element extends HTMLElement {
 	}
 
 	static get observedAttributes() {
-		const observedProps = this.getMetadata().getObservedProps();
+		const observedProps = this.getMetadata().getPublicPropsList();
 		return observedProps.map(camelToKebabCase);
 	}
 
@@ -268,8 +268,8 @@ class UI5Element extends HTMLElement {
 	}
 
 	_upgradeAllProperties() {
-		const observedProps = this.constructor.getMetadata().getObservedProps();
-		observedProps.forEach(this._upgradeProperty.bind(this));
+		const allProps = this.constructor.getMetadata().getPropsList();
+		allProps.forEach(this._upgradeProperty.bind(this));
 	}
 
 	static define() {
diff --git a/packages/base/src/UI5ElementMetadata.js b/packages/base/src/UI5ElementMetadata.js
index 5aae795b8a98..f68d50a2a970 100644
--- a/packages/base/src/UI5ElementMetadata.js
+++ b/packages/base/src/UI5ElementMetadata.js
@@ -17,11 +17,12 @@ class UI5ElementMetadata {
 		return this.metadata.defaultSlot || "content";
 	}
 
-	getObservedProps() {
-		const properties = this.getProperties();
-		const allProps = Object.keys(properties);
-		const observedProps = allProps.filter(UI5ElementMetadata.isPublicProperty);
-		return observedProps;
+	getPropsList() {
+		return Object.keys(this.getProperties());
+	}
+
+	getPublicPropsList() {
+		return this.getPropsList().filter(UI5ElementMetadata.isPublicProperty);
 	}
 
 	getSlots() {
@@ -99,7 +100,16 @@ const validateSingleSlot = (value, slotData) => {
 	const slottedNodes = getSlottedNodes(value);
 	slottedNodes.forEach(el => {
 		if (!(el instanceof propertyType)) {
-			throw new Error(`${el} is not of type ${propertyType}`);
+			const isHTMLElement = el instanceof HTMLElement;
+			const tagName = isHTMLElement && el.tagName.toLowerCase();
+			const isCustomElement = isHTMLElement && tagName.includes("-");
+			if (isCustomElement) {
+				window.customElements.whenDefined(tagName).then(() => {
+					if (!(el instanceof propertyType)) {
+						throw new Error(`${el} is not of type ${propertyType}`);
+					}
+				});
+			}
 		}
 	});
 
diff --git a/packages/main/src/List.js b/packages/main/src/List.js
index 1c01d8e5715a..0fbb37f9dcc1 100644
--- a/packages/main/src/List.js
+++ b/packages/main/src/List.js
@@ -9,9 +9,6 @@ import ListItemBase from "./ListItemBase.js";
 import ListMode from "./types/ListMode.js";
 import ListSeparators from "./types/ListSeparators.js";
 import ListItemType from "./types/ListItemType.js";
-import StandardListItem from "./StandardListItem.js";
-import CustomListItem from "./CustomListItem.js";
-import GroupHeaderListItem from "./GroupHeaderListItem.js";
 // Template
 import ListRenderer from "./build/compiled/ListRenderer.lit.js";
 
@@ -589,16 +586,6 @@ class List extends UI5Element {
 			},
 		};
 	}
-
-	static async define(...params) {
-		await Promise.all([
-			StandardListItem.define(),
-			CustomListItem.define(),
-			GroupHeaderListItem.define(),
-		]);
-
-		super.define(...params);
-	}
 }
 
 Bootstrap.boot().then(_ => {