@schukai/monster 4.152.0 → 4.153.1

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/buildmap.mjs

@@ -6,6 +6,20 @@ import {buildMap} from "../../../source/data/buildmap.mjs";
 
 describe('buildMap', function () {
 
+    describe('falsy keys and literal replacements issue #569', function () {
+        it('should preserve a zero key returned by a selector callback', function () {
+            const value = {label: 'zero'};
+            const map = buildMap({}, () => new Map([[0, value]]), '${label}');
+            expect([...map]).to.deep.equal([[0, 'zero']]);
+        });
+
+        it('should insert replacement tokens literally', function () {
+            const value = {label: '$&-$`-$\''};
+            const map = buildMap({}, () => new Map([['key', value]]), '${label}');
+            expect(map.get('key')).to.equal('$&-$`-$\'');
+        });
+    });
+
     let convertMapResult = function (r) {
         if (r instanceof Map) {
             r = Object.fromEntries(r);

package/test/cases/data/buildtree.mjs

@@ -170,6 +170,55 @@ describe('buildTree', function () {
 
     });
 
+    describe('parent metadata issue #568', function () {
+        const createTree = (records) => buildTree(
+            records,
+            (values) => new Map(values.map((value, index) => [index, value])),
+            'id',
+            'parent',
+        );
+
+        [
+            [
+                {id: 1, parent: null},
+                {id: 2, parent: 1},
+                {id: 3, parent: 2},
+            ],
+            [
+                {id: 3, parent: 2},
+                {id: 2, parent: 1},
+                {id: 1, parent: null},
+            ],
+        ].forEach((records, index) => {
+            it(`should retain immediate parents independent of input order ${index + 1}`, function () {
+                const tree = createTree(records);
+                const root = [...tree][0];
+                const child = [...root.childNodes][0];
+                const leaf = [...child.childNodes][0];
+
+                expect(root.parent).to.equal(null);
+                expect(root.level).to.equal(0);
+                expect(child.parent).to.equal(root);
+                expect(child.level).to.equal(1);
+                expect(leaf.parent).to.equal(child);
+                expect(leaf.level).to.equal(2);
+            });
+        });
+
+        it('should preserve frozen input records and their identity', function () {
+            const rootValue = Object.freeze({id: 1, parent: null});
+            const childValue = Object.freeze({id: 2, parent: 1});
+            const tree = createTree(Object.freeze([childValue, rootValue]));
+            const root = [...tree][0];
+            const child = [...root.childNodes][0];
+
+            expect(root.value).to.equal(rootValue);
+            expect(child.value).to.equal(childValue);
+            expect(Reflect.ownKeys(rootValue)).to.deep.equal(['id', 'parent']);
+            expect(Reflect.ownKeys(childValue)).to.deep.equal(['id', 'parent']);
+        });
+    });
+
     describe('buildTree() test 2', function () {
 
         /**

package/test/cases/data/pathfinder.mjs

@@ -17,6 +17,8 @@ describe('Pathfinder', function () {
             `constructor.prototype.${probe}`,
             ['__proto__', probe],
             ['constructor', 'prototype', probe],
+            [`safe.__proto__`, probe],
+            [`safe.constructor.prototype`, probe],
         ].forEach(function (path) {
             it(`setVia(${JSON.stringify(path)}) should reject unsafe mutation paths`, function () {
                 try {
@@ -108,6 +110,38 @@ describe('Pathfinder', function () {
             expect(() => new Pathfinder({values}).setVia('values.next', {}))
                 .to.throw(Error, 'unsupported action for this data type in setValueViaPath');
         });
+
+        it('exists() should use collection membership semantics', function () {
+            expect(new Pathfinder(new Map([['entry', 0]])).exists('entry')).to.equal(true);
+            expect(new Pathfinder(new Map()).exists('entry')).to.equal(false);
+            expect(new Pathfinder(new Set([false])).exists('0')).to.equal(true);
+            expect(new Pathfinder(new Set()).exists('0')).to.equal(false);
+        });
+
+        it('wildcards should enumerate Map and Set values', function () {
+            expect([...new Pathfinder(new Map([['entry', false]])).getVia('*')])
+                .to.deep.equal([['entry', false]]);
+            expect([...new Pathfinder(new Set(['first', 'second'])).getVia('*')])
+                .to.deep.equal([['0', 'first'], ['1', 'second']]);
+        });
+
+        it('collection indices should reject trailing characters', function () {
+            expect(() => new Pathfinder(['first', 'second']).getVia('1suffix'))
+                .to.throw(TypeError);
+            expect(() => new Pathfinder(new Set(['first', 'second'])).getVia('1suffix'))
+                .to.throw(TypeError);
+        });
+
+        it('should support null-prototype objects', function () {
+            const subject = Object.assign(Object.create(null), {present: false});
+            const pathfinder = new Pathfinder(subject);
+
+            expect(pathfinder.getVia('present')).to.equal(false);
+            expect(pathfinder.exists('present')).to.equal(true);
+            expect(pathfinder.exists('missing')).to.equal(false);
+            pathfinder.setVia('next', 0);
+            expect(subject.next).to.equal(0);
+        });
     });
 
     let convertMapResult = function (r) {

package/test/cases/data/transformer.mjs

@@ -8,6 +8,32 @@ import {initJSDOM} from "../../util/jsdom.mjs";
 
 describe('Transformer', function () {
 
+    describe('falsy property values issue #569', function () {
+        [
+            ['key:value:fallback', {value: 0}, 0],
+            ['property:value:fallback', {value: false}, false],
+            ['index:0:fallback', [''], ''],
+            ['key:value:fallback', {value: null}, null],
+            ['first-key:fallback', {a: false}, false],
+            ['last-key:fallback', {a: 1, z: 0}, 0],
+        ].forEach(([definition, value, expected]) => {
+            it(`${definition} should preserve ${String(expected)}`, function () {
+                expect(new Transformer(definition).run(value)).to.equal(expected);
+            });
+        });
+
+        it('should distinguish inherited and missing properties', function () {
+            const inherited = Object.create({value: false});
+            expect(new Transformer('key:value:fallback').run(inherited)).to.equal(false);
+            expect(new Transformer('key:missing:fallback').run(inherited)).to.equal('fallback');
+        });
+
+        it('should support null-prototype objects', function () {
+            const value = Object.assign(Object.create(null), {entry: 0});
+            expect(new Transformer('key:entry:fallback').run(value)).to.equal(0);
+        });
+    });
+
     before(function (done) {
 
         let promises = []
@@ -30,6 +56,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 () {
@@ -388,6 +384,91 @@ describe('DOM', function () {
                     control.remove();
                 });
 
+                it('should not let a stale value attribute overwrite a newer property issue #566', async function () {
+                    const htmlTAG = 'monster-customcontrol-value-race-566';
+
+                    class ValueRaceComponent extends CustomControl {
+                        static getTag() {
+                            return htmlTAG;
+                        }
+
+                        get defaults() {
+                            return Object.assign({}, super.defaults, {shadowMode: false});
+                        }
+
+                        get value() {
+                            return this._value ?? '';
+                        }
+
+                        set value(value) {
+                            this._value = value;
+                        }
+                    }
+
+                    registerCustomElement(ValueRaceComponent);
+                    const control = document.createElement(htmlTAG);
+                    document.body.appendChild(control);
+
+                    control.setAttribute('value', 'attribute-value');
+                    control.value = 'newer-property-value';
+                    await new Promise((resolve) => setTimeout(resolve, 30));
+
+                    expect(control.getAttribute('value')).to.equal('attribute-value');
+                    expect(control.value).to.equal('newer-property-value');
+                    control.remove();
+                });
+
+                it('should coalesce rapid value attributes and preserve reflected setters issue #566', async function () {
+                    const htmlTAG = 'monster-customcontrol-reflected-value-566';
+
+                    class ReflectedValueComponent extends CustomControl {
+                        static getTag() {
+                            return htmlTAG;
+                        }
+
+                        get defaults() {
+                            return Object.assign({}, super.defaults, {shadowMode: false});
+                        }
+
+                        get value() {
+                            return this._value ?? '';
+                        }
+
+                        set value(value) {
+                            this._value = String(value ?? '');
+                            if (this.getAttribute('value') !== this._value) {
+                                this.setAttribute('value', this._value);
+                            }
+                        }
+                    }
+
+                    registerCustomElement(ReflectedValueComponent);
+                    const control = document.createElement(htmlTAG);
+                    document.body.appendChild(control);
+                    control.setAttribute('value', 'first');
+                    control.setAttribute('value', 'second');
+	                    await new Promise((resolve, reject) => {
+	                        const deadline = Date.now() + 500;
+	                        const check = () => {
+	                            if (control.value === 'second') {
+	                                resolve();
+	                            } else if (Date.now() >= deadline) {
+	                                reject(new Error('value attribute synchronization timed out'));
+	                            } else {
+	                                setTimeout(check, 5);
+	                            }
+	                        };
+	                        check();
+	                    });
+                    expect(control.value).to.equal('second');
+
+                    control.value = 'reflected';
+                    await new Promise((resolve) => setTimeout(resolve, 30));
+                    expect(control.value).to.equal('reflected');
+                    expect(control.getAttribute('value')).to.equal('reflected');
+                    control.remove();
+                });
+
                 it('should replay a pre-upgrade value once after assembly issue #501', async function () {
                     const htmlTAG = 'monster-customcontrol-pre-upgrade';
                     const control = document.createElement(htmlTAG);

package/test/cases/dom/customelement.mjs

@@ -587,6 +587,60 @@ describe('DOM', function () {
                     linkedUpdater[internalSymbol].subject.detachObserver(observer);
                 }
             });
+
+            it('should remove stale updater keys after replacing an option object issue #565', async function () {
+                const htmlTAG = 'monster-testclass-object-sync-565';
+
+                if (!customElements.get(htmlTAG)) {
+                    class ObjectSyncComponent extends CustomElement {
+                        static getTag() {
+                            return htmlTAG;
+                        }
+
+                        get defaults() {
+                            return Object.assign({}, super.defaults, {
+                                settings: {a: 'initial', b: 'retained'},
+                                templates: {
+                                    main: '<span data-monster-replace="path:settings.a"></span>',
+                                },
+                            });
+                        }
+                    }
+
+                    registerCustomElement(ObjectSyncComponent);
+                }
+
+                const element = document.createElement(htmlTAG);
+                document.getElementById('test1').appendChild(element);
+                await new Promise((resolve) => setTimeout(resolve, 20));
+
+                let linkedUpdater;
+                for (const group of element[customElementUpdaterLinkSymbol]) {
+                    for (const updater of group) {
+                        linkedUpdater = updater;
+                        break;
+                    }
+                    if (linkedUpdater) break;
+                }
+                expect(linkedUpdater).to.exist;
+
+                element.setOptions({settings: {a: 'merged'}});
+                await new Promise((resolve) => setTimeout(resolve, 20));
+                expect(linkedUpdater.getSubject().settings).to.deep.include({
+                    a: 'merged',
+                    b: 'retained',
+                });
+
+                const settingsProxy = linkedUpdater.getSubject().settings;
+                element.setOption('settings', {a: 'replacement'});
+                await new Promise((resolve) => setTimeout(resolve, 20));
+
+                expect(linkedUpdater.getSubject().settings).to.equal(settingsProxy);
+                expect(linkedUpdater.getSubject().settings).to.deep.equal({
+                    a: 'replacement',
+                });
+                expect(element.shadowRoot.textContent).to.equal('replacement');
+            });
         })
 
         describe('setOptions()', 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);
+	});
+});