kempo-testing-framework 1.2.3 → 1.3.3

package/tests/icon.browser-test.js

@@ -1,54 +1,54 @@
-// Browser tests for Icon component
-
-const nextTick = () => new Promise(r => setTimeout(r));
-
-export const beforeEach = async () => {
-  document.body.innerHTML = '';
-  try { localStorage.removeItem('ktf_settings'); } catch {}
-};
-
-export default {
-  'Icon loads via fetch and caches results': async ({ pass, fail, log }) => {
-    try {
-      await import('/gui/components/Icon.js');
-      const originalFetch = window.fetch;
-      let calls = 0;
-      window.fetch = async (url) => {
-        calls++;
-        if (String(url).endsWith('/icons/test.svg')) {
-          return { ok: true, text: async () => '<svg><g id="ok"/></svg>' };
-        }
-        return { ok: false, text: async () => '' };
-      };
-      const a = document.createElement('ktf-icon');
-      a.name = 'test';
-      document.body.appendChild(a);
-      await nextTick(); await nextTick();
-      const firstLoaded = a.shadowRoot.innerHTML.includes('id="ok"');
-    log(`Network calls after first icon: ${calls}`);
-      window.fetch = async () => { throw new Error('blocked'); };
-      const b = document.createElement('ktf-icon');
-      b.name = 'test';
-      document.body.appendChild(b);
-      await nextTick(); await nextTick();
-      const secondLoaded = b.shadowRoot.innerHTML.includes('id="ok"');
-      window.fetch = originalFetch;
-    if (firstLoaded && secondLoaded) pass('Icon fetched once and loaded cached SVG subsequently'); else fail('Icon did not cache/fetch as expected');
-    } catch (e) { fail(e.stack || String(e)); }
-  },
-
-  'Icon falls back when fetch fails': async ({ pass, fail }) => {
-    try {
-      await import('/gui/components/Icon.js');
-      const originalFetch = window.fetch;
-      window.fetch = async () => ({ ok: false, text: async () => '' });
-      const a = document.createElement('ktf-icon');
-      a.name = 'does-not-exist';
-      document.body.appendChild(a);
-      await nextTick(); await nextTick();
-      const hasSvg = a.shadowRoot.innerHTML.includes('<svg');
-      window.fetch = originalFetch;
-    if (hasSvg) pass('Fallback SVG rendered when fetch failed'); else fail('Fallback SVG missing when fetch failed');
-    } catch (e) { fail(e.stack || String(e)); }
-  }
-};
+// Browser tests for Icon component
+
+const nextTick = () => new Promise(r => setTimeout(r));
+
+export const beforeEach = async () => {
+  document.body.innerHTML = '';
+  try { localStorage.removeItem('ktf_settings'); } catch {}
+};
+
+export default {
+  'Icon loads via fetch and caches results': async ({ pass, fail, log }) => {
+    try {
+      await import('/gui/components/Icon.js');
+      const originalFetch = window.fetch;
+      let calls = 0;
+      window.fetch = async (url) => {
+        calls++;
+        if (String(url).endsWith('/icons/test.svg')) {
+          return { ok: true, text: async () => '<svg><g id="ok"/></svg>' };
+        }
+        return { ok: false, text: async () => '' };
+      };
+      const a = document.createElement('ktf-icon');
+      a.name = 'test';
+      document.body.appendChild(a);
+      await nextTick(); await nextTick();
+      const firstLoaded = a.shadowRoot.innerHTML.includes('id="ok"');
+    log(`Network calls after first icon: ${calls}`);
+      window.fetch = async () => { throw new Error('blocked'); };
+      const b = document.createElement('ktf-icon');
+      b.name = 'test';
+      document.body.appendChild(b);
+      await nextTick(); await nextTick();
+      const secondLoaded = b.shadowRoot.innerHTML.includes('id="ok"');
+      window.fetch = originalFetch;
+    if (firstLoaded && secondLoaded) pass('Icon fetched once and loaded cached SVG subsequently'); else fail('Icon did not cache/fetch as expected');
+    } catch (e) { fail(e.stack || String(e)); }
+  },
+
+  'Icon falls back when fetch fails': async ({ pass, fail }) => {
+    try {
+      await import('/gui/components/Icon.js');
+      const originalFetch = window.fetch;
+      window.fetch = async () => ({ ok: false, text: async () => '' });
+      const a = document.createElement('ktf-icon');
+      a.name = 'does-not-exist';
+      document.body.appendChild(a);
+      await nextTick(); await nextTick();
+      const hasSvg = a.shadowRoot.innerHTML.includes('<svg');
+      window.fetch = originalFetch;
+    if (hasSvg) pass('Fallback SVG rendered when fetch failed'); else fail('Fallback SVG missing when fetch failed');
+    } catch (e) { fail(e.stack || String(e)); }
+  }
+};

package/tests/logs.browser-test.js

@@ -1,47 +1,47 @@
-// Browser tests for Logs component
-
-const nextTick = () => new Promise(r => setTimeout(r));
-
-export const beforeEach = async () => {
-  document.body.innerHTML = '';
-  try { localStorage.removeItem('ktf_settings'); } catch {}
-};
-
-export default {
-  'Logs filters by level and reacts to settings changes': async ({ pass, fail, log }) => {
-    try {
-      const { set: setSettings } = (await import('/gui/components/settingsStore.js')).default?.KTF_SETTINGS || window.KTF_SETTINGS || { set: () => {} };
-      await import('/gui/components/Logs.js');
-      const logs = document.createElement('ktf-logs');
-      document.body.appendChild(logs);
-      await nextTick();
-      logs.addLog({ message: 'L0', level: 0 }, { message: 'L2', level: 2 }, { message: 'L4', level: 4 });
-      await nextTick();
-      const text1 = logs.shadowRoot.textContent;
-      const cond1 = text1.includes('L0') && text1.includes('L2') && !text1.includes('L4');
-    log(`Initial filter text: ${text1.replace(/\s+/g,' ').trim()}`);
-      window.KTF_SETTINGS.set({ logLevel: 4 });
-      await nextTick();
-      const text2 = logs.shadowRoot.textContent;
-      const cond2 = text2.includes('L4');
-    if (cond1 && cond2) pass('Logs filtered by level and reacted to settings change'); else fail('Filtering by level or settings reaction failed');
-    } catch (e) { fail(e.stack || String(e)); }
-  },
-
-  'Logs clear removes previous entries': async ({ pass, fail, log }) => {
-    try {
-      await import('/gui/components/Logs.js');
-      const logs = document.createElement('ktf-logs');
-      document.body.appendChild(logs);
-      await nextTick();
-      logs.addLog({ message: 'A', level: 2 }, { message: 'B', level: 2 });
-      await nextTick();
-      const before = logs.shadowRoot.textContent.includes('A') && logs.shadowRoot.textContent.includes('B');
-      logs.clear();
-      await nextTick();
-      const after = logs.shadowRoot.textContent.trim().length === 0 || !logs.shadowRoot.textContent.includes('A');
-    log(`Before clear contained A/B: ${before}, after clear emptyish: ${after}`);
-    if (before && after) pass('Logs.clear() removed previous entries'); else fail('clear did not remove entries');
-    } catch (e) { fail(e.stack || String(e)); }
-  }
-};
+// Browser tests for Logs component
+
+const nextTick = () => new Promise(r => setTimeout(r));
+
+export const beforeEach = async () => {
+  document.body.innerHTML = '';
+  try { localStorage.removeItem('ktf_settings'); } catch {}
+};
+
+export default {
+  'Logs filters by level and reacts to settings changes': async ({ pass, fail, log }) => {
+    try {
+      const { set: setSettings } = (await import('/gui/components/settingsStore.js')).default?.KTF_SETTINGS || window.KTF_SETTINGS || { set: () => {} };
+      await import('/gui/components/Logs.js');
+      const logs = document.createElement('ktf-logs');
+      document.body.appendChild(logs);
+      await nextTick();
+      logs.addLog({ message: 'L0', level: 0 }, { message: 'L2', level: 2 }, { message: 'L4', level: 4 });
+      await nextTick();
+      const text1 = logs.shadowRoot.textContent;
+      const cond1 = text1.includes('L0') && text1.includes('L2') && !text1.includes('L4');
+    log(`Initial filter text: ${text1.replace(/\s+/g,' ').trim()}`);
+      window.KTF_SETTINGS.set({ logLevel: 4 });
+      await nextTick();
+      const text2 = logs.shadowRoot.textContent;
+      const cond2 = text2.includes('L4');
+    if (cond1 && cond2) pass('Logs filtered by level and reacted to settings change'); else fail('Filtering by level or settings reaction failed');
+    } catch (e) { fail(e.stack || String(e)); }
+  },
+
+  'Logs clear removes previous entries': async ({ pass, fail, log }) => {
+    try {
+      await import('/gui/components/Logs.js');
+      const logs = document.createElement('ktf-logs');
+      document.body.appendChild(logs);
+      await nextTick();
+      logs.addLog({ message: 'A', level: 2 }, { message: 'B', level: 2 });
+      await nextTick();
+      const before = logs.shadowRoot.textContent.includes('A') && logs.shadowRoot.textContent.includes('B');
+      logs.clear();
+      await nextTick();
+      const after = logs.shadowRoot.textContent.trim().length === 0 || !logs.shadowRoot.textContent.includes('A');
+    log(`Before clear contained A/B: ${before}, after clear emptyish: ${after}`);
+    if (before && after) pass('Logs.clear() removed previous entries'); else fail('clear did not remove entries');
+    } catch (e) { fail(e.stack || String(e)); }
+  }
+};

package/tests/setting-checkbox.browser-test.js

@@ -1,48 +1,48 @@
-// Browser tests for SettingCheckbox component
-
-const nextTick = () => new Promise(r => setTimeout(r));
-
-export const beforeEach = async () => {
-  document.body.innerHTML = '';
-  try { localStorage.removeItem('ktf_settings'); } catch {}
-};
-
-export default {
-  'SettingCheckbox reflects and updates settings': async ({ pass, fail, log }) => {
-    try {
-      await import('/gui/components/settingsStore.js');
-      await import('/gui/components/SettingCheckbox.js');
-      window.KTF_SETTINGS.set({ showBrowser: false });
-      const el = document.createElement('ktf-setting-checkbox');
-      el.name = 'showBrowser';
-      el.label = 'Show Browser';
-      document.body.appendChild(el);
-      await nextTick();
-      const input = el.querySelector('input[type="checkbox"]');
-    const before = input.checked === false;
-      input.checked = true; input.dispatchEvent(new Event('change'));
-      await nextTick();
-      const after = window.KTF_SETTINGS.get().showBrowser === true;
-    log(`Checkbox before:${before} after:${after}`);
-    if (before && after) pass('SettingCheckbox updated setting from false to true'); else fail('SettingCheckbox did not update setting');
-    } catch (e) { fail(e.stack || String(e)); }
-  },
-
-  'SettingCheckbox unchecks updates back to false': async ({ pass, fail, log }) => {
-    try {
-      await import('/gui/components/settingsStore.js');
-      await import('/gui/components/SettingCheckbox.js');
-      window.KTF_SETTINGS.set({ showBrowser: true });
-      const el = document.createElement('ktf-setting-checkbox');
-      el.name = 'showBrowser';
-      document.body.appendChild(el);
-      await nextTick();
-      const input = el.querySelector('input[type="checkbox"]');
-      input.checked = false; input.dispatchEvent(new Event('change'));
-      await nextTick();
-      const after = window.KTF_SETTINGS.get().showBrowser === false;
-    log(`Setting after uncheck:${after}`);
-    if (after) pass('SettingCheckbox updated setting back to false'); else fail('Uncheck did not update setting');
-    } catch (e) { fail(e.stack || String(e)); }
-  }
-};
+// Browser tests for SettingCheckbox component
+
+const nextTick = () => new Promise(r => setTimeout(r));
+
+export const beforeEach = async () => {
+  document.body.innerHTML = '';
+  try { localStorage.removeItem('ktf_settings'); } catch {}
+};
+
+export default {
+  'SettingCheckbox reflects and updates settings': async ({ pass, fail, log }) => {
+    try {
+      await import('/gui/components/settingsStore.js');
+      await import('/gui/components/SettingCheckbox.js');
+      window.KTF_SETTINGS.set({ showBrowser: false });
+      const el = document.createElement('ktf-setting-checkbox');
+      el.name = 'showBrowser';
+      el.label = 'Show Browser';
+      document.body.appendChild(el);
+      await nextTick();
+      const input = el.querySelector('input[type="checkbox"]');
+    const before = input.checked === false;
+      input.checked = true; input.dispatchEvent(new Event('change'));
+      await nextTick();
+      const after = window.KTF_SETTINGS.get().showBrowser === true;
+    log(`Checkbox before:${before} after:${after}`);
+    if (before && after) pass('SettingCheckbox updated setting from false to true'); else fail('SettingCheckbox did not update setting');
+    } catch (e) { fail(e.stack || String(e)); }
+  },
+
+  'SettingCheckbox unchecks updates back to false': async ({ pass, fail, log }) => {
+    try {
+      await import('/gui/components/settingsStore.js');
+      await import('/gui/components/SettingCheckbox.js');
+      window.KTF_SETTINGS.set({ showBrowser: true });
+      const el = document.createElement('ktf-setting-checkbox');
+      el.name = 'showBrowser';
+      document.body.appendChild(el);
+      await nextTick();
+      const input = el.querySelector('input[type="checkbox"]');
+      input.checked = false; input.dispatchEvent(new Event('change'));
+      await nextTick();
+      const after = window.KTF_SETTINGS.get().showBrowser === false;
+    log(`Setting after uncheck:${after}`);
+    if (after) pass('SettingCheckbox updated setting back to false'); else fail('Uncheck did not update setting');
+    } catch (e) { fail(e.stack || String(e)); }
+  }
+};

package/tests/setting-number.browser-test.js

@@ -1,54 +1,54 @@
-// Browser tests for SettingNumber component
-
-const nextTick = () => new Promise(r => setTimeout(r));
-
-export const beforeEach = async () => {
-  document.body.innerHTML = '';
-  try { localStorage.removeItem('ktf_settings'); } catch {}
-};
-
-export default {
-  'SettingNumber reflects and updates settings with clamping': async ({ pass, fail, log }) => {
-    try {
-      const store = await import('/gui/components/settingsStore.js');
-      await import('/gui/components/SettingNumber.js');
-      store.setSettings({ delayMs: 500 });
-      const el = document.createElement('ktf-setting-number');
-      el.name = 'delayMs';
-      el.label = 'Delay';
-      el.min = 0; el.max = 1000; el.step = 100; el.suffix = 'ms';
-      document.body.appendChild(el);
-      await nextTick();
-      const input = el.querySelector('input[type="number"]');
-      const before = String(input.value) === '500';
-      input.value = '1200'; input.dispatchEvent(new Event('change'));
-      await nextTick();
-      const clamped = store.getSettings().delayMs === 1000;
-      input.value = 'abc'; input.dispatchEvent(new Event('change'));
-      await nextTick();
-      const nanToZero = store.getSettings().delayMs === 0;
-      log(`before:${before} clamped:${clamped} nanToZero:${nanToZero}`);
-      if (before && clamped && nanToZero) pass('SettingNumber reflected, clamped, and sanitized values');
-      else fail('SettingNumber did not reflect/clamp/sanitize as expected');
-    } catch (e) { fail(e.stack || String(e)); }
-  },
-
-  'SettingNumber input syncs when settings change externally': async ({ pass, fail }) => {
-    try {
-      const store = await import('/gui/components/settingsStore.js');
-      await import('/gui/components/SettingNumber.js');
-      store.setSettings({ delayMs: 0 });
-      const el = document.createElement('ktf-setting-number');
-      el.name = 'delayMs';
-      document.body.appendChild(el);
-      await nextTick();
-      const input = el.querySelector('input[type="number"]');
-      const initial = String(input.value) === '0';
-      store.setSettings({ delayMs: 250 });
-      await nextTick();
-      const updated = String(input.value) === '250';
-      if (initial && updated) pass('SettingNumber stayed in sync with external setting change');
-      else fail('SettingNumber did not sync input after settings change');
-    } catch (e) { fail(e.stack || String(e)); }
-  }
-};
+// Browser tests for SettingNumber component
+
+const nextTick = () => new Promise(r => setTimeout(r));
+
+export const beforeEach = async () => {
+  document.body.innerHTML = '';
+  try { localStorage.removeItem('ktf_settings'); } catch {}
+};
+
+export default {
+  'SettingNumber reflects and updates settings with clamping': async ({ pass, fail, log }) => {
+    try {
+      const store = await import('/gui/components/settingsStore.js');
+      await import('/gui/components/SettingNumber.js');
+      store.setSettings({ delayMs: 500 });
+      const el = document.createElement('ktf-setting-number');
+      el.name = 'delayMs';
+      el.label = 'Delay';
+      el.min = 0; el.max = 1000; el.step = 100; el.suffix = 'ms';
+      document.body.appendChild(el);
+      await nextTick();
+      const input = el.querySelector('input[type="number"]');
+      const before = String(input.value) === '500';
+      input.value = '1200'; input.dispatchEvent(new Event('change'));
+      await nextTick();
+      const clamped = store.getSettings().delayMs === 1000;
+      input.value = 'abc'; input.dispatchEvent(new Event('change'));
+      await nextTick();
+      const nanToZero = store.getSettings().delayMs === 0;
+      log(`before:${before} clamped:${clamped} nanToZero:${nanToZero}`);
+      if (before && clamped && nanToZero) pass('SettingNumber reflected, clamped, and sanitized values');
+      else fail('SettingNumber did not reflect/clamp/sanitize as expected');
+    } catch (e) { fail(e.stack || String(e)); }
+  },
+
+  'SettingNumber input syncs when settings change externally': async ({ pass, fail }) => {
+    try {
+      const store = await import('/gui/components/settingsStore.js');
+      await import('/gui/components/SettingNumber.js');
+      store.setSettings({ delayMs: 0 });
+      const el = document.createElement('ktf-setting-number');
+      el.name = 'delayMs';
+      document.body.appendChild(el);
+      await nextTick();
+      const input = el.querySelector('input[type="number"]');
+      const initial = String(input.value) === '0';
+      store.setSettings({ delayMs: 250 });
+      await nextTick();
+      const updated = String(input.value) === '250';
+      if (initial && updated) pass('SettingNumber stayed in sync with external setting change');
+      else fail('SettingNumber did not sync input after settings change');
+    } catch (e) { fail(e.stack || String(e)); }
+  }
+};

package/tests/setting-select.browser-test.js

@@ -1,47 +1,47 @@
-// Browser tests for SettingSelect component
-
-const nextTick = () => new Promise(r => setTimeout(r));
-
-export const beforeEach = async () => {
-  document.body.innerHTML = '';
-  try { localStorage.removeItem('ktf_settings'); } catch {}
-};
-
-export default {
-  'SettingSelect reflects and updates settings': async ({ pass, fail, log }) => {
-    try {
-      await import('/gui/components/settingsStore.js');
-      await import('/gui/components/SettingSelect.js');
-      window.KTF_SETTINGS.set({ logLevel: 2 });
-      const el = document.createElement('ktf-setting-select');
-      el.name = 'logLevel';
-      el.label = 'Log Level';
-      document.body.appendChild(el);
-      await nextTick();
-      const select = el.querySelector('select');
-      const before = String(select.value) === '2';
-      select.value = '1'; select.dispatchEvent(new Event('change'));
-      await nextTick();
-      const after = window.KTF_SETTINGS.get().logLevel === 1;
-    log(`Select value before:${before} after:${after}`);
-    if (before && after) pass('SettingSelect updated setting from 2 to 1'); else fail('SettingSelect did not update setting');
-    } catch (e) { fail(e.stack || String(e)); }
-  },
-
-  'SettingSelect stays in sync when settings change externally': async ({ pass, fail }) => {
-    try {
-      await import('/gui/components/settingsStore.js');
-      await import('/gui/components/SettingSelect.js');
-      window.KTF_SETTINGS.set({ logLevel: 1 });
-      const el = document.createElement('ktf-setting-select');
-      el.name = 'logLevel';
-      document.body.appendChild(el);
-      await nextTick();
-      const select = el.querySelector('select');
-      window.KTF_SETTINGS.set({ logLevel: 4 });
-      await nextTick();
-      const synced = String(select.value) === '4';
-    if (synced) pass('SettingSelect synced after external settings change'); else fail('Select did not sync after external change');
-    } catch (e) { fail(e.stack || String(e)); }
-  }
-};
+// Browser tests for SettingSelect component
+
+const nextTick = () => new Promise(r => setTimeout(r));
+
+export const beforeEach = async () => {
+  document.body.innerHTML = '';
+  try { localStorage.removeItem('ktf_settings'); } catch {}
+};
+
+export default {
+  'SettingSelect reflects and updates settings': async ({ pass, fail, log }) => {
+    try {
+      await import('/gui/components/settingsStore.js');
+      await import('/gui/components/SettingSelect.js');
+      window.KTF_SETTINGS.set({ logLevel: 2 });
+      const el = document.createElement('ktf-setting-select');
+      el.name = 'logLevel';
+      el.label = 'Log Level';
+      document.body.appendChild(el);
+      await nextTick();
+      const select = el.querySelector('select');
+      const before = String(select.value) === '2';
+      select.value = '1'; select.dispatchEvent(new Event('change'));
+      await nextTick();
+      const after = window.KTF_SETTINGS.get().logLevel === 1;
+    log(`Select value before:${before} after:${after}`);
+    if (before && after) pass('SettingSelect updated setting from 2 to 1'); else fail('SettingSelect did not update setting');
+    } catch (e) { fail(e.stack || String(e)); }
+  },
+
+  'SettingSelect stays in sync when settings change externally': async ({ pass, fail }) => {
+    try {
+      await import('/gui/components/settingsStore.js');
+      await import('/gui/components/SettingSelect.js');
+      window.KTF_SETTINGS.set({ logLevel: 1 });
+      const el = document.createElement('ktf-setting-select');
+      el.name = 'logLevel';
+      document.body.appendChild(el);
+      await nextTick();
+      const select = el.querySelector('select');
+      window.KTF_SETTINGS.set({ logLevel: 4 });
+      await nextTick();
+      const synced = String(select.value) === '4';
+    if (synced) pass('SettingSelect synced after external settings change'); else fail('Select did not sync after external change');
+    } catch (e) { fail(e.stack || String(e)); }
+  }
+};

package/tests/settings-store.browser-test.js

@@ -1,26 +1,26 @@
-// Browser tests for settingsStore helpers
-
-const nextTick = () => new Promise(r => setTimeout(r));
-
-export const beforeEach = async () => {
-  document.body.innerHTML = '';
-  try { localStorage.removeItem('ktf_settings'); } catch {}
-};
-
-export default {
-  'settingsStore get/set persists to localStorage and dispatches event': async ({ pass, fail }) => {
-    try {
-      const store = await import('/gui/components/settingsStore.js');
-      const before = store.getSettings();
-      const p = new Promise(resolve => {
-        const unsub = store.subscribe((s) => { unsub(); resolve(s); });
-      });
-      store.setSettings({ theme: 'dark', logLevel: 4 });
-      const evtState = await p;
-      const raw = localStorage.getItem('ktf_settings');
-      const parsed = JSON.parse(raw || '{}');
-      const ok = evtState.theme === 'dark' && evtState.logLevel === 4 && parsed.theme === 'dark' && parsed.logLevel === 4;
-      ok ? pass('settingsStore persisted and dispatched change event') : fail(`state:${JSON.stringify(evtState)} raw:${raw}`);
-    } catch (e) { fail(e.stack || String(e)); }
-  }
-};
+// Browser tests for settingsStore helpers
+
+const nextTick = () => new Promise(r => setTimeout(r));
+
+export const beforeEach = async () => {
+  document.body.innerHTML = '';
+  try { localStorage.removeItem('ktf_settings'); } catch {}
+};
+
+export default {
+  'settingsStore get/set persists to localStorage and dispatches event': async ({ pass, fail }) => {
+    try {
+      const store = await import('/gui/components/settingsStore.js');
+      const before = store.getSettings();
+      const p = new Promise(resolve => {
+        const unsub = store.subscribe((s) => { unsub(); resolve(s); });
+      });
+      store.setSettings({ theme: 'dark', logLevel: 4 });
+      const evtState = await p;
+      const raw = localStorage.getItem('ktf_settings');
+      const parsed = JSON.parse(raw || '{}');
+      const ok = evtState.theme === 'dark' && evtState.logLevel === 4 && parsed.theme === 'dark' && parsed.logLevel === 4;
+      ok ? pass('settingsStore persisted and dispatched change event') : fail(`state:${JSON.stringify(evtState)} raw:${raw}`);
+    } catch (e) { fail(e.stack || String(e)); }
+  }
+};