shadowdao
8bf525c600
SectionTypePanel (Accordion/Tabs/Testimonials/Countdown/NumberCounter/ CTASection/CallToAction/FeaturesGrid), PricingStylePanel, and SocialStylePanel all gain a Spacing & Border section (margin/padding per-side, border, box-shadow, opacity), an Animation section, and a Visibility section, wired to the shared SpacingControl/BorderControl/ AnimationControl/VisibilityControl. PricingTable's per-card colors (cardBg/textColor/subColor/featColor/ checkColor/btnBg/btnColor) were previously hard-coded literals computed from featuredBg inside toHtml -- promoted to real optional props (each falling back to the exact prior literal when unset) and exposed via ColorPickerField in PricingStylePanel. SocialStylePanel now exposes SocialLinks' iconShape/gap (already-built props with no control), plus Icon's bgColor/bgShape/bgSize/link and StarRating's filledColor/emptyColor, which the panel's generic iconBgColor/starColor checks never matched since those aren't Icon's or StarRating's real prop names. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
76 lines
3.1 KiB
TypeScript
76 lines
3.1 KiB
TypeScript
import { describe, test, expect } from 'vitest';
|
|
import { Countdown } from './Countdown';
|
|
|
|
const toHtml = (Countdown as any).toHtml;
|
|
|
|
describe('Countdown.toHtml validates targetDate before inline-script injection (A4.2)', () => {
|
|
test('malicious targetDate cannot break out of the new Date(...) call', () => {
|
|
const { html } = toHtml({ targetDate: '2026-01-01");alert(1)//' }, '');
|
|
expect(html).not.toContain('alert(');
|
|
expect(html).not.toContain('");');
|
|
});
|
|
|
|
test('valid date is JSON-encoded into the script', () => {
|
|
const { html } = toHtml({ targetDate: '2026-01-01' }, '');
|
|
expect(html).toContain('new Date("2026-01-01")');
|
|
});
|
|
|
|
test('valid date+time is preserved', () => {
|
|
const { html } = toHtml({ targetDate: '2026-01-01T12:30:00' }, '');
|
|
expect(html).toContain('new Date("2026-01-01T12:30:00")');
|
|
});
|
|
|
|
test('invalid/empty targetDate falls back safely (no injected literal)', () => {
|
|
const { html } = toHtml({ targetDate: 'not-a-date' }, '');
|
|
expect(html).not.toContain('not-a-date');
|
|
expect(html).toMatch(/new Date\(\)\.getTime\(\)|new Date\(Date\.now\(\)\)\.getTime\(\)/);
|
|
});
|
|
});
|
|
|
|
describe('Countdown.toHtml deterministic + unique scope ids (thread node id, no Math.random)', () => {
|
|
const props = { targetDate: '2026-01-01' };
|
|
|
|
test('same node id -> identical output across calls (deterministic)', () => {
|
|
const { html: html1 } = toHtml(props, '', 'node-cd1');
|
|
const { html: html2 } = toHtml(props, '', 'node-cd1');
|
|
expect(html1).toBe(html2);
|
|
});
|
|
|
|
test('different node ids -> different, non-colliding element ids (identical props, no collision)', () => {
|
|
const { html: html1 } = toHtml(props, '', 'node-cd1');
|
|
const { html: html2 } = toHtml(props, '', 'node-cd2');
|
|
const id1 = html1.match(/id="([^"]+)_d"/)![1];
|
|
const id2 = html2.match(/id="([^"]+)_d"/)![1];
|
|
expect(id1).not.toBe(id2);
|
|
});
|
|
|
|
test('no nodeId (legacy 2-arg call): still deterministic across repeated calls, not random', () => {
|
|
const { html: html1 } = toHtml(props, '');
|
|
const { html: html2 } = toHtml(props, '');
|
|
expect(html1).toBe(html2);
|
|
});
|
|
});
|
|
|
|
describe('Countdown.toHtml script nit: ticking interval stops at zero', () => {
|
|
test('inline script clears its own interval once the countdown reaches zero', () => {
|
|
const { html } = toHtml({ targetDate: '2026-01-01' }, '');
|
|
expect(html).toMatch(/clearInterval\(/);
|
|
});
|
|
|
|
test('an already-expired target never schedules a running interval', () => {
|
|
const { html } = toHtml({ targetDate: '2020-01-01' }, '');
|
|
expect(html).toMatch(/if\s*\(\s*target\s*-\s*Date\.now\(\)\s*>\s*0\s*\)\s*\{/);
|
|
});
|
|
});
|
|
|
|
describe('Countdown.craft.props includes the box-model/animation/visibility rollout props', () => {
|
|
test('animation, animationDelay, and all 3 hideOn* flags are declared (blank/false defaults)', () => {
|
|
const props = (Countdown as any).craft.props;
|
|
expect(props).toHaveProperty('animation', '');
|
|
expect(props).toHaveProperty('animationDelay', '');
|
|
expect(props).toHaveProperty('hideOnDesktop', false);
|
|
expect(props).toHaveProperty('hideOnTablet', false);
|
|
expect(props).toHaveProperty('hideOnMobile', false);
|
|
});
|
|
});
|