diff --git a/src/lib/CurrencyInput.svelte b/src/lib/CurrencyInput.svelte
index 22f596d..50dc34d 100644
--- a/src/lib/CurrencyInput.svelte
+++ b/src/lib/CurrencyInput.svelte
@@ -78,12 +78,20 @@
 
 	// Formats the value when the input loses focus and sets the correct number of
 	// fraction digits when the value is zero
-	const handleOnBlur = () => setFormattedValue(true);
+	const handleOnBlur = () => setFormattedValue();
 
-	// Also set the correct fraction digits when the value is zero on initial load
-	onMount(() => setFormattedValue(true));
+	let dom: Document;
+	let inputElement: HTMLInputElement;
 
-	let inputTarget: HTMLInputElement;
+	onMount(() => {
+		// Set the document object as a variable so we know the page has mounted
+		dom = document;
+
+		// Set the correct fraction digits when the value is zero on initial load
+		setFormattedValue();
+	});
+
+	let inputTarget: EventTarget | null;
 	const currencyDecimal = new Intl.NumberFormat(locale).format(1.1).charAt(1); // '.' or ','
 	const isDecimalComma = currencyDecimal === ',';
 	const currencySymbol = formatCurrency(0, 0)
@@ -110,7 +118,7 @@
 			if (ignoreSymbols.includes(strippedUnformattedValue)) return;
 
 			// Set the starting caret positions
-			inputTarget = event.target as HTMLInputElement;
+			inputTarget = event.target;
 
 			// Reverse the value when minus is pressed
 			if (isNegativeAllowed && event.key === '-') value = value * -1;
@@ -147,13 +155,23 @@
 		}
 	};
 
-	const setFormattedValue = (hasMinFractionDigits?: boolean) => {
+	const setFormattedValue = () => {
+		// Do nothing because the page hasn't mounted yet
+		if (!dom) return;
+
 		// Previous caret position
-		const startCaretPosition = inputTarget?.selectionStart || 0;
+		const startCaretPosition = inputElement?.selectionStart || 0;
 		const previousFormattedValueLength = formattedValue.length;
 
 		// Apply formatting to input
-		formattedValue = isZero && !isZeroNullish ? '' : formatCurrency(value, fractionDigits, hasMinFractionDigits ? fractionDigits : 0);
+		formattedValue =
+			isZero && !isZeroNullish
+				? ''
+				: formatCurrency(
+						value,
+						fractionDigits,
+						dom.activeElement === inputElement ? 0 : fractionDigits
+				  );
 
 		// Update `value` after formatting
 		setUnformattedValue();
@@ -164,7 +182,7 @@
 		if (previousFormattedValueLength !== formattedValue.length) {
 			const endCaretPosition =
 				startCaretPosition + formattedValue.length - previousFormattedValueLength;
-			inputTarget?.setSelectionRange(endCaretPosition, endCaretPosition);
+			inputElement?.setSelectionRange(endCaretPosition, endCaretPosition);
 		}
 
 		// Run callback function when `value` changes
@@ -172,8 +190,9 @@
 	};
 
 	const handlePlaceholder = (placeholder: string | number | null) => {
-		if (typeof placeholder === "number") return formatCurrency(placeholder, fractionDigits, fractionDigits);
-		if (placeholder === null) return "";
+		if (typeof placeholder === 'number')
+			return formatCurrency(placeholder, fractionDigits, fractionDigits);
+		if (placeholder === null) return '';
 		return placeholder;
 	};
 
@@ -204,12 +223,13 @@
 			: ''}
 		"
 		type="text"
-		inputmode={fractionDigits > 0 ? "decimal" : "numeric"}
+		inputmode={fractionDigits > 0 ? 'decimal' : 'numeric'}
 		name={`formatted-${name}`}
 		required={required && !isZero}
 		placeholder={handlePlaceholder(placeholder)}
 		{autocomplete}
 		{disabled}
+		bind:this={inputElement}
 		bind:value={formattedValue}
 		on:keydown={handleKeyDown}
 		on:keyup={setUnformattedValue}
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 85ef1e8..b206ac5 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -12,6 +12,11 @@
 	};
 
 	let unchangedValue = 999; // Used for onValueChange()
+	let chainedValue = 9999.99; // Used for chained inputs
+
+	const setChainedValue = () => {
+		chainedValue = 420.69;
+	};
 </script>
 
 <form class="demoForm" on:submit={handleSubmit}>
@@ -43,61 +48,105 @@
 	</nav>
 
 	<div class="demoForm__container">
-		<CurrencyInput name="default" value={-42069.69} />
-		<CurrencyInput name="colon" locale="es-CR" currency="CRC" />
-		<CurrencyInput
-			name="pound"
-			value={1234.56}
-			isNegativeAllowed={false}
-			placeholder={null}
-			locale="en-GB"
-			currency="GBP"
-		/>
-		<CurrencyInput
-			name="bitcoin"
-			value={0.87654321}
-			locale="th-TH"
-			currency="THB"
-			fractionDigits={8}
-		/>
-
-		<CurrencyInput name="yen" value={5678.9} locale="en-JP" currency="JPY" />
-		<CurrencyInput name="shekel" value={97532.95} disabled={true} locale="il-IL" currency="ILS" />
-		<CurrencyInput name="euro" value={-42069.69} locale="nl-NL" currency="EUR" />
-		<CurrencyInput
-			name="won"
-			placeholder={1234.56}
-			isNegativeAllowed={false}
-			locale="ko-KO"
-			currency="KRW"
-			inputClasses={{
-				wrapper: 'currencyInput custom-wrapper-class',
-				unformatted: 'custom-unformatted-class'
-			}}
-		/>
-		<CurrencyInput
-			name="pesos"
-			value={unchangedValue}
-			isNegativeAllowed={false}
-			placeholder={null}
-			autocomplete="off"
-			locale="es-AR"
-			currency="ARS"
-			onValueChange={(value) => {
-				// Prevent alerting on initial load
-				if (unchangedValue !== value) {
-					unchangedValue = value; // Update the unchanged value
-					if (browser) window.alert(`The value for ARS has changed to: ${value}`); // Alert the user
-				}
-			}}
-		/>
-		<CurrencyInput name="rupees" value={678} locale="hi-IN" currency="INR" fractionDigits={3} />
-		<CurrencyInput name="soles" value={0} isZeroNullish={true} placeholder={null} locale="es-PE" currency="PEN" />
-		<CurrencyInput name="dinars" value={0} placeholder={"How many Dinars?"} locale="en-US" currency="RSD" fractionDigits={0} />
+		<fieldset class="demoForm__fieldset">
+			<legend class="demoForm__legend">Stand-alone inputs</legend>
+			<CurrencyInput name="default" value={-42069.69} />
+			<CurrencyInput name="colon" locale="es-CR" currency="CRC" />
+			<CurrencyInput
+				name="pound"
+				value={1234.56}
+				isNegativeAllowed={false}
+				placeholder={null}
+				locale="en-GB"
+				currency="GBP"
+			/>
+			<CurrencyInput
+				name="bitcoin"
+				value={0.87654321}
+				locale="th-TH"
+				currency="THB"
+				fractionDigits={8}
+			/>
+
+			<CurrencyInput name="yen" value={5678.9} locale="en-JP" currency="JPY" />
+			<CurrencyInput name="shekel" value={97532.95} disabled={true} locale="il-IL" currency="ILS" />
+			<CurrencyInput name="euro" value={-42069.69} locale="nl-NL" currency="EUR" />
+			<CurrencyInput
+				name="won"
+				placeholder={1234.56}
+				isNegativeAllowed={false}
+				locale="ko-KO"
+				currency="KRW"
+				inputClasses={{
+					wrapper: 'currencyInput custom-wrapper-class',
+					unformatted: 'custom-unformatted-class'
+				}}
+			/>
+			<CurrencyInput
+				name="pesos"
+				value={unchangedValue}
+				isNegativeAllowed={false}
+				placeholder={null}
+				autocomplete="off"
+				locale="es-AR"
+				currency="ARS"
+				onValueChange={(value) => {
+					// Prevent alerting on initial load
+					if (unchangedValue !== value) {
+						unchangedValue = value; // Update the unchanged value
+						if (browser) window.alert(`The value for ARS has changed to: ${value}`); // Alert the user
+					}
+				}}
+			/>
+			<CurrencyInput name="rupees" value={678} locale="hi-IN" currency="INR" fractionDigits={3} />
+			<CurrencyInput
+				name="soles"
+				value={0}
+				isZeroNullish={true}
+				placeholder={null}
+				locale="es-PE"
+				currency="PEN"
+			/>
+			<CurrencyInput
+				name="dinars"
+				value={0}
+				placeholder={'How many Dinars?'}
+				locale="en-US"
+				currency="RSD"
+				fractionDigits={0}
+			/>
+		</fieldset>
+
+		<fieldset class="demoForm__fieldset">
+			<legend class="demoForm__legend">Chained inputs</legend>
+			<CurrencyInput
+				name="chained-east-caribbean-dollar"
+				bind:value={chainedValue}
+				locale="aig"
+				currency="XCD"
+				fractionDigits={4}
+			/>
+			<CurrencyInput name="chained-euros" bind:value={chainedValue} locale="nl-NL" currency="EUR" />
+			<CurrencyInput
+				name="chained-dollars"
+				bind:value={chainedValue}
+				locale="en-US"
+				currency="USD"
+				fractionDigits={0}
+			/>
+			<button
+				id="set-chained-value"
+				type="button"
+				class="demoForm__button"
+				on:click={setChainedValue}
+			>
+				Set chained value to <strong>420.69</strong>
+			</button>
+		</fieldset>
 	</div>
 
 	<nav class="demoForm__output">
-		<button type="submit" class="demoForm__submit">Submit form</button>
+		<button id="submit-form" type="submit" class="demoForm__button">Submit form</button>
 
 		<pre class="demoForm__pre {!output && 'demoForm__pre--placeholder'}">{output
 				? output
@@ -144,22 +193,35 @@
 	}
 
 	div.demoForm__container {
+		display: flex;
+		flex-direction: column;
+		gap: 32px;
+	}
+
+	fieldset.demoForm__fieldset {
 		display: grid;
 		grid-template-columns: repeat(4, 1fr);
 		align-items: center;
 		justify-content: center;
 		gap: calc(var(--gap) / 2);
 		height: max-content;
+		border: 1px solid #ccc;
+		padding: 16px;
 
 		@media (max-width: 768px) {
 			grid-template-columns: repeat(2, 1fr);
 		}
-		
+
 		@media (max-width: 512px) {
 			grid-template-columns: 1fr;
 		}
 	}
 
+	legend.demoForm__legend {
+		font-size: 13px;
+		color: #666;
+	}
+
 	h1.demoForm__h1 {
 		color: #333;
 		font-size: 20px;
@@ -224,7 +286,7 @@
 		font-size: 13px;
 	}
 
-	button.demoForm__submit {
+	button.demoForm__button {
 		border: none;
 		background-color: #333;
 		color: #fff;
@@ -234,7 +296,7 @@
 		height: max-content;
 	}
 
-	button.demoForm__submit:hover {
+	button.demoForm__button:hover {
 		background-color: #000;
 	}
 </style>
diff --git a/tests/svelte-currency-input.test.ts b/tests/svelte-currency-input.test.ts
index acf1e48..02ac88b 100644
--- a/tests/svelte-currency-input.test.ts
+++ b/tests/svelte-currency-input.test.ts
@@ -85,7 +85,7 @@ test.describe('CurrencyInput', () => {
 		await expect(shekelFormattedInput).not.toHaveClass(/currencyInput__formatted--zero/);
 
 		// Submitting a form returns the correct values
-		const demoSubmitForm = page.locator('button.demoForm__submit');
+		const demoSubmitForm = page.locator('button#submit-form');
 		const demoOutput = page.locator('pre.demoForm__pre');
 		await demoSubmitForm.click();
 		expect(await demoOutput.textContent()).toMatch(
@@ -113,6 +113,12 @@ test.describe('CurrencyInput', () => {
 					'formatted-soles': 'S/ 0.00',
 					dinars: '0',
 					'formatted-dinars': '',
+					'chained-east-caribbean-dollar': '10000',
+					'formatted-chained-east-caribbean-dollar': 'EC$10,000.0000',
+					'chained-euros': '10000',
+					'formatted-chained-euros': '€ 10.000,00',
+					'chained-dollars': '10000',
+					'formatted-chained-dollars': '$10,000'
 				},
 				null,
 				2
@@ -320,7 +326,7 @@ test.describe('CurrencyInput', () => {
 		// Tabbing in Webkit is broken: https://github.com/Canutin/svelte-currency-input/issues/40
 		if (testInfo.project.name !== 'webkit') {
 			const formattedInputs = page.locator('.currencyInput__formatted');
-			expect(await formattedInputs.count()).toBe(12);
+			expect(await formattedInputs.count()).toBe(15);
 
 			await formattedInputs.first().focus();
 			await expect(formattedInputs.nth(0)).toBeFocused();
@@ -468,7 +474,58 @@ test.describe('CurrencyInput', () => {
 		await expect(dinarsFormattedInput).toHaveAttribute('inputmode', 'numeric');
 	});
 
-	test.skip('Updating chained inputs have the correct behavior', async () => {
-		// TODO
+	test('Updating chained inputs have the correct behavior', async ({ page }) => {
+		const chainedDollarsUnformattedInput = page.locator(
+			'.currencyInput__unformatted[name="chained-dollars"]'
+		);
+		const chainedDollarsFormattedInput = page.locator(
+			'.currencyInput__formatted[name="formatted-chained-dollars"]'
+		);
+		const chainedEurosUnformattedInput = page.locator(
+			'.currencyInput__unformatted[name="chained-euros"]'
+		);
+		const chainedEurosFormattedInput = page.locator(
+			'.currencyInput__formatted[name="formatted-chained-euros"]'
+		);
+		const chainedEastCaribbeanDollarUnformattedInput = page.locator(
+			'.currencyInput__unformatted[name="chained-east-caribbean-dollar"]'
+		);
+		const chainedEastCaribbeanDollarFormattedInput = page.locator(
+			'.currencyInput__formatted[name="formatted-chained-east-caribbean-dollar"]'
+		);
+		const chainedValueButton = page.locator('button#set-chained-value');
+
+		// The default chained value is `9999.99` but because `chainedDollars` has
+		// fraction digits set to `0` it gets rounded to `10_000` onMount(),
+		// thus updating the other chained inputs to `10_000` as well.
+		await expect(chainedDollarsUnformattedInput).toHaveValue('10000');
+		await expect(chainedDollarsFormattedInput).toHaveValue('$10,000');
+		await expect(chainedEurosUnformattedInput).toHaveValue('10000');
+		await expect(chainedEurosFormattedInput).toHaveValue('€ 10.000,00');
+		await expect(chainedEastCaribbeanDollarUnformattedInput).toHaveValue('10000');
+		await expect(chainedEastCaribbeanDollarFormattedInput).toHaveValue('EC$10,000.0000');
+
+		// Set a new chained value by clicking a button
+		await chainedValueButton.click();
+		// USD input has fraction digits is 0
+		await expect(chainedDollarsUnformattedInput).toHaveValue('421');
+		await expect(chainedDollarsFormattedInput).toHaveValue('$421');
+		// EUR input has fraction digits is 2
+		await expect(chainedEurosFormattedInput).toHaveValue('€ 420,69');
+		await expect(chainedEurosUnformattedInput).toHaveValue('420.69');
+		// XCD input has fraction digits is 4
+		await expect(chainedEastCaribbeanDollarUnformattedInput).toHaveValue('420.69');
+		await expect(chainedEastCaribbeanDollarFormattedInput).toHaveValue('EC$420.6900');
+
+		// Set a new chained value by deleting the value in the USD input
+		await chainedDollarsFormattedInput.focus();
+		await selectAll(page);
+		await page.keyboard.press('Backspace');
+		await expect(chainedDollarsUnformattedInput).toHaveValue('0');
+		await expect(chainedDollarsFormattedInput).toHaveValue('');
+		await expect(chainedEurosUnformattedInput).toHaveValue('0');
+		await expect(chainedEurosFormattedInput).toHaveValue('');
+		await expect(chainedEastCaribbeanDollarUnformattedInput).toHaveValue('0');
+		await expect(chainedEastCaribbeanDollarFormattedInput).toHaveValue('');
 	});
 });