diff --git a/js/dropdown/dropdown.test.ts b/js/dropdown/dropdown.test.ts
index 64c58ad7fe636..c4406c1e1bd26 100644
--- a/js/dropdown/dropdown.test.ts
+++ b/js/dropdown/dropdown.test.ts
@@ -87,6 +87,30 @@ describe("Dropdown", () => {
 		expect(options[0]).toContainHTML("zebra");
 	});
 
+	test("blurring the textbox should cancel the filter", async () => {
+		const { getByLabelText, listen } = await render(Dropdown, {
+			show_label: true,
+			loading_status,
+			value: "default",
+			label: "Dropdown",
+			choices: ["default", "other"]
+		});
+
+		const item: HTMLInputElement = getByLabelText(
+			"Dropdown"
+		) as HTMLInputElement;
+		const change_event = listen("change");
+		const select_event = listen("select");
+
+		await item.focus();
+		await event.keyboard("other");
+		await item.blur();
+
+		assert.equal(item.value, "default");
+		assert.equal(change_event.callCount, 0);
+		assert.equal(select_event.callCount, 0);
+	});
+
 	test("deselecting and reselcting a filtered dropdown should show all options again", async () => {
 		const { getByLabelText, getAllByTestId, debug } = await render(Dropdown, {
 			show_label: true,
diff --git a/js/dropdown/shared/Dropdown.svelte b/js/dropdown/shared/Dropdown.svelte
index d03289e38d57c..3a209dcdc4e19 100644
--- a/js/dropdown/shared/Dropdown.svelte
+++ b/js/dropdown/shared/Dropdown.svelte
@@ -105,14 +105,7 @@
 		if (multiselect) {
 			inputValue = "";
 		} else if (!allow_custom_value) {
-			if (value !== inputValue) {
-				if (typeof value === "string" && inputValue == "") {
-					inputValue = value;
-				} else {
-					value = undefined;
-					inputValue = "";
-				}
-			}
+			inputValue = value as string | undefined;
 		}
 		showOptions = false;
 		dispatch("blur");