More tests

- load test checking that if a template is not specified, we use the last in the file
- test for namespaces & child elements actually getting their value
- test for giving new data when loading template

api/js/etemplate/Et2Template/Et2Template.ts

@@ -17,7 +17,6 @@ import {Et2InputWidgetInterface} from "../Et2InputWidget/Et2InputWidget";
 import type {IegwAppLocal} from "../../jsapi/egw_global";
 import {until} from "lit/directives/until.js";
 import {classMap} from "lit/directives/class-map.js";
-import {et2_arrayMgr} from "../et2_core_arrayMgr";
 
 // @ts-ignore
 /**
@@ -284,7 +283,8 @@ export class Et2Template extends Et2Widget(LitElement)
 
 		if(typeof newContent != "undefined")
 		{
-			this.setArrayMgr("content", new et2_arrayMgr(newContent));
+			// @ts-ignore ArrayMgr still expects et2_widgets
+			this.setArrayMgr("content", this.getArrayMgr("content").openPerspective(this, newContent));
 		}
 		this.__isLoading = true;
 		this.loading = new Promise(async(resolve, reject) =>

api/js/etemplate/Et2Template/test/Load.test.ts

@@ -40,6 +40,11 @@ function fakedTemplate(template_text)
 
 const SIMPLE_EMPTY = `<overlay><template id="simple.empty"></template></overlay>`;
 const TEMPLATE_ATTRIBUTES = `<overlay><template id="attributes" class="gotClass" slot="gotSlot"></template></overlay>`;
+const MULTIPLE = `<overlay>
+	<template id="multiple.one" class="one"/>
+	<template id="multiple.two" class="two"/>
+	<template id="multiple" class="multiple"></template>
+	</overlay>`;
 
 // Pre-fill cache
 Et2Template.templateCache["simple.empty"] = <Element>fakedTemplate(SIMPLE_EMPTY).childNodes.item(0);
@@ -127,4 +132,24 @@ describe("Loading", () =>
 		assert.isTrue(element.hasAttribute("slot"), "Did not get slot from template");
 		assert.equal(element.getAttribute("slot"), "gotSlot", "Did not get slot from template");
 	});
+	it("loads last template in file when it has no template", async() =>
+	{
+		// Stub the url to point to the fixture
+		let xml = fakedTemplate(MULTIPLE);
+
+		// @ts-ignore
+		sinon.stub(element, "loadFromFile").returns(xml);
+
+		const listener = oneEvent(element, "load");
+
+		// We don't set the template, just give the URL
+		element.url = "load a file that has several template"
+
+		// Wait for load & load event
+		await element.updateComplete;
+		const loadEvent = await listener;
+
+		assert.exists(loadEvent);
+		assert.isTrue(element.classList.contains("multiple"));
+	});
 });

api/js/etemplate/Et2Template/test/Namespace.test.ts

@@ -0,0 +1,144 @@
+import {Et2Template} from "../Et2Template";
+import {Et2Description} from "../../Et2Description/Et2Description";
+import {assert, elementUpdated, fixture, html, oneEvent} from "@open-wc/testing";
+import * as sinon from "sinon";
+import {et2_arrayMgr} from "../../et2_core_arrayMgr";
+
+/**
+ * Test file for Template webComponent
+ *
+ * In here we test just basics and simple loading to avoid as few additional dependencies as possible.
+ */
+// Stub global egw
+// @ts-ignore
+window.egw = {
+	image: () => "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNS4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkViZW5lXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMzJweCIgaGVpZ2h0PSIzMnB4IiB2aWV3Qm94PSIwIDAgMzIgMzIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMyIDMyIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBmaWxsPSIjNjk2OTY5IiBkPSJNNi45NDMsMjguNDUzDQoJYzAuOTA2LDAuNzY1LDIuMDk3LDEuMTI3LDMuMjg2LDEuMTA5YzAuNDMsMC4wMTQsMC44NTItMC4wNjgsMS4yNjUtMC4yMDdjMC42NzktMC4xOCwxLjMyOC0wLjQ1LDEuODY2LTAuOTAyTDI5LjQwMywxNC45DQoJYzEuNzcyLTEuNDk4LDEuNzcyLTMuOTI1LDAtNS40MjJjLTEuNzcyLTEuNDk3LTQuNjQ2LTEuNDk3LTYuNDE4LDBMMTAuMTE5LDIwLjM0OWwtMi4zODktMi40MjRjLTEuNDQtMS40NTctMy43NzItMS40NTctNS4yMTIsMA0KCWMtMS40MzgsMS40Ni0xLjQzOCwzLjgyNSwwLDUuMjgxQzIuNTE4LDIzLjIwNiw1LjQ3NCwyNi45NDcsNi45NDMsMjguNDUzeiIvPg0KPC9zdmc+DQo=",
+	lang: i => i + "",
+	link: i => i,
+	tooltipUnbind: () => { },
+	webserverUrl: ""
+};
+let element : Et2Template;
+let keepImport : Et2Description = new Et2Description();
+
+async function before()
+{
+	// Create an element to test with, and wait until it's ready
+	// @ts-ignore
+	element = await fixture(html`
+        <et2-template>
+        </et2-template>
+	`);
+	// Stub egw()
+	sinon.stub(element, "egw").returns(window.egw);
+	await elementUpdated(element);
+	return element;
+}
+
+function fakedTemplate(template_text)
+{
+	const parser = new window.DOMParser();
+	return parser.parseFromString(template_text, "text/xml").children[0];
+}
+
+const SIMPLE = `<overlay><template id="simple">
+<et2-description id="static" value="Static value"></et2-description>
+<et2-description id="test"></et2-description>
+</template></overlay>`;
+
+// Pre-fill cache
+Et2Template.templateCache["simple"] = <Element>fakedTemplate(SIMPLE).childNodes.item(0);
+
+describe("Namespaces", () =>
+{
+	// Setup run before each test
+	beforeEach(before);
+	it("Does not create a namespace with no 'content'", async() =>
+	{
+		const listener = oneEvent(element, "load");
+		element.setArrayMgr("content", new et2_arrayMgr({
+			test: "Test"
+		}));
+
+		// Set the template to start load
+		element.template = "simple";
+
+		// Wait for load & load event
+		await element.updateComplete;
+		const loadEvent = await listener;
+
+		const staticElement = element.querySelector(":scope > *:first-of-type");
+		assert.isNotNull(staticElement, "Did not find test element");
+		assert.equal(staticElement.getAttribute("id"), "static", "Static child ID was wrong");
+		assert.equal(staticElement.innerText, "Static value");
+
+		const dynamicElement = element.querySelector(":scope > *:last-of-type");
+		assert.isNotNull(dynamicElement, "Did not find test element");
+		assert.equal(dynamicElement.getAttribute("id"), "test", "Dynamic child ID was wrong");
+		assert.equal(dynamicElement.innerText, "Test");
+	});
+
+	/**
+	 * Test creating a namespace on the template.
+	 * This means we expect all child elements to include the template ID as part of their ID,
+	 * and they should be given the correct part of the content array.
+	 */
+	it("Creates a namespace when content is set", async() =>
+	{
+		const listener = oneEvent(element, "load");
+		element.setArrayMgr("content", new et2_arrayMgr({
+			test: "Top level",
+			sub: {
+				test: "Namespaced"
+			}
+		}));
+
+		element.content = "sub";
+		// Set the template to start load
+		element.template = "simple";
+
+		// Wait for load & load event
+		await element.updateComplete;
+		const loadEvent = await listener;
+
+		const staticElement = element.querySelector(":scope > *:first-of-type");
+		assert.isNotNull(staticElement, "Did not find test element");
+		assert.equal(staticElement.getAttribute("id"), "sub_static", "Child ID was not namespaced");
+		assert.equal(staticElement.innerText, "Static value");
+
+		const dynamicElement = element.querySelector(":scope > *:last-of-type");
+		assert.isNotNull(dynamicElement, "Did not find test element");
+		assert.notEqual(dynamicElement.getAttribute("id"), "Top level");
+		assert.equal(dynamicElement.innerText, "Namespaced");
+	});
+
+	it("Can replace data when loading", async() =>
+	{
+		const listener = oneEvent(element, "load");
+		element.setArrayMgr("content", new et2_arrayMgr({
+			test: "Test"
+		}));
+
+		// Set the template to start load
+		element.template = "simple";
+
+		// Wait for load & load event
+		await element.updateComplete;
+		const loadEvent = await listener;
+
+		const staticElement = element.querySelector(":scope > *:first-of-type");
+		assert.isNotNull(staticElement, "Did not find test element");
+		assert.equal(staticElement.innerText, "Static value");
+
+		let dynamicElement = element.querySelector(":scope > *:last-of-type");
+		assert.isNotNull(dynamicElement, "Did not find test element");
+		assert.equal(dynamicElement.innerText, "Test");
+
+		// Now load new data
+		await element.load({test: "Success"});
+
+		// Old element was destroyed, get the new one
+		dynamicElement = element.querySelector(":scope > *:last-of-type");
+		assert.equal(dynamicElement.innerText, "Success", "Element did not get new value when template was loaded with new data");
+	});
+});