openvibers/openvibe.design Commits

/kit's Answer example passes kit.answer the shapes it takes (#131)

OP OpenVibers committed 11 days ago · 63d8d1df6a · 2 files, +4 −1

The Answer tile drew "[object Object]" as its next step and no badge: the example passed next as
{ href, label } and badge as kit.badge()'s HTML, where kit.answer takes HTML strings and
{ text, tone }. The example (the code people copy) now uses kit.button() for the next step and
{ text: 'Up', tone: 'ok' } for the badge, with a row pill. test/kit-pages fails any part whose
sample draws "[object Object]" or "undefined".

Changes

ddiff --git a/server/kit/parts.js b/server/kit/parts.js
iindex d26e47a..cc9c41e 100644
---- a/server/kit/parts.js
++++ b/server/kit/parts.js
@@@ -116,7 +116,7 @@ const PARTS = [
      { id: 'tool-input', fn: 'toolInput', group: 'tools', name: 'Tool input', line: 'The one field a tool needs, its button, and examples to try.',
          code: `kit.toolInput({ name: 'domain', label: 'A domain', placeholder: 'openvibe.live', button: 'Look it up', icon: 'search', tries: { items: [{ value: 'openvibe.live' }, { value: 'example.com' }] } })` },
      { id: 'answer', fn: 'answer', group: 'tools', name: 'Answer', line: 'The answer first, then its rows, then what to do next.',
--        code: `kit.answer({ title: 'openvibe.live is reachable', badge: kit.badge('ok', 'ok'), rows: [['Address', '104.21.32.1'], ['Answered in', '38 ms'], ['Certificate', 'Valid until Jan 30, 2027']], next: [{ href: '/tools/dns', label: 'See every DNS record' }] })` },
++        code: `kit.answer({ title: 'openvibe.live is reachable', badge: { text: 'Up', tone: 'ok' }, rows: [['Address', '104.21.32.1'], ['Answered in', '38 ms', { text: 'fast', tone: 'ok' }], ['Certificate', 'Valid until Jan 30, 2027']], next: [kit.button({ href: '/tools/dns', label: 'See every DNS record', kind: 'quiet', small: true })] })` },
      { id: 'family', fn: 'family', group: 'tools', name: 'Family', line: 'The tools next to this one.',
          code: `kit.family({ title: 'More image tools', more: { href: '/tools/images', label: 'All 14' }, items: [{ href: '/tools/crop', label: 'Crop', icon: 'image' }, { href: '/tools/convert', label: 'Convert', icon: 'swap' }, { href: '/tools/remove-bg', label: 'Remove the background', icon: 'spark' }] })` },
      { id: 'tool', fn: 'tool', group: 'tools', name: 'Tool frame', line: 'One order for every tool page: head, input, answer, family, folds, related.', wide: true,
ddiff --git a/test/kit-pages.test.js b/test/kit-pages.test.js
iindex 3caccab..9391e34 100644
---- a/test/kit-pages.test.js
++++ b/test/kit-pages.test.js
@@@ -17,6 +17,9 @@ const { boot, check, done } = require('./helpers/boot');
          const missing = Object.keys(kit).filter((k) => typeof kit[k] === 'function' && !named.has(k));
          assert.deepStrictEqual(missing, [], 'a new builder in openvibe-shared needs a part on /kit');
          PARTS.forEach((p) => { assert.ok(render(p).length > 20, `${p.id} draws`); assert.ok(!p.error, `${p.id}: ${p.error}`); });
++        // A sample that passes a builder the wrong shape draws "[object Object]" or "undefined" (the Answer tile's next
++        // step, 2026-11-02): the examples are the code people copy, so each must draw clean.
++        PARTS.forEach((p) => { const h = render(p); assert.ok(!/\[object Object\]|>undefined<|="undefined"/.test(h), `${p.id} draws a wrong-shaped argument: ${h.slice(0, 200)}`); });
          assert.ok(PARTS.every((p) => GROUPS.some(([g]) => g === p.group)), 'every part is in a group');
          assert.strictEqual(new Set(PARTS.map((p) => p.id)).size, PARTS.length, 'ids are unique');
      });