+5

.changeset/mean-mice-train.md

Reviewed

··· 1 1 + --- 2 2 + "@clack/core": patch 3 3 + --- 4 4 + 5 5 + Validates initial values immediately when using text prompts with initialValue and validate props.

+41

examples/basic/text-validation.ts

Reviewed

··· 1 1 + import { text, note, isCancel } from '@clack/prompts'; 2 2 + import { setTimeout } from 'node:timers/promises'; 3 3 + 4 4 + async function main() { 5 5 + console.clear(); 6 6 + 7 7 + // Example demonstrating the issue with initial value validation 8 8 + const name = await text({ 9 9 + message: 'Enter your name (letters and spaces only)', 10 10 + initialValue: 'John123', // Invalid initial value with numbers 11 11 + validate: (value) => { 12 12 + if (!/^[a-zA-Z\s]+$/.test(value)) return 'Name can only contain letters and spaces'; 13 13 + return undefined; 14 14 + }, 15 15 + }); 16 16 + 17 17 + if (!isCancel(name)) { 18 18 + note(`Valid name: ${name}`, 'Success'); 19 19 + } 20 20 + 21 21 + await setTimeout(1000); 22 22 + 23 23 + // Example with a valid initial value for comparison 24 24 + const validName = await text({ 25 25 + message: 'Enter another name (letters and spaces only)', 26 26 + initialValue: 'John Doe', // Valid initial value 27 27 + validate: (value) => { 28 28 + if (!/^[a-zA-Z\s]+$/.test(value)) return 'Name can only contain letters and spaces'; 29 29 + return undefined; 30 30 + }, 31 31 + }); 32 32 + 33 33 + if (!isCancel(validName)) { 34 34 + note(`Valid name: ${validName}`, 'Success'); 35 35 + } 36 36 + 37 37 + await setTimeout(1000); 38 38 + 39 39 + } 40 40 + 41 41 + main().catch(console.error);

+9

packages/core/src/prompts/prompt.ts

Reviewed

··· 147 147 this.rl.write(this.opts.initialValue); 148 148 } 149 149 this._setValue(this.opts.initialValue); 150 150 + 151 151 + // Validate initial value if validator exists 152 152 + if (this.opts.validate) { 153 153 + const problem = this.opts.validate(this.opts.initialValue); 154 154 + if (problem) { 155 155 + this.error = problem instanceof Error ? problem.message : problem; 156 156 + this.state = 'error'; 157 157 + } 158 158 + } 150 159 } 151 160 152 161 this.input.on('keypress', this.onKeypress);

+70

packages/core/test/prompts/prompt.test.ts

Reviewed

··· 263 263 264 264 expect(instance.state).to.equal('cancel'); 265 265 }); 266 266 + 267 267 + test('validates initial value on prompt start', () => { 268 268 + const instance = new Prompt({ 269 269 + input, 270 270 + output, 271 271 + render: () => 'foo', 272 272 + initialValue: 'invalid', 273 273 + validate: (value) => value === 'valid' ? undefined : 'must be valid', 274 274 + }); 275 275 + instance.prompt(); 276 276 + 277 277 + expect(instance.state).to.equal('error'); 278 278 + expect(instance.error).to.equal('must be valid'); 279 279 + }); 280 280 + 281 281 + test('accepts valid initial value', () => { 282 282 + const instance = new Prompt({ 283 283 + input, 284 284 + output, 285 285 + render: () => 'foo', 286 286 + initialValue: 'valid', 287 287 + validate: (value) => value === 'valid' ? undefined : 'must be valid', 288 288 + }); 289 289 + instance.prompt(); 290 290 + 291 291 + expect(instance.state).to.equal('active'); 292 292 + expect(instance.error).to.equal(''); 293 293 + }); 294 294 + 295 295 + test('validates initial value with Error object', () => { 296 296 + const instance = new Prompt({ 297 297 + input, 298 298 + output, 299 299 + render: () => 'foo', 300 300 + initialValue: 'invalid', 301 301 + validate: (value) => value === 'valid' ? undefined : new Error('must be valid'), 302 302 + }); 303 303 + instance.prompt(); 304 304 + 305 305 + expect(instance.state).to.equal('error'); 306 306 + expect(instance.error).to.equal('must be valid'); 307 307 + }); 308 308 + 309 309 + test('validates initial value with regex validation', () => { 310 310 + const instance = new Prompt({ 311 311 + input, 312 312 + output, 313 313 + render: () => 'foo', 314 314 + initialValue: 'Invalid Value $$$', 315 315 + validate: (value) => /^[A-Z]+$/.test(value) ? undefined : 'Invalid value', 316 316 + }); 317 317 + instance.prompt(); 318 318 + 319 319 + expect(instance.state).to.equal('error'); 320 320 + expect(instance.error).to.equal('Invalid value'); 321 321 + }); 322 322 + 323 323 + test('accepts valid initial value with regex validation', () => { 324 324 + const instance = new Prompt({ 325 325 + input, 326 326 + output, 327 327 + render: () => 'foo', 328 328 + initialValue: 'VALID', 329 329 + validate: (value) => /^[A-Z]+$/.test(value) ? undefined : 'Invalid value', 330 330 + }); 331 331 + instance.prompt(); 332 332 + 333 333 + expect(instance.state).to.equal('active'); 334 334 + expect(instance.error).to.equal(''); 335 335 + }); 266 336 });