@schukai/monster 4.154.0 → 4.154.1

package/package.json

@@ -1 +1 @@
-{"author":"Volker Schukai","dependencies":{"@floating-ui/dom":"^1.7.6"},"description":"Monster is a simple library for creating fast, robust and lightweight websites.","exports":{".":"./source/monster.mjs","./CHANGELOG.md":"./CHANGELOG.md","./LICENSE":"./LICENSE","./README.md":"./README.md","./package.json":"./package.json","./source/*":"./source/*","./test/*":"./test/*"},"files":["source","test/cases","test/util","CHANGELOG.md"],"homepage":"https://monsterjs.org/","keywords":["framework","web","dom","css","sass","mobile-first","app","front-end","templates","schukai","core","shopcloud","alvine","monster","buildmap","stack","observer","observable","uuid","node","nodelist","css-in-js","logger","log","theme"],"license":"AGPL 3.0","main":"source/monster.mjs","module":"source/monster.mjs","name":"@schukai/monster","repository":{"type":"git","url":"https://gitlab.schukai.com/oss/libraries/javascript/monster.git"},"sideEffects":["./source/monster.mjs","./source/components/**","./source/i18n/**","./test/**"],"type":"module","version":"4.154.0"}
+{"author":"Volker Schukai","dependencies":{"@floating-ui/dom":"^1.7.6"},"description":"Monster is a simple library for creating fast, robust and lightweight websites.","exports":{".":"./source/monster.mjs","./CHANGELOG.md":"./CHANGELOG.md","./LICENSE":"./LICENSE","./README.md":"./README.md","./package.json":"./package.json","./source/*":"./source/*","./test/*":"./test/*"},"files":["source","test/cases","test/util","CHANGELOG.md"],"homepage":"https://monsterjs.org/","keywords":["framework","web","dom","css","sass","mobile-first","app","front-end","templates","schukai","core","shopcloud","alvine","monster","buildmap","stack","observer","observable","uuid","node","nodelist","css-in-js","logger","log","theme"],"license":"AGPL 3.0","main":"source/monster.mjs","module":"source/monster.mjs","name":"@schukai/monster","repository":{"type":"git","url":"https://gitlab.schukai.com/oss/libraries/javascript/monster.git"},"sideEffects":["./source/monster.mjs","./source/components/**","./source/i18n/**","./test/**"],"type":"module","version":"4.154.1"}

package/test/cases/components/datatable/drag-scroll.mjs

@@ -6,6 +6,25 @@ import { ResizeObserverMock } from "../../../util/resize-observer.mjs";
 const expect = chai.expect;
 chai.use(chaiDom);
 
+/**
+ * Waits for a value to appear instead of for a fixed delay.
+ *
+ * The components under test attach their ResizeObserver inside a
+ * requestAnimationFrame, so the precondition is a frame, not a number of
+ * milliseconds. A headless browser without a compositor schedules frames less
+ * regularly, which is why a fixed 30ms wait failed in CI webkit while passing
+ * everywhere else. The deadline keeps a genuine absence failing.
+ */
+async function waitForValue(produce, timeout = 2000, interval = 10) {
+	const deadline = Date.now() + timeout;
+	for (;;) {
+		const value = produce();
+		if (value !== undefined && value !== null) return value;
+		if (Date.now() >= deadline) return value;
+		await new Promise((resolve) => setTimeout(resolve, interval));
+	}
+}
+
 // Supply geometry before the first layout can populate the measurement cache.
 function installColumnBarGeometry(parentWidth) {
 	const original = HTMLElement.prototype.getBoundingClientRect;
@@ -434,10 +453,13 @@ describe("Datatable drag scroll", function () {
 			);
 			expect(control).to.exist;
 			expect(control.classList.contains("small")).to.equal(false);
-			expect(TrackingResizeObserver.instances).to.have.length.greaterThan(0);
-			const tableResizeObserver = TrackingResizeObserver.instances.find(
-				(observer) => observer.elements.includes(wrapper),
+			const tableResizeObserver = await waitForValue(() =>
+				TrackingResizeObserver.instances.find((observer) =>
+					observer.elements.includes(wrapper),
+				),
 			);
+
+			expect(TrackingResizeObserver.instances).to.have.length.greaterThan(0);
 			expect(tableResizeObserver).to.exist;
 
 			let scheduledCallback = null;
@@ -456,6 +478,10 @@ describe("Datatable drag scroll", function () {
 			scheduledCallback();
 
 			expect(control.classList.contains("small")).to.equal(true);
+
+			// The responsive layout stays in the document otherwise, and the
+			// browser keeps rendering it for the rest of the run.
+			wrapper.remove();
 		} finally {
 			window.ResizeObserver = OriginalResizeObserver;
 			globalThis.ResizeObserver = originalGlobalResizeObserver;
@@ -546,8 +572,10 @@ describe("Datatable drag scroll", function () {
 				dotsContainer.querySelector(".dots-overflow-indicator"),
 			).to.equal(null);
 
-			const columnBarResizeObserver = TrackingResizeObserver.instances.find(
-				(observer) => observer.elements.includes(control),
+			const columnBarResizeObserver = await waitForValue(() =>
+				TrackingResizeObserver.instances.find((observer) =>
+					observer.elements.includes(control),
+				),
 			);
 			expect(columnBarResizeObserver).to.exist;
 
@@ -660,11 +688,15 @@ describe("Datatable drag scroll", function () {
 			const first = await createColumnBar();
 			const second = await createColumnBar();
 
-			const firstResizeObserver = TrackingResizeObserver.instances.find(
-				(observer) => observer.elements.includes(first.control),
+			const firstResizeObserver = await waitForValue(() =>
+				TrackingResizeObserver.instances.find((observer) =>
+					observer.elements.includes(first.control),
+				),
 			);
-			const secondResizeObserver = TrackingResizeObserver.instances.find(
-				(observer) => observer.elements.includes(second.control),
+			const secondResizeObserver = await waitForValue(() =>
+				TrackingResizeObserver.instances.find((observer) =>
+					observer.elements.includes(second.control),
+				),
 			);
 
 			expect(firstResizeObserver).to.exist;

package/test/cases/components/navigation/site-navigation.mjs

@@ -77,7 +77,16 @@ describe("SiteNavigation", function () {
 			resizeObserver.triggerResize([]);
 			resizeObserver.triggerResize([]);
 
-			await new Promise(resolve => setTimeout(resolve, 260));
+			// The component debounces resizes with a 200ms DeadMansSwitch and then
+			// requests exactly one frame. Waiting 260ms left 60ms of margin over
+			// that debounce, which is not enough under software rendering: the run
+			// then measured zero scheduled frames. Waiting for the first request
+			// keeps the coalescing assertion strict without assuming wall clock.
+			const deadline = Date.now() + 5000;
+			while (scheduledCallbacks.length === 0 && Date.now() < deadline) {
+				await new Promise((resolve) => setTimeout(resolve, 10));
+			}
+
 			expect(scheduledCallbacks.length).to.equal(1);
 			scheduledCallbacks.shift()();
 		} finally {