Automatic tests to load templates

This commit is contained in:
nathan 2024-11-15 16:11:56 -07:00
parent 723c18bd64
commit cddafb54f5
2 changed files with 75 additions and 18 deletions

View File

@ -1,25 +1,25 @@
import {assert, elementUpdated, fixture, html} from "@open-wc/testing";
import {assert, elementUpdated, fixture, html, oneEvent} from "@open-wc/testing";
import * as sinon from "sinon";
import {Et2Template} from "../Et2Template";
/**
* Test file for Template webComponent
*
* In here we test just the simple, basic widget stuff.
* 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;
let element : Et2Template;
async function before()
{
// Create an element to test with, and wait until it's ready
// @ts-ignore
element = await fixture(html`
@ -32,6 +32,19 @@ async function before()
return element;
}
function fakedTemplate(template_text)
{
const parser = new window.DOMParser();
return parser.parseFromString(template_text, "text/xml").children[0];
}
const SIMPLE_EMPTY = `<overlay><template id="simple.empty"></template></overlay>`;
const TEMPLATE_ATTRIBUTES = `<overlay><template id="attributes" class="gotClass" slot="gotSlot"></template></overlay>`;
// Pre-fill cache
Et2Template.templateCache["simple.empty"] = <Element>fakedTemplate(SIMPLE_EMPTY).childNodes.item(0);
Et2Template.templateCache["attributes"] = <Element>fakedTemplate(TEMPLATE_ATTRIBUTES).childNodes.item(0);
describe("Template widget basics", () =>
{
// Setup run before each test
@ -45,22 +58,73 @@ describe("Template widget basics", () =>
{
assert.notExists(element.querySelectorAll("*"), "Not-loaded template has content. It should be empty.");
});
it("shows loader", () =>
{
assert.exists(element.shadowRoot.querySelector(".template--loading"), "Could not find load indicator");
});
});
describe("Loading", () =>
{
beforeEach(before);
it("loads from file", async() =>
{
// Stub the url to point to the fixture
sinon.stub(element, "getUrl").returns("./fixtures/simple.xml");
let xml = fakedTemplate(SIMPLE_EMPTY);
// @ts-ignore
sinon.stub(element, "loadFromFile").returns(xml);
const listener = oneEvent(element, "load");
// Set the template to start load
element.template = "simple.empty";
// Wait for load & load event
await element.updateComplete;
assert.isTrue(element.__isLoading);
const loadEvent = await listener;
assert.exists(loadEvent);
})
it("loads from cache", () =>
it("loads from cache", async() =>
{
// Cache was pre-filled above
const listener = oneEvent(element, "load");
// Set the template to start load
element.template = "simple.empty";
// Wait for load & load event
await element.updateComplete;
const loadEvent = await listener;
assert.exists(loadEvent);
});
it("loads with short name (from cache)", async() =>
{
// Cache was pre-filled above
const listener = oneEvent(element, "load");
// @ts-ignore
sinon.stub(element, "getRoot").returns({
getInstanceManager: () => {return {name: "simple"}}
});
// Set the template to start load, but use "short" name
element.template = "empty";
// Wait for load & load event
await element.updateComplete;
const loadEvent = await listener;
assert.exists(loadEvent);
});
it("takes template attributes", async() =>
{
// Set the template to start load
element.template = "attributes";
// Wait for load
await element.updateComplete;
assert.isTrue(element.classList.contains("gotClass"), "Did not get class from template");
assert.isTrue(element.hasAttribute("slot"), "Did not get slot from template");
assert.equal(element.getAttribute("slot"), "gotSlot", "Did not get slot from template");
});
});

View File

@ -1,7 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE overlay PUBLIC "-//EGroupware GmbH//eTemplate 2.0//EN" "https://www.egroupware.org/etemplate2.0.dtd">
<!-- This template is used in automated testing -->
<overlay>
<template id="api.simple.empty">
</template>
</overlay>