diff --git a/core/src/components/input/input.ionic.scss b/core/src/components/input/input.ionic.scss
index a9f5301e981..4a7431dc4e6 100644
--- a/core/src/components/input/input.ionic.scss
+++ b/core/src/components/input/input.ionic.scss
@@ -236,11 +236,14 @@
  * only looked at the native input, tabbing to the clear
  * button would immediately hide it.
  *
+ * The pressed class keeps it visible mid-press
+ * so the click still lands on the button.
+ *
  * Note that the clear button also requires the native input
  * to have any value, but this is not specific to the ionic
  * theme, so it is handled elsewhere.
  */
-:host(:not(:focus-within)) .input-clear-icon {
+:host(:not(:focus-within)) .input-clear-icon:not(.input-clear-button-pressed) {
   display: none;
 }
 
diff --git a/core/src/components/input/input.tsx b/core/src/components/input/input.tsx
index 0075f5691c7..77fccc366c9 100644
--- a/core/src/components/input/input.tsx
+++ b/core/src/components/input/input.tsx
@@ -90,6 +90,12 @@ export class Input implements ComponentInterface {
    */
   @State() isInvalid = false;
 
+  /**
+   * Keeps the clear button in the layout while it is being pressed, so a blur
+   * landing mid-press cannot hide it before the click resolves.
+   */
+  @State() isClearButtonPressed = false;
+
   @Element() el!: HTMLIonInputElement;
 
   private validationObserver?: MutationObserver;
@@ -497,6 +503,8 @@ export class Input implements ComponentInterface {
       );
     }
 
+    document.removeEventListener('click', this.releaseClearButtonPress);
+
     if (this.slotMutationController) {
       this.slotMutationController.destroy();
       this.slotMutationController = undefined;
@@ -728,7 +736,13 @@ export class Input implements ComponentInterface {
     this.isComposing = false;
   };
 
+  private releaseClearButtonPress = () => {
+    this.isClearButtonPressed = false;
+  };
+
   private clearTextInput = (ev?: Event) => {
+    this.isClearButtonPressed = false;
+
     if (this.clearInput && !this.readonly && !this.disabled && ev) {
       ev.preventDefault();
       ev.stopPropagation();
@@ -1075,15 +1089,29 @@ export class Input implements ComponentInterface {
               <button
                 aria-label="reset"
                 type="button"
-                class="input-clear-icon"
+                class={{
+                  'input-clear-icon': true,
+                  'input-clear-button-pressed': this.isClearButtonPressed,
+                }}
                 onPointerDown={(ev) => {
                   /**
                    * This prevents mobile browsers from
                    * blurring the input when the clear
-                   * button is activated.
+                   * button is activated. Not all browsers
+                   * honor it, so the press is tracked too.
                    */
                   ev.preventDefault();
+
+                  // Only a primary press produces a click.
+                  if (ev.button !== 0) {
+                    return;
+                  }
+
+                  this.isClearButtonPressed = true;
+                  // Cleared on click, not pointerup, so the button survives until the click dispatches.
+                  document.addEventListener('click', this.releaseClearButtonPress, { once: true });
                 }}
+                onPointerCancel={this.releaseClearButtonPress}
                 onClick={this.clearTextInput}
               >
                 <ion-icon aria-hidden="true" icon={inputClearIcon}></ion-icon>
diff --git a/core/src/components/input/test/basic/input.e2e.ts b/core/src/components/input/test/basic/input.e2e.ts
index 15ef224a646..34971091930 100644
--- a/core/src/components/input/test/basic/input.e2e.ts
+++ b/core/src/components/input/test/basic/input.e2e.ts
@@ -347,5 +347,75 @@ configs({ modes: ['ionic-md'], directions: ['ltr'] }).forEach(({ title, config }
       await expect(clearButton).toBeFocused();
       await expect(clearButton).toBeVisible();
     });
+
+    test('should clear the value when the input blurs between pointerdown and click', async ({ page }) => {
+      await page.setContent(
+        `
+          <ion-input
+            label="Label"
+            label-placement="stacked"
+            clear-input="true"
+            value="abc"
+          ></ion-input>
+        `,
+        config
+      );
+
+      const input = page.locator('ion-input');
+      const nativeInput = input.locator('input');
+      const clearButton = input.locator('.input-clear-icon');
+
+      await input.evaluate((el: HTMLIonInputElement) => el.setFocus());
+      await expect(clearButton).toBeVisible();
+
+      const box = (await clearButton.boundingBox())!;
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
+      await page.mouse.down();
+
+      // Some browsers blur anyway, despite the preventDefault on pointerdown.
+      await nativeInput.evaluate((el: HTMLInputElement) => el.blur());
+      await page.waitForChanges();
+
+      await page.mouse.up();
+      await page.waitForChanges();
+
+      await expect(input).toHaveJSProperty('value', '');
+      await expect(nativeInput).toBeFocused();
+    });
+
+    test('should hide the clear button when the press is abandoned', async ({ page }) => {
+      await page.setContent(
+        `
+          <ion-input
+            label="Label"
+            label-placement="stacked"
+            clear-input="true"
+            value="abc"
+          ></ion-input>
+        `,
+        config
+      );
+
+      const input = page.locator('ion-input');
+      const nativeInput = input.locator('input');
+      const clearButton = input.locator('.input-clear-icon');
+
+      await input.evaluate((el: HTMLIonInputElement) => el.setFocus());
+      await expect(clearButton).toBeVisible();
+
+      const box = (await clearButton.boundingBox())!;
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
+      await page.mouse.down();
+      await nativeInput.evaluate((el: HTMLInputElement) => el.blur());
+      await page.waitForChanges();
+
+      // Releasing off the button sends the click to an ancestor, not the button.
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2 + 200);
+      await page.mouse.up();
+      await page.waitForChanges();
+
+      await expect(input).toHaveJSProperty('value', 'abc');
+      await expect(clearButton).not.toBeVisible();
+    });
   });
 });
diff --git a/core/src/components/searchbar/searchbar.tsx b/core/src/components/searchbar/searchbar.tsx
index 41f3a4dfe97..2cf3839118a 100644
--- a/core/src/components/searchbar/searchbar.tsx
+++ b/core/src/components/searchbar/searchbar.tsx
@@ -49,6 +49,12 @@ export class Searchbar implements ComponentInterface {
   @State() focused = false;
   @State() noAnimate = true;
 
+  /**
+   * Keeps the clear button mounted while it is being pressed, so a blur
+   * landing mid-press cannot unmount it before the click resolves.
+   */
+  @State() isClearButtonPressed = false;
+
   /**
    * lang and dir are globally enumerated attributes.
    * As a result, creating these as properties
@@ -320,6 +326,8 @@ export class Searchbar implements ComponentInterface {
   }
 
   disconnectedCallback() {
+    document.removeEventListener('click', this.releaseClearButtonPress);
+
     if (this.loadTimeout) {
       clearTimeout(this.loadTimeout);
     }
@@ -390,10 +398,16 @@ export class Searchbar implements ComponentInterface {
     this.ionInput.emit({ value, event });
   }
 
+  private releaseClearButtonPress = () => {
+    this.isClearButtonPressed = false;
+  };
+
   /**
    * Clears the input field and triggers the control change.
    */
   private onClearInput = async (shouldFocus?: boolean) => {
+    this.isClearButtonPressed = false;
+
     if (this.clearTimeout) {
       clearTimeout(this.clearTimeout);
     }
@@ -661,13 +675,17 @@ export class Searchbar implements ComponentInterface {
    * Determines whether or not the clear button should be visible onscreen.
    * Clear button should be shown if one of two conditions applies:
    * 1. `showClearButton` is set to `always`.
-   * 2. `showClearButton` is set to `focus`, and the searchbar has been focused.
+   * 2. `showClearButton` is set to `focus`, and the searchbar has been
+   *    focused or a clear button press is still in flight.
    * Unless the `theme` is `ionic` and the searchbar is disabled.
    */
   private shouldShowClearButton(): boolean {
     const theme = getIonTheme(this);
 
-    if (this.showClearButton === 'never' || (this.showClearButton === 'focus' && !this.focused)) {
+    if (
+      this.showClearButton === 'never' ||
+      (this.showClearButton === 'focus' && !this.focused && !this.isClearButtonPressed)
+    ) {
       return false;
     }
 
@@ -887,10 +905,21 @@ export class Searchbar implements ComponentInterface {
                 /**
                  * This prevents mobile browsers from
                  * blurring the input when the clear
-                 * button is activated.
+                 * button is activated. Not all browsers
+                 * honor it, so the press is tracked too.
                  */
                 ev.preventDefault();
+
+                // Only a primary press produces a click.
+                if (ev.button !== 0) {
+                  return;
+                }
+
+                this.isClearButtonPressed = true;
+                // Cleared on click, not pointerup, so the button survives until the click dispatches.
+                document.addEventListener('click', this.releaseClearButtonPress, { once: true });
               }}
+              onPointerCancel={this.releaseClearButtonPress}
               onClick={() => this.onClearInput(true)}
             >
               <ion-icon
diff --git a/core/src/components/searchbar/test/basic/searchbar.e2e.ts b/core/src/components/searchbar/test/basic/searchbar.e2e.ts
index 94d51a95902..da58775166d 100644
--- a/core/src/components/searchbar/test/basic/searchbar.e2e.ts
+++ b/core/src/components/searchbar/test/basic/searchbar.e2e.ts
@@ -78,6 +78,56 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
 
       await expect(nativeInput).toBeFocused();
     });
+
+    test('should clear the value when the searchbar blurs between pointerdown and click', async ({ page }) => {
+      await page.setContent(`<ion-searchbar value="abc" show-clear-button="focus"></ion-searchbar>`, config);
+
+      const searchbar = page.locator('ion-searchbar');
+      const nativeInput = searchbar.locator('input');
+      const clearButton = searchbar.locator('.searchbar-clear-button');
+
+      await searchbar.evaluate((el: HTMLIonSearchbarElement) => el.setFocus());
+      await expect(clearButton).toBeVisible();
+
+      const box = (await clearButton.boundingBox())!;
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
+      await page.mouse.down();
+
+      // Some browsers blur anyway, despite the preventDefault on pointerdown.
+      await nativeInput.evaluate((el: HTMLInputElement) => el.blur());
+      await page.waitForChanges();
+
+      await page.mouse.up();
+      await page.waitForChanges();
+
+      await expect(searchbar).toHaveJSProperty('value', '');
+    });
+
+    test('should hide the clear button when the press is abandoned', async ({ page }) => {
+      await page.setContent(`<ion-searchbar value="abc" show-clear-button="focus"></ion-searchbar>`, config);
+
+      const searchbar = page.locator('ion-searchbar');
+      const nativeInput = searchbar.locator('input');
+      const clearButton = searchbar.locator('.searchbar-clear-button');
+
+      await searchbar.evaluate((el: HTMLIonSearchbarElement) => el.setFocus());
+      await expect(clearButton).toBeVisible();
+
+      const box = (await clearButton.boundingBox())!;
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
+      await page.mouse.down();
+      await nativeInput.evaluate((el: HTMLInputElement) => el.blur());
+      await page.waitForChanges();
+
+      // Releasing off the button sends the click to an ancestor, not the button.
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2 + 200);
+      await page.mouse.up();
+      // A regression would clear via onClearInput's 64ms timer; outlast it.
+      await page.waitForTimeout(100);
+
+      await expect(searchbar).toHaveJSProperty('value', 'abc');
+      await expect(clearButton).not.toBeVisible();
+    });
   });
 
   test.describe(title('searchbar: placeholder'), () => {