Post search input “close” (×) button should use cursor: pointer

[sumitsingh]

When using the Posts screen search feature in WP Admin (/wp-admin/edit.php), the close (×) button inside the search input field does not show a pointer cursor on hover.
This makes it appear non-interactive even though it is clickable.

Steps to Reproduce

Go to Posts → All Posts in WP Admin.

Enter a search term (e.g., “uncategorized”).

Notice the × clear button appears in the search input.

Hover over the × icon.

Expected Behavior

The × clear button should display cursor: pointer;

This will indicate to users that the element is clickable.

Actual Behavior

The cursor remains default, not pointer.

This reduces clarity of the UI and affects accessibility & usability.

Suggested Fix

Add CSS to apply a pointer cursor on the clear button:

.wp-filter .search-input button.clear,
.search-box input[type="search"]::-webkit-search-cancel-button {
    cursor: pointer;
}

[sumitsingh]

Post search input “close” (×) button should use cursor: pointer

[manhphucofficial]

Adds cursor: pointer to the search clear (×) button in the Posts list screen. This improves usability and accessibility by indicating that the element is clickable.

[manhphucofficial]

Hi @sumitsingh,

Thanks for the report!

I’ve attached a patch that adds cursor: pointer to the search input clear (×) button
in the Posts list screen. This ensures the UI properly indicates that the element
is clickable, improving usability and accessibility.

Tested on:

• Chrome
• Safari
• Firefox

The clear button now behaves as expected and shows the pointer cursor on hover.
Please let me know if you'd like any refinements.

Thanks!

This PR addresses ticket #64382 in WordPress Trac.

The issue:
When using the search input in the Posts list screen (/wp-admin/edit.php),
the search clear (×) button does not display a cursor: pointer on hover,
making it appear non-interactive even though it is clickable.

The fix:
Adds cursor: pointer to the WebKit search input clear button pseudo-element.

Testing:

• Verified on Chrome, Safari, and Firefox.
• Hover state now correctly shows a pointer cursor.
• No regressions observed.

Trac ticket: https://core.trac.wordpress.org/ticket/64382

Note:
Per WordPress Core guidelines, this PR is provided for code review only.
All discussion and final commit should happen in the Trac ticket.

[joedolson]

This seems fine to add. There is a long debate about the usage of the pointer cursor in #47171 that's worth reading for some history on this, but for consistency, this makes sense.

I am curious about the test results that mention testing on Firefox - as far as I know, Firefox doesn't render a clear button in search forms on either Windows or Mac; what exactly do those tests cover?

[manhphucofficial]

Thanks for the clarification, @joedolson!

To clarify the testing notes:

• Chrome & Safari: tested the native clear (×) button and verified the pointer cursor works as expected.

• Firefox: since Firefox does not render a native clear button for <input type="search">, there was no hover behavior to test. I only confirmed that the added CSS does not introduce any visual or functional regressions in Firefox.

I'll update the testing notes to reflect this more accurately.

Thanks again for reviewing!

@manhphuc Tested on wordpress playground. it's working fine