Skip to content

Commit 053175d

Browse files
nighcanighca
authored
add ownError & hasOwnError for form state (#41)
1 parent 3260ea6 commit 053175d

File tree

3 files changed

+93
-3
lines changed

3 files changed

+93
-3
lines changed

‎src/formState.spec.ts‎

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,8 @@ describe('FormState (mode: object) validation', () => {
103103

104104
expect(state.validating).toBe(false)
105105
expect(state.validated).toBe(false)
106+
expect(state.hasOwnError).toBe(false)
107+
expect(state.ownError).toBeUndefined()
106108
expect(state.hasError).toBe(false)
107109
expect(state.error).toBeUndefined()
108110

@@ -120,6 +122,8 @@ describe('FormState (mode: object) validation', () => {
120122

121123
await delay()
122124
expect(state.validating).toBe(false)
125+
expect(state.hasOwnError).toBe(true)
126+
expect(state.ownError).toBe('same')
123127
expect(state.hasError).toBe(true)
124128
expect(state.error).toBe('same')
125129

@@ -138,6 +142,8 @@ describe('FormState (mode: object) validation', () => {
138142
await delay()
139143
expect(state.validating).toBe(false)
140144
expect(state.validated).toBe(true)
145+
expect(state.hasOwnError).toBe(true)
146+
expect(state.ownError).toBe('same')
141147
expect(state.hasError).toBe(true)
142148
expect(state.error).toBe('same')
143149

@@ -151,6 +157,8 @@ describe('FormState (mode: object) validation', () => {
151157
await delay()
152158
expect(state.validating).toBe(false)
153159
expect(state.validated).toBe(true)
160+
expect(state.hasOwnError).toBe(false)
161+
expect(state.ownError).toBeUndefined()
154162
expect(state.hasError).toBe(false)
155163
expect(state.error).toBeUndefined()
156164

@@ -177,6 +185,8 @@ describe('FormState (mode: object) validation', () => {
177185
expect(state.value).toEqual(initialValue)
178186
expect(state.dirty).toBe(false)
179187
expect(state.validating).toBe(false)
188+
expect(state.hasOwnError).toBe(false)
189+
expect(state.ownError).toBeUndefined()
180190
expect(state.hasError).toBe(false)
181191
expect(state.error).toBeUndefined()
182192

@@ -337,38 +347,44 @@ describe('FormState (mode: object) validation', () => {
337347
await delay()
338348
expect(state.$.foo.error).toBe('empty')
339349
expect(state.$.bar.error).toBeUndefined()
350+
expect(state.ownError).toBeUndefined()
340351
expect(state.error).toBe('empty')
341352

342353
state.$.foo.onChange('123')
343354
await delay()
344355
expect(state.$.foo.error).toBeUndefined()
345356
expect(state.$.bar.error).toBeUndefined()
357+
expect(state.ownError).toBeUndefined()
346358
expect(state.error).toBeUndefined()
347359

348360
state.$.bar.onChange('123')
349361
await delay()
350362
expect(state.$.foo.error).toBeUndefined()
351363
expect(state.$.bar.error).toBeUndefined()
364+
expect(state.ownError).toBe('same')
352365
expect(state.error).toBe('same')
353366

354367
state.$.bar.onChange('')
355368
await delay()
356369
expect(state.$.foo.error).toBeUndefined()
357370
expect(state.$.bar.error).toBe('empty')
371+
expect(state.ownError).toBeUndefined()
358372
expect(state.error).toBe('empty')
359373

360374
state.$.bar.onChange('123')
361375
state.$.foo.onChange('456')
362376
await delay()
363377
expect(state.$.foo.error).toBeUndefined()
364378
expect(state.$.bar.error).toBeUndefined()
379+
expect(state.ownError).toBeUndefined()
365380
expect(state.error).toBeUndefined()
366381

367382
state.$.bar.onChange('123456')
368383
state.$.foo.onChange('123456')
369384
await delay()
370385
expect(state.$.foo.error).toBeUndefined()
371386
expect(state.$.bar.error).toBeUndefined()
387+
expect(state.ownError).toBe('same')
372388
expect(state.error).toBe('same')
373389

374390
state.dispose()
@@ -388,38 +404,44 @@ describe('FormState (mode: object) validation', () => {
388404
await delay()
389405
expect(state.$.foo.error).toBe('empty')
390406
expect(state.$.bar.error).toBeUndefined()
407+
expect(state.ownError).toBeUndefined()
391408
expect(state.error).toBe('empty')
392409

393410
state.$.foo.onChange('123')
394411
await delay()
395412
expect(state.$.foo.error).toBeUndefined()
396413
expect(state.$.bar.error).toBeUndefined()
414+
expect(state.ownError).toBeUndefined()
397415
expect(state.error).toBeUndefined()
398416

399417
state.$.bar.onChange('123')
400418
await delay()
401419
expect(state.$.foo.error).toBeUndefined()
402420
expect(state.$.bar.error).toBeUndefined()
421+
expect(state.ownError).toBe('same')
403422
expect(state.error).toBe('same')
404423

405424
state.$.bar.onChange('')
406425
await delay()
407426
expect(state.$.foo.error).toBeUndefined()
408427
expect(state.$.bar.error).toBe('empty')
428+
expect(state.ownError).toBeUndefined()
409429
expect(state.error).toBe('empty')
410430

411431
state.$.bar.onChange('123')
412432
state.$.foo.onChange('456')
413433
await delay()
414434
expect(state.$.foo.error).toBeUndefined()
415435
expect(state.$.bar.error).toBeUndefined()
436+
expect(state.ownError).toBeUndefined()
416437
expect(state.error).toBeUndefined()
417438

418439
state.$.bar.onChange('123456')
419440
state.$.foo.onChange('123456')
420441
await delay()
421442
expect(state.$.foo.error).toBeUndefined()
422443
expect(state.$.bar.error).toBeUndefined()
444+
expect(state.ownError).toBe('same')
423445
expect(state.error).toBe('same')
424446

425447
state.dispose()
@@ -448,19 +470,31 @@ describe('FormState (mode: object) validation', () => {
448470
expect(state.validating).toBe(false)
449471
expect(state.validated).toBe(false)
450472
expect(state.hasError).toBe(false)
473+
expect(state.ownError).toBeUndefined()
451474
expect(state.error).toBeUndefined()
452475

453476
state.$.foo.onChange('')
454477
await state.validate()
478+
expect(state.hasOwnError).toBe(false)
479+
expect(state.ownError).toBeUndefined()
455480
expect(state.hasError).toBe(false)
456481
expect(state.error).toBeUndefined()
457482

458483
runInAction(() => options.disabled = false)
459484

460485
await delay()
486+
expect(state.hasOwnError).toBe(false)
487+
expect(state.ownError).toBeUndefined()
461488
expect(state.hasError).toBe(true)
462489
expect(state.error).toBe('empty')
463490

491+
state.$.foo.onChange('123')
492+
await state.validate()
493+
expect(state.hasOwnError).toBe(true)
494+
expect(state.ownError).toBe('same')
495+
expect(state.hasError).toBe(true)
496+
expect(state.error).toBe('same')
497+
464498
state.dispose()
465499
})
466500
})
@@ -549,6 +583,8 @@ describe('FormState (mode: array) validation', () => {
549583

550584
expect(state.validating).toBe(false)
551585
expect(state.validated).toBe(false)
586+
expect(state.hasOwnError).toBe(false)
587+
expect(state.ownError).toBeUndefined()
552588
expect(state.hasError).toBe(false)
553589
expect(state.error).toBeUndefined()
554590

@@ -565,6 +601,8 @@ describe('FormState (mode: array) validation', () => {
565601

566602
await delay()
567603
expect(state.$[1].validated).toBe(true)
604+
expect(state.hasOwnError).toBe(true)
605+
expect(state.ownError).toBe('too long')
568606
expect(state.hasError).toBe(true)
569607
expect(state.error).toBe('too long')
570608

@@ -582,6 +620,8 @@ describe('FormState (mode: array) validation', () => {
582620
await delay()
583621
expect(state.validating).toBe(false)
584622
expect(state.validated).toBe(true)
623+
expect(state.hasOwnError).toBe(true)
624+
expect(state.ownError).toBe('too long')
585625
expect(state.hasError).toBe(true)
586626
expect(state.error).toBe('too long')
587627

@@ -627,6 +667,8 @@ describe('FormState (mode: array) validation', () => {
627667
expect(state.value).toEqual(initialValue)
628668
expect(state.dirty).toBe(false)
629669
expect(state.validating).toBe(false)
670+
expect(state.hasOwnError).toBe(false)
671+
expect(state.ownError).toBeUndefined()
630672
expect(state.hasError).toBe(false)
631673
expect(state.error).toBeUndefined()
632674

@@ -793,32 +835,37 @@ describe('FormState (mode: array) validation', () => {
793835
await delay()
794836
expect(state.$[0].error).toBeUndefined()
795837
expect(state.$[1].error).toBe('empty')
838+
expect(state.ownError).toBeUndefined()
796839
expect(state.error).toBe('empty')
797840

798841
state.$[1].onChange('456')
799842
await delay()
800843
expect(state.$[0].error).toBeUndefined()
801844
expect(state.$[1].error).toBeUndefined()
845+
expect(state.ownError).toBe('too long')
802846
expect(state.error).toBe('too long')
803847

804848
state.$[0].onChange('1')
805849
await delay()
806850
expect(state.$[0].error).toBeUndefined()
807851
expect(state.$[1].error).toBeUndefined()
852+
expect(state.ownError).toBeUndefined()
808853
expect(state.error).toBeUndefined()
809854

810855
state.$[0].onChange('123')
811856
state.$[1].onChange('4')
812857
await delay()
813858
expect(state.$[0].error).toBeUndefined()
814859
expect(state.$[1].error).toBeUndefined()
860+
expect(state.ownError).toBeUndefined()
815861
expect(state.error).toBeUndefined()
816862

817863
state.$[0].onChange('1234')
818864
state.$[1].onChange('56')
819865
await delay()
820866
expect(state.$[0].error).toBeUndefined()
821867
expect(state.$[1].error).toBeUndefined()
868+
expect(state.ownError).toBe('too long')
822869
expect(state.error).toBe('too long')
823870

824871
state.dispose()
@@ -837,32 +884,37 @@ describe('FormState (mode: array) validation', () => {
837884
await delay()
838885
expect(state.$[0].error).toBeUndefined()
839886
expect(state.$[1].error).toBe('empty')
887+
expect(state.ownError).toBeUndefined()
840888
expect(state.error).toBe('empty')
841889

842890
state.$[1].onChange('456')
843891
await delay()
844892
expect(state.$[0].error).toBeUndefined()
845893
expect(state.$[1].error).toBeUndefined()
894+
expect(state.ownError).toBe('too long')
846895
expect(state.error).toBe('too long')
847896

848897
state.$[0].onChange('1')
849898
await delay()
850899
expect(state.$[0].error).toBeUndefined()
851900
expect(state.$[1].error).toBeUndefined()
901+
expect(state.ownError).toBeUndefined()
852902
expect(state.error).toBeUndefined()
853903

854904
state.$[0].onChange('123')
855905
state.$[1].onChange('4')
856906
await delay()
857907
expect(state.$[0].error).toBeUndefined()
858908
expect(state.$[1].error).toBeUndefined()
909+
expect(state.ownError).toBeUndefined()
859910
expect(state.error).toBeUndefined()
860911

861912
state.$[0].onChange('1234')
862913
state.$[1].onChange('56')
863914
await delay()
864915
expect(state.$[0].error).toBeUndefined()
865916
expect(state.$[1].error).toBeUndefined()
917+
expect(state.ownError).toBe('too long')
866918
expect(state.error).toBe('too long')
867919

868920
state.dispose()
@@ -883,19 +935,32 @@ describe('FormState (mode: array) validation', () => {
883935
runInAction(() => options.disabled = true)
884936

885937
await state.validate()
938+
expect(state.hasOwnError).toBe(false)
939+
expect(state.ownError).toBeUndefined()
886940
expect(state.hasError).toBe(false)
887941
expect(state.error).toBeUndefined()
888942

889943
state.$[0].onChange('')
890944
await state.validate()
945+
expect(state.hasOwnError).toBe(false)
946+
expect(state.ownError).toBeUndefined()
891947
expect(state.hasError).toBe(false)
892948
expect(state.error).toBeUndefined()
893949

894950
runInAction(() => options.disabled = false)
895951
await delay()
952+
expect(state.hasOwnError).toBe(false)
953+
expect(state.ownError).toBeUndefined()
896954
expect(state.hasError).toBe(true)
897955
expect(state.error).toBe('empty')
898956

957+
state.$[0].onChange('123')
958+
await delay()
959+
expect(state.hasOwnError).toBe(true)
960+
expect(state.ownError).toBe('too long')
961+
expect(state.hasError).toBe(true)
962+
expect(state.error).toBe('too long')
963+
899964
state.dispose()
900965
})
901966

@@ -962,28 +1027,35 @@ describe('nested FormState', () => {
9621027
})
9631028

9641029
await state.validate()
1030+
expect(state.ownError).toBeUndefined()
9651031
expect(state.error).toBe('empty')
1032+
expect(state.$.inputs.ownError).toBeUndefined()
9661033
expect(state.$.inputs.$[0].error).toBe('empty')
9671034
expect(state.$.inputs.$[1].error).toBe('empty')
9681035

9691036
state.$.inputs.$[0].onChange('123')
9701037
state.$.inputs.$[1].onChange('456')
9711038

9721039
await state.validate()
1040+
expect(state.ownError).toBeUndefined()
9731041
expect(state.error).toBe('too long')
1042+
expect(state.$.inputs.error).toBe('too long')
9741043
expect(state.$.inputs.$[0].error).toBeUndefined()
9751044
expect(state.$.inputs.$[1].error).toBeUndefined()
9761045

9771046
state.$.enabled.onChange(false)
9781047

9791048
await delay()
1049+
expect(state.ownError).toBeUndefined()
9801050
expect(state.error).toBeUndefined()
9811051

9821052
state.$.enabled.onChange(true)
9831053
state.$.inputs.$[1].onChange('')
9841054

9851055
await delay()
1056+
expect(state.ownError).toBeUndefined()
9861057
expect(state.error).toBe('empty')
1058+
expect(state.$.inputs.ownError).toBeUndefined()
9871059
expect(state.$.inputs.$[0].error).toBeUndefined()
9881060
expect(state.$.inputs.$[1].error).toBe('empty')
9891061

@@ -993,7 +1065,9 @@ describe('nested FormState', () => {
9931065
})
9941066

9951067
await delay()
1068+
expect(state.ownError).toBeUndefined()
9961069
expect(state.error).toBe('too long')
1070+
expect(state.$.inputs.error).toBe('too long')
9971071
expect(state.$.inputs.$[0].error).toBeUndefined()
9981072
expect(state.$.inputs.$[1].error).toBeUndefined()
9991073
expect(state.$.inputs.$[2].error).toBeUndefined()

‎src/formState.ts‎

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -92,10 +92,27 @@ export default class FormState<TFields extends ValidatableFields, TValue = Value
9292
}
9393

9494
/**
95-
* The error info of form validation.
95+
* The error info of form validation (regardless of disableValidationWhen).
9696
*/
9797
@observable private _error: Error
9898

99+
/**
100+
* The error info of form validation.
101+
*/
102+
@computed get ownError(): Error {
103+
if (this.validationDisabled) {
104+
return undefined
105+
}
106+
return this._error
107+
}
108+
109+
/**
110+
* If the state contains form validation error.
111+
*/
112+
@computed get hasOwnError() {
113+
return !!this.ownError
114+
}
115+
99116
/**
100117
* The error info of validation (including fields' error info).
101118
*/

‎tsconfig.json‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@
1717
"src/**/*"
1818
],
1919
"exclude": [
20-
"node_modules",
21-
"**/*.spec.ts"
20+
"node_modules"
2221
]
2322
}

0 commit comments

Comments
 (0)