imaskjs icon indicating copy to clipboard operation
imaskjs copied to clipboard

Cannot support NullableMaskedNumber since 6.5.0: "Cannot read properties of undefined (reading 'toLocaleString')"

Open dstj opened this issue 1 year ago • 1 comments

Describe the bug Since 6.5.0 (still in 7.6.1), we can not longer support nullable masked number like shown here.

The following JavaScript error is thrown in the format method a null value is passed to it.

global-error-handler.ts:89 TypeError: Cannot read properties of undefined (reading 'toLocaleString')
    at NullableMaskedNumber.format (number.js:333:18)
    at NullableMaskedNumber.doFormat (base.js:317:31)
    at NullableMaskedNumber.typedValueEquals (base.js:370:112)
    at NullableMaskedNumber.typedValueEquals (number.js:320:19)
    at set typedValue (input.js:112:21)
    at set maskValue (angular-imask.mjs:59:40)
    at IMaskDirective.writeValue (angular-imask.mjs:114:27)
    at onChange (forms.mjs:3111:27)
    at forms.mjs:3586:50
    at Array.forEach (<anonymous>)

To Reproduce See StackBlitz repro with 7.6.1

Expected behavior In many cases, a null value is a valid value, it is often used for data validation for required value too. It should be natively supported by the library.

Environment:

  • OS: Windows 11 Pro
  • Browser: Chrome
  • Version: 129.0.6668.71 (Official Build) (64-bit)
  • IMask version: 7.6.1 (since 6.5.0)
  • Framework/plugin version if used: Angular

Additional context

I managed to sort of fix it by overriding the format method, but this is very hacky.

IMask.MaskedNumber.DEFAULTS = {
	...IMask.MaskedNumber.DEFAULTS,
	format: n => {
		return n?.toLocaleString('en-US', {
			useGrouping: false,
			maximumFractionDigits: 20
		}) || '';
	}
};

dstj avatar Sep 30 '24 18:09 dstj

The workaround of overriding the format method does indeed work, but there's another issue: When the control's value is 0 and you try to patch it to null, the input will still display 0 while the control's value will be correctly updated to null.

maidmehic avatar Oct 16 '24 09:10 maidmehic