fix: only replace the last occurrence of decimal point (#35)

Fixes #32 (again)
fmaclen · Sep 26, 2022 · 3d383f1 · 3d383f1
1 parent 6caacc9
commit 3d383f1
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 12 deletions.
diff --git 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
@@ -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 () => {