From d171a39b0ad97e2a05de1f38bc76a3d345e2b3d5 Mon Sep 17 00:00:00 2001
From: Simon Holthausen <simon.holthausen@vercel.com>
Date: Tue, 9 Jan 2024 16:15:16 +0100
Subject: [PATCH] fix: keep intermediate number value representations

fixes #9959
---
 .changeset/fast-weeks-clean.md                |  5 +++
 packages/svelte/src/internal/client/render.js | 36 ++++++++++++++-----
 2 files changed, 32 insertions(+), 9 deletions(-)
 create mode 100644 .changeset/fast-weeks-clean.md

diff --git a/.changeset/fast-weeks-clean.md b/.changeset/fast-weeks-clean.md
new file mode 100644
index 0000000000..4ce7f286b3
--- /dev/null
+++ b/.changeset/fast-weeks-clean.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: keep intermediate number value representations
diff --git a/packages/svelte/src/internal/client/render.js b/packages/svelte/src/internal/client/render.js
index 5670ef582b..30da7f35bb 100644
--- a/packages/svelte/src/internal/client/render.js
+++ b/packages/svelte/src/internal/client/render.js
@@ -926,32 +926,50 @@ export function selected(dom) {
 }
 
 /**
- * @param {Element} dom
+ * @param {HTMLInputElement} dom
  * @param {() => unknown} get_value
  * @param {(value: unknown) => void} update
  * @returns {void}
  */
 export function bind_value(dom, get_value, update) {
 	dom.addEventListener('input', () => {
-		// @ts-ignore
+		/** @type {any} */
 		let value = dom.value;
-		// @ts-ignore
-		const type = dom.type;
-		if (type === 'number' || type === 'range') {
-			value = value === '' ? null : +value;
+		if (is_numberlike_input(dom)) {
+			value = to_number(value);
 		}
 		update(value);
 	});
+
 	render_effect(() => {
 		const value = get_value();
-		const coerced_value = value == null ? null : value + '';
-		// @ts-ignore
-		dom.value = coerced_value;
 		// @ts-ignore
 		dom.__value = value;
+
+		if (is_numberlike_input(dom) && value === to_number(dom.value)) {
+			// handles 0 vs 00 case (see https://github.com/sveltejs/svelte/issues/9959)
+			return;
+		}
+
+		dom.value = stringify(value);
 	});
 }
 
+/**
+ * @param {HTMLInputElement} dom
+ */
+function is_numberlike_input(dom) {
+	const type = dom.type;
+	return type === 'number' || type === 'range';
+}
+
+/**
+ * @param {string} value
+ */
+function to_number(value) {
+	return value === '' ? null : +value;
+}
+
 /**
  * @param {HTMLSelectElement} dom
  * @param {() => unknown} get_value