diff --git a/resources/js/components/NumberFormatter.js b/resources/js/components/NumberFormatter.js index 4f26b6042b..af166851c6 100644 --- a/resources/js/components/NumberFormatter.js +++ b/resources/js/components/NumberFormatter.js @@ -36,11 +36,13 @@ export default class NumberFormatter { toString() { try { - if (this.#rangeEnd !== undefined) { - return Intl.NumberFormat(this.locale, this.#options).formatRange(this.#number, this.#rangeEnd); + const formatter = Intl.NumberFormat(this.locale, this.#options); + + if (this.#rangeEnd !== undefined && this.#rangeEnd !== this.#number) { + return formatter.formatRange(this.#number, this.#rangeEnd); } - return Intl.NumberFormat(this.locale, this.#options).format(this.#number); + return formatter.format(this.#number); } catch (e) { return 'Invalid Number'; } diff --git a/resources/js/tests/components/NumberFormatter.test.js b/resources/js/tests/components/NumberFormatter.test.js index 3be37bd475..e746a0f984 100644 --- a/resources/js/tests/components/NumberFormatter.test.js +++ b/resources/js/tests/components/NumberFormatter.test.js @@ -203,6 +203,17 @@ describe('formatRange', () => { test('it normalizes string inputs', () => { expect(new NumberFormatter().formatRange('1000', '5000')).toBe('1,000–5,000'); }); + + test('it formats a single number when the range endpoints are equal', () => { + expect(new NumberFormatter().formatRange(1, 1)).toBe('1'); + expect(new NumberFormatter().formatRange('5', 5)).toBe('5'); + expect(new NumberFormatter().formatRange(0.5, 0.5, 'percent')).toBe('50%'); + }); + + test('it keeps the approximation when endpoints differ but format identically', () => { + expect(new NumberFormatter().formatRange(1, 1.3, { maximumFractionDigits: 0 })).toBe('~1'); + expect(new NumberFormatter().formatRange(1.231, 1.234, { maximumFractionDigits: 2 })).toBe('~1.23'); + }); }); describe('range via array syntax', () => {