@schukai/monster 4.152.0 → 4.153.0

package/test/cases/components/time/month-calendar.mjs

@@ -0,0 +1,100 @@
+import { expect } from "chai";
+import { initJSDOM } from "../../../util/jsdom.mjs";
+import { ATTRIBUTE_ERRORMESSAGE } from "../../../../source/dom/constants.mjs";
+
+describe("MonthCalendar date configuration", () => {
+	let MonthCalendar;
+	before(async () => {
+		await initJSDOM();
+		({ MonthCalendar } = await import(
+			"../../../../source/components/time/month-calendar.mjs"
+		));
+	});
+	afterEach(() => document.getElementById("mocks").replaceChildren());
+	const updates = () => new Promise((resolve) => setTimeout(resolve, 30));
+	const currentDays = (calendar) =>
+		calendar.getOption("calendarDays").filter((day) => day.isCurrentMonth);
+	it("applies JSON options and refreshes the rendered grid after setOption", async () => {
+		const mocks = document.getElementById("mocks");
+		mocks.innerHTML =
+			'<monster-month-calendar data-monster-options=\'{"startDate":"2024-02-01"}\'></monster-month-calendar>';
+		const calendar = mocks.firstElementChild;
+		await updates();
+		expect(currentDays(calendar)).to.have.length(29);
+		expect(currentDays(calendar)[0].day).to.equal("2024-02-01");
+		calendar.setOption("startDate", "2026-09-01");
+		await updates();
+		expect(currentDays(calendar)).to.have.length(30);
+		expect(
+			calendar.shadowRoot.querySelector('[data-monster-day="2026-09-01"]'),
+		).to.not.equal(null);
+		calendar.setAttribute("data-monster-option-start-date", "2026-10-01");
+		await updates();
+		expect(currentDays(calendar)[0].day).to.equal("2026-10-01");
+	});
+	it("keeps the last valid grid for invalid input and recovers without clearing other errors", async () => {
+		const calendar = document.createElement("monster-month-calendar");
+		calendar.setOption("startDate", "2026-03-01");
+		document.getElementById("mocks").append(calendar);
+		await updates();
+		calendar.setAttribute(ATTRIBUTE_ERRORMESSAGE, "unrelated");
+		for (const invalid of ["not-a-date", "2026-02-30", null, new Date(NaN)]) {
+			calendar.setOption("startDate", invalid);
+			await updates();
+			expect(currentDays(calendar)[0].day).to.equal("2026-03-01");
+			expect(calendar.getAttribute(ATTRIBUTE_ERRORMESSAGE)).to.contain(
+				"Invalid calendar date",
+			);
+		}
+		calendar.setOption("startDate", new Date(2026, 10, 1));
+		await updates();
+		expect(currentDays(calendar)[0].day).to.equal("2026-11-01");
+		expect(calendar.getAttribute(ATTRIBUTE_ERRORMESSAGE)).to.contain(
+			"unrelated",
+		);
+		expect(calendar.getAttribute(ATTRIBUTE_ERRORMESSAGE)).not.to.contain(
+			"Invalid calendar date",
+		);
+	});
+	it("constructs invalid-default subclasses with a usable local-month fallback", async () => {
+		class InvalidCalendar extends MonthCalendar {
+			get defaults() {
+				return { ...super.defaults, startDate: null };
+			}
+		}
+		customElements.define("monster-test-invalid-calendar", InvalidCalendar);
+		const calendar = document.createElement("monster-test-invalid-calendar");
+		expect(calendar).to.be.instanceOf(InvalidCalendar);
+		document.getElementById("mocks").append(calendar);
+		await updates();
+		expect(currentDays(calendar)[0].month).to.equal(new Date().getMonth() + 1);
+		expect(calendar.getOption("calendarDays")).to.have.length(42);
+	});
+	it("keeps day interactions and weekday updates working after changing months", async () => {
+		const calendar = document.createElement("monster-month-calendar");
+		document.getElementById("mocks").append(calendar);
+		calendar.setOption("startDate", "2026-09-01");
+		await updates();
+		calendar.setOption("startDate", "2026-10-01");
+		calendar.setOption("locale.weekdayFormat", "long");
+		await updates();
+		const cell = calendar.shadowRoot.querySelector(
+			'[data-monster-day="2026-10-01"]',
+		);
+		// JSDOM has no hit testing; browsers use their native implementation.
+		calendar.shadowRoot.elementFromPoint ??= () => null;
+		const more = cell.querySelector('[data-monster-role="more-appointments"]');
+		more.dispatchEvent(
+			new window.MouseEvent("click", { bubbles: true, view: window }),
+		);
+		expect(
+			cell.querySelector('[data-monster-role="appointment-popper"]').style
+				.display,
+		).to.equal("block");
+		expect(calendar.getOption("calendarWeekdays")[0].label).to.equal("Monday");
+		const days = calendar.getOption("calendarDays");
+		calendar.setOption("labels.__update", true);
+		await updates();
+		expect(calendar.getOption("calendarDays")).to.equal(days);
+	});
+});

package/test/cases/data/transformer.mjs

@@ -30,6 +30,13 @@ describe('Transformer', function () {
 
         const isNode = typeof global === 'object' && '[object global]' === global.toString.call(global);
 
+        let previousLanguage;
+        beforeEach(() => {
+            previousLanguage = document.documentElement.lang;
+            document.documentElement.lang = isNode ? 'en-US' : 'en-GB';
+        });
+        afterEach(() => { document.documentElement.lang = previousLanguage; });
+
 
         [
             ['datetimeformat', "2023-02-04 08:02:01", "Feb 4, 2023, 08:02:01", "4 Feb 2023, 08:02:01"],

package/test/cases/dom/customcontrol.mjs

@@ -19,11 +19,7 @@ describe('DOM', function () {
     let CustomControl, registerCustomElement, TestComponent, document, jsdomFlag;
 
     before(function (done) {
-        initJSDOM({}).then(() => {
-
-            import("element-internals-polyfill").then((m) => {
-                m.polyfill();
-            });
+        initJSDOM({}).then(() => import("element-internals-polyfill")).then(() => {
 
             // jsdom does not support ElementInternals
             jsdomFlag = navigator.userAgent.includes("jsdom");
@@ -56,7 +52,7 @@ describe('DOM', function () {
             }).catch((e) => {
                 done(e);
             });
-        });
+        }).catch(done);
     })
 
     describe('formDisabledCallback()', function () {

package/test/cases/dom/ready.mjs

@@ -25,7 +25,7 @@ describe('Ready', function () {
     describe('domReady', function () {
 
         it('resolve promise', function (done) {
-            domReady.then(done).catch(e => done(e));
+            domReady.then(() => done()).catch(e => done(e));
         });
 
     });
@@ -33,10 +33,10 @@ describe('Ready', function () {
     describe('windowReady', function () {
 
         it('resolve promise', function (done) {
-            windowReady.then(done).catch(e => done(e));
+            windowReady.then(() => done()).catch(e => done(e));
         });
 
     });
 
 
-});
+});

package/test/cases/dom/resource-availability.mjs

@@ -0,0 +1,46 @@
+import { expect } from "chai";
+import { initJSDOM } from "../../util/jsdom.mjs";
+import { Script } from "../../../source/dom/resource/script.mjs";
+import { referenceSymbol } from "../../../source/dom/resource.mjs";
+import { internalStateSymbol } from "../../../source/constants.mjs";
+
+describe("Resource availability", () => {
+	let resource;
+	before(() => initJSDOM());
+	beforeEach(() => {
+		resource = new Script({
+			src: "/resource-test.js",
+			type: "application/json",
+			timeout: 30,
+		}).connect();
+	});
+	afterEach(() => resource[referenceSymbol].remove());
+	const outcome = (promise) =>
+		promise.then(
+			() => "loaded",
+			(error) => error,
+		);
+	for (const event of ["load", "error"]) {
+		it(`settles every pending and late consumer consistently on ${event}`, async () => {
+			const pending = Array.from({ length: 3 }, () =>
+				outcome(resource.available()),
+			);
+			resource[referenceSymbol].dispatchEvent(new Event(event));
+			const results = await Promise.all(pending);
+			const late = await outcome(resource.available());
+			for (const result of results) expect(result).to.equal(late);
+			if (event === "load") expect(late).to.equal("loaded");
+			else expect(late).to.contain("is not available");
+			expect(resource[internalStateSymbol].observers.observers).to.have.length(
+				0,
+			);
+		});
+	}
+	it("detaches timed-out consumers and still permits a later successful wait", async () => {
+		expect(await outcome(resource.available())).to.equal("timeout");
+		expect(resource[internalStateSymbol].observers.observers).to.have.length(0);
+		const next = resource.available();
+		resource[referenceSymbol].dispatchEvent(new Event("load"));
+		await next;
+	});
+});

package/test/cases/dom/resourcemanager.mjs

@@ -93,16 +93,22 @@ describe('ResourceManager', function () {
 
 
         describe('check availability resources', function () {
-            it('add script and check availability should return Promise', function () {
-                expect(manager.addScript('/example.js').available()).to.be.instanceOf(Promise);
+            it('add script and check availability should return Promise', async function () {
+                const available = manager.addScript('/example.js').available();
+                expect(available).to.be.instanceOf(Promise);
+                expect(await available.then(() => 'unexpected success', String)).to.equal('no element');
             });
 
-            it('add style and check availability should should return Promise', function () {
-                expect(manager.addStylesheet('/style.js').available()).to.be.instanceOf(Promise);
+            it('add style and check availability should should return Promise', async function () {
+                const available = manager.addStylesheet('/style.js').available();
+                expect(available).to.be.instanceOf(Promise);
+                expect(await available.then(() => 'unexpected success', String)).to.equal('no element');
             });
 
-            it('add data and check availability  should should return Promise', function () {
-                expect(manager.addData(validDataURL, {allowedOrigins}).available()).to.be.instanceOf(Promise);
+            it('add data and check availability  should should return Promise', async function () {
+                const available = manager.addData(validDataURL, {allowedOrigins}).available();
+                expect(available).to.be.instanceOf(Promise);
+                expect(await available.then(() => 'unexpected success', String)).to.equal('no element');
             });
         })
 

package/test/cases/dom/sanitize-html.mjs

@@ -0,0 +1,71 @@
+import { expect } from "chai";
+import { initJSDOM } from "../../util/jsdom.mjs";
+import { sanitizeHtml } from "../../../source/dom/sanitize-html.mjs";
+import { sanitizeViewerHtml } from "../../../source/components/content/viewer/sanitize-html.mjs";
+
+describe("HTML sanitization", () => {
+	before(() => initJSDOM());
+	for (const [name, sanitize] of [
+		["general", sanitizeHtml],
+		["viewer", sanitizeViewerHtml],
+	]) {
+		it(`${name}: removes executable and obfuscated links`, () => {
+			const root = document.createElement("div");
+			root.innerHTML = sanitize(
+				'<a href="jav&#x09;ascript:window.bad=true" onclick="window.bad=true">one</a><a href=" DATA:text/html,test">two</a><svg><a xlink:href="vbscript:test">three</a></svg>',
+			);
+			for (const link of root.querySelectorAll("a")) {
+				expect(link.hasAttribute("href")).to.equal(false);
+				expect(link.hasAttribute("xlink:href")).to.equal(false);
+				expect(link.hasAttribute("onclick")).to.equal(false);
+			}
+		});
+		it(`${name}: removes active SVG while preserving static graphics and formatting`, () => {
+			const root = document.createElement("div");
+			root.innerHTML = sanitize(
+				'<strong>Text</strong><table><tbody><tr><td>Cell</td></tr></tbody></table><svg viewBox="0 0 10 10"><path d="M0 0h10v10z" fill="red"/><a><animate attributeName="href" values="javascript:test"/><set attributeName="href" to="javascript:test"/><animateMotion path="M0 0L1 1"/><animateTransform attributeName="transform"/></a></svg>',
+			);
+			expect(root.querySelector("strong").textContent).to.equal("Text");
+			expect(root.querySelector("td").textContent).to.equal("Cell");
+			expect(root.querySelector("path").getAttribute("d")).to.equal(
+				"M0 0h10v10z",
+			);
+			expect(
+				[...root.querySelectorAll("*")].some((element) =>
+					["animate", "set", "animatemotion", "animatetransform"].includes(
+						element.localName.toLowerCase(),
+					),
+				),
+			).to.equal(false);
+		});
+		it(`${name}: preserves safe links and local images`, () => {
+			for (const href of [
+				"https://example.test/path",
+				"http://example.test",
+				"/path",
+				"../path",
+				"#section",
+				"mailto:test@example.test",
+				"tel:+49123",
+			]) {
+				const root = document.createElement("div");
+				root.innerHTML = sanitize(
+					`<a href="${href}">Link</a><img src="/image.png" alt="Image">`,
+				);
+				expect(root.querySelector("a").getAttribute("href")).to.equal(href);
+				expect(root.querySelector("img").getAttribute("src")).to.equal(
+					"/image.png",
+				);
+			}
+		});
+	}
+	it("sanitizes nested template contents without removing safe templates", () => {
+		const root = document.createElement("div");
+		root.innerHTML = sanitizeHtml(
+			'<div><template><a href="javascript:test">Link</a><script>test</script></template></div>',
+		);
+		const content = root.querySelector("template").content;
+		expect(content.querySelector("a").hasAttribute("href")).to.equal(false);
+		expect(content.querySelector("script")).to.equal(null);
+	});
+});

package/test/cases/dom/updater.mjs

@@ -780,7 +780,7 @@ describe("DOM", function () {
 
       [false, true].forEach((batchUpdates) => {
         it(`should bulk insert and reuse indexed entries with batchUpdates=${batchUpdates} issue #548`, async function () {
-          this.timeout(5000);
+          this.timeout(20000);
           const mocks = document.getElementById("mocks");
           mocks.innerHTML = `
             <template id="bulk-row">

package/test/cases/util/processing.mjs

@@ -12,7 +12,7 @@ describe('Processing', function () {
             let t = +new Date();
 
             const desiredDelay = 200;
-            this.timeout(desiredDelay+100);
+            this.timeout(2000);
             
             // delay 12 
             new Processing((v) => {
@@ -33,7 +33,7 @@ describe('Processing', function () {
                     expect(counter).to.be.equal(4);
                     expect(v === 'test').to.be.true;
                     // check delay
-                    expect(+new Date() > t + desiredDelay+1).to.be.true;
+                    expect(+new Date() >= t + desiredDelay).to.be.true;
                 } catch (e) {
                     return done(e);
                 }
@@ -107,4 +107,4 @@ describe('Processing', function () {
 
     });
 
-});
+});