Those are both very good points I hadn't considered. Maybe visually show/hide the button on input focus, and then persist that state if the user has entered some input into the field?
Maybe this isn't the best example of the :not(:placeholder-shown) selector in use, but now it has me thinking about other ways this selector could be used to enhance rather than diminish accessibility.
:placeholder-shown doesn't rely on focus so it would still work while navigating with the keyboard, but screen readers would still be lost if you wanted to dim the search button. Also, you'd have to use either the disabled attribute, or better, aria-disabled (it's considered bad practice to disable a button as you might not know what disabled it, so you should still be able click it and get a proper error message), but both would require some JS to dynamically change their value. So yeah, it can be a useful pseudo-class but it turns out to be tricky, rather than a "trick" ;-)
We're a place where coders share, stay up-to-date and grow their careers.
We strive for transparency and don't collect excess data.