Release v2.11.1

test/player-render-helpers.test.js

@@ -1,6 +1,7 @@
 const test = require('node:test');
 const assert = require('node:assert/strict');
 const fs = require('node:fs');
+const vm = require('node:vm');
 
 require('../src/common');
 
@@ -85,6 +86,81 @@ test('renderEditorJsContent sanitizes editor blocks and wraps legacy text', () =
   assert.equal(renderEditorJsContent('plain text'), '<p>plain text</p>');
 });
 
+test('shared API progress placeholder renders a clamped bar from numeric fields', () => {
+  const sandbox = { window: {} };
+  vm.runInNewContext(fs.readFileSync(require.resolve('../src/web/public/js/shared/placeholder-utils.js'), 'utf8'), sandbox);
+  const placeholderUtils = sandbox.window.placeholderUtils;
+  const markup = placeholderUtils.renderProgressPlaceholder(
+    { fundraising: { current: '$1,250.00', total: '$1,000.00' } },
+    'progress(fundraising.current,fundraising.total,success,light,striped,animated)'
+  );
+
+  assert.match(markup, /<span class="progress api-progress" style="background-color:#f8f9fa;font-size:inherit;--bs-progress-font-size:inherit;--bs-progress-height:1em;height:1em;border-radius:var\(--bs-border-radius\);"/);
+  assert.match(markup, /class="progress-bar bg-success progress-bar-striped progress-bar-animated"/);
+  assert.match(markup, /style="width:100%;color:inherit;background-color:#198754;"/);
+  assert.match(markup, /aria-valuenow="100"/);
+  assert.match(markup, /width:100%/);
+
+  const objectValueMarkup = placeholderUtils.renderProgressPlaceholder(
+    { fundraising: { current: { value: 30, currency: 'USD' }, total: { amount: 100, currency: 'USD' } } },
+    'progress(fundraising.current,fundraising.total)'
+  );
+  assert.match(objectValueMarkup, /aria-valuenow="30"/);
+  assert.match(objectValueMarkup, /width:30%/);
+
+  const announcementColorMarkup = placeholderUtils.renderProgressPlaceholder(
+    { current: 25, total: 100 },
+    'progress(current,total,midnight)'
+  );
+  assert.match(announcementColorMarkup, /background-color:#1e1d2d/);
+  assert.doesNotMatch(announcementColorMarkup, /bg-primary/);
+
+  const omittedOptionsMarkup = placeholderUtils.renderProgressPlaceholder(
+    { current: 25, total: 100 },
+    'progress(current,total)'
+  );
+  assert.match(omittedOptionsMarkup, /aria-valuenow="25"/);
+
+  const literalMarkup = placeholderUtils.renderProgressPlaceholder(
+    {},
+    'progress("30","100")'
+  );
+  assert.match(literalMarkup, /aria-valuenow="30"/);
+});
+
+test('shared placeholder transforms support arithmetic', () => {
+  const sandbox = { window: {} };
+  vm.runInNewContext(fs.readFileSync(require.resolve('../src/web/public/js/shared/placeholder-utils.js'), 'utf8'), sandbox);
+  const placeholderUtils = sandbox.window.placeholderUtils;
+
+  assert.equal(placeholderUtils.formatPlaceholderValue(placeholderUtils.resolvePlaceholderExpression({ amount: 12 }, 'amount.multiply(10)')), '120');
+  assert.equal(placeholderUtils.formatPlaceholderValue(placeholderUtils.resolvePlaceholderExpression({ amount: 12 }, 'amount.add(3)')), '15');
+  assert.equal(placeholderUtils.formatPlaceholderValue(placeholderUtils.resolvePlaceholderExpression({ amount: 12 }, 'amount.subtract(3)')), '9');
+  assert.equal(placeholderUtils.formatPlaceholderValue(placeholderUtils.resolvePlaceholderExpression({ amount: 12 }, 'amount.divide(3)')), '4');
+  assert.equal(placeholderUtils.formatPlaceholderValue(placeholderUtils.resolvePlaceholderExpression({ amount: 12 }, 'amount.add(3).multiply(10)')), '150');
+
+  const textlessMarkup = placeholderUtils.renderProgressPlaceholder(
+    { current: 30, total: 100 },
+    'progress(current,total,textless)'
+  );
+  assert.match(textlessMarkup, /aria-label="30%"/);
+  assert.match(textlessMarkup, /aria-valuenow="30"/);
+  assert.match(textlessMarkup, /style="width:30%;color:inherit;"><\/span>/);
+
+  const radiusMarkup = placeholderUtils.renderProgressPlaceholder(
+    { current: 30, total: 100 },
+    'progress(current,total,radius(12px))'
+  );
+  assert.match(radiusMarkup, /border-radius:12px;/);
+
+  const now = Date.now();
+  const timedMarkup = placeholderUtils.renderProgressPlaceholder(
+    { start: new Date(now - 30 * 60 * 1000).toISOString(), end: new Date(now + 30 * 60 * 1000).toISOString() },
+    'progress(start,end)'
+  );
+  assert.match(timedMarkup, /aria-valuenow="50"/);
+});
+
 test('timetable region registers the timetable type', () => {
   assert.ok(timetableRegionSource.includes("registry.register('timetable'"));
   assert.ok(timetableRegionSource.includes("sanitizeRichText(substituteTimetableVariables(value"));