const test = require('node:test'); const assert = require('node:assert/strict'); const fs = require('node:fs'); const path = require('node:path'); const { execFileSync } = require('node:child_process'); const root = path.resolve(__dirname, '../..'); const read = (file) => fs.readFileSync(path.join(root, file), 'utf8'); function walk(dir, exts, out = []) { for (const entry of fs.readdirSync(path.join(root, dir), { withFileTypes: true })) { const rel = path.join(dir, entry.name); if (entry.isDirectory()) { if (['node_modules', 'build', 'vendor'].includes(entry.name)) continue; walk(rel, exts, out); } else if (exts.some((ext) => entry.name.endsWith(ext))) { out.push(rel); } } return out; } test('n-color-picker is used only inside the shared JioColorPicker', () => { const offenders = walk('assets/admin/src', ['.vue', '.js']) .filter((file) => /n-color-picker|NColorPicker/.test(read(file))) .map((file) => file.replace(/\\/g, '/')); assert.deepEqual(offenders, ['assets/admin/src/components/form/JioColorPicker.vue']); }); test('PHP color sanitizing goes through Jio\\Core\\Color only', () => { const offenders = [...walk('src', ['.php']), ...walk('inc', ['.php'])] .filter((file) => /sanitize_hex_color\(|rgba\?\\\(/.test(read(file))) .map((file) => file.replace(/\\/g, '/')) .filter((file) => file !== 'src/Core/Color.php'); assert.deepEqual(offenders, []); }); test('schema color fields sanitize via Color with showAlpha opt-in', () => { const provider = read('src/Admin/SchemaProvider.php'); assert.match(provider, /'color'\s*=>\s*'color'/); assert.match(provider, /case 'color_alpha':\s*return \\Jio\\Core\\Color::sanitize\(\$value, true\)/); assert.match(provider, /showAlpha/); const field = read('assets/admin/src/components/form/JioField.vue'); assert.match(field, / { const composite = read('assets/admin/src/components/form/JioCompositeField.vue'); assert.doesNotMatch(composite, /'dimensions'|'spacing'|'background'|JioMediaField/); assert.doesNotMatch(read('assets/js/gutenberg-blocks.js'), /ColorPicker/); }); test('JS normalizeColor mirrors PHP Color::sanitize', async () => { const { normalizeColor } = await import( 'file://' + path.join(root, 'assets/admin/src/utils/color.js').replace(/\\/g, '/') ); const cases = [ ['#ABC', false], ['abcdef', false], ['#abcd', false], ['#11223344', false], ['rgb(1,2,3)', false], ['#abcd', true], ['#11223344', true], ['rgb(1,2,3)', true], ['RGBA( 10 , 20 , 30 , .5 )', true], ['rgba(1,2,3,0.12345)', true], ['rgba(1,2,3,1.0)', true], ['rgb(256,0,0)', true], ['red', true], ['', true], [' #FFF ', false], ]; const php = `require 'src/Core/Color.php';` + `foreach (json_decode($argv[1], true) as [$v, $a]) { echo Jio\\Core\\Color::sanitize($v, $a), "\\n"; }`; const out = execFileSync('php', ['-d', 'display_errors=1', '-r', `define('ABSPATH', '/');${php}`, JSON.stringify(cases)], { cwd: root, encoding: 'utf8', }).split('\n').slice(0, cases.length); assert.deepEqual(cases.map(([v, a]) => normalizeColor(v, a)), out); }); test('widget background color input is wpColorPicker-enhanced like top-level color fields', () => { const renderer = read('src/WidgetSystem/FormRenderer.php'); assert.match(renderer, /\$key \. '\[color\]'[^\n]+'widefat jio-widget-color'\)/); assert.match(renderer, /class="' \. esc_attr\(\$class\) \. '"/); assert.match(read('assets/widgets/admin.js'), /\.jio-widget-color'\)\.wpColorPicker\(\)/); }); test('page config nav color uses wpColorPicker instead of native input[type=color]', () => { const metaBox = read('src/Admin/PageConfigMetaBox.php'); assert.doesNotMatch(metaBox, /type="color"/); assert.match(metaBox, /class="jio-page-config-color" type="text" name="page_config\[header_slider_nav_color\]"/); assert.match(metaBox, /wp_enqueue_script\('wp-color-picker'\)/); assert.match(metaBox, /\.jio-page-config-color'\)\.wpColorPicker\(\)/); assert.match(metaBox, /Color::sanitize\(\(string\) \(\$raw\['header_slider_nav_color'\]/); }); test('no native input[type=color] remains in theme PHP', () => { const offenders = ['src', 'inc', 'templates'] .flatMap((dir) => walk(dir, ['.php'])) .filter((file) => /type=["']color["']/.test(read(file))) .map((file) => file.replace(/\\/g, '/')); assert.deepEqual(offenders, []); });