From 3d383f1780b5802ee5d66ddef002c182f9f1963b Mon Sep 17 00:00:00 2001 From: Fernando Maclen Date: Mon, 26 Sep 2022 10:30:58 -0400 Subject: [PATCH] fix: only replace the last occurrence of decimal point (#35) Fixes #32 (again) --- src/lib/CurrencyInput.svelte | 8 +++++--- tests/svelte-currency-input.test.ts | 18 +++++++++--------- 2 files changed, 14 insertions(+), 12 deletions(-) diff --git a/src/lib/CurrencyInput.svelte b/src/lib/CurrencyInput.svelte index 8107a0e..49298d1 100644 --- a/src/lib/CurrencyInput.svelte +++ b/src/lib/CurrencyInput.svelte @@ -51,11 +51,13 @@ // Don't format if the user is typing a `currencyDecimal` point if (event.key === currencyDecimal) return; - // Always convert _the opposite_ decimal key press to the `currencyDecimal` point + // Pressing `.` when the decimal point is `,` gets replaced with `,` if (isDecimalComma && event.key === '.') - formattedValue = formattedValue.replace('.', currencyDecimal); + formattedValue = formattedValue.replace(/\.([^.]*)$/, currencyDecimal + '$1'); // Only replace the last occurence + + // Pressing `,` when the decimal point is `.` gets replaced with `.` if (!isDecimalComma && event.key === ',') - formattedValue = formattedValue.replace(',', currencyDecimal); + formattedValue = formattedValue.replace(/\,([^,]*)$/, currencyDecimal + '$1'); // Only replace the last occurence // Don't format if `formattedValue` is ['$', '-$', "-"] const ignoreSymbols = [currencySymbol, `-${currencySymbol}`, '-']; diff --git a/tests/svelte-currency-input.test.ts b/tests/svelte-currency-input.test.ts index 61f2add..378b850 100644 --- a/tests/svelte-currency-input.test.ts +++ b/tests/svelte-currency-input.test.ts @@ -231,14 +231,14 @@ test.describe('CurrencyInput', () => { await page.goto('/'); // Pressing `.` when the decimal point is `,` gets converted to `,` - const colonFormattedInput = page.locator('.currencyInput__formatted[name="formatted-colon"]'); - const colonUnformattedInput = page.locator('.currencyInput__unformatted[name=colon]'); - await colonFormattedInput.focus(); + const euroFormattedInput = page.locator('.currencyInput__formatted[name="formatted-euro"]'); + const euroUnformattedInput = page.locator('.currencyInput__unformatted[name=euro]'); + await euroFormattedInput.focus(); await selectAll(page); await page.keyboard.press('Backspace'); - await page.keyboard.type('-69.42'); - await expect(colonFormattedInput).toHaveValue('-₡69,42'); - await expect(colonUnformattedInput).toHaveValue('-69.42'); + await page.keyboard.type('-42069.69'); + await expect(euroFormattedInput).toHaveValue('-42.069,69 €'); + await expect(euroUnformattedInput).toHaveValue('-42069.69'); // Pressing `,` when the decimal point is `.` gets converted to `.` const bitcoinUnformattedInput = page.locator('.currencyInput__unformatted[name=bitcoin]'); @@ -248,9 +248,9 @@ test.describe('CurrencyInput', () => { await bitcoinFormattedInput.focus(); await selectAll(page); await page.keyboard.press('Backspace'); - await page.keyboard.type('69,42'); - await expect(bitcoinFormattedInput).toHaveValue('฿69.42'); - await expect(bitcoinUnformattedInput).toHaveValue('69.42'); + await page.keyboard.type('42069,69'); + await expect(bitcoinFormattedInput).toHaveValue('฿42,069.69'); + await expect(bitcoinUnformattedInput).toHaveValue('42069.69'); }); test.skip('Updating chained inputs have the correct behavior', async () => {