Disable mobile Chrome 43's "Touch to Search" feature programmatically

Question

When I select text in Chrome 43 on my Android device I get the "Touch to Search" popup. We're currently using text selection for a feature on our site and this new Chrome feature interferes with some of our UI.

In the long run, we'll be working out new UI/UX to work side-by-side with this feature, but in the interim, we want to disable it on our web app.

Is there some sort of meta tag or JavaScript we can add to turn this off? Does anyone know if this is currently possible?

Brian

Answer 1

This can be manipulated in a number of ways. The user can turn it off in flags as PaulI suggested, and you can control it.

Developer control, right now there are a couple of options but the basic summary is if we think it is an user interactable element then it won't be enabled:

• CSS: -webkit-user-select: none;
• HTML:
  
  • Anything with an aria-role will not have the touch to search enbabled
  • Anything with a tabindex of -1 or > 0

Nicker

Awesome, thanks for the background info on that. Very informative! – Brian

So in testing this out, I'm not sure this does anything. I've tried applying tabindex/aria-role to invidual elements, body tag, and a div container that wrapped the body. Search still shows up on highlight. – Brian

I have updated it -webkit prefix. tabindex works in jsbin.com/subora/latest but its a poor experience. Aria-role is supposed to work but looks like it doesnt – Nicker

Thanks for setting up a test page! I'm testing it on Chrome 43 on a Samsung Galaxy Note 4 running Android 5.0.1. I can confirm that the only method that works for me is preventing a user selection via the user-select prop, which works in some cases but not in our primary use case. I agree that the tabindex is a poor experience (and it doesn't work for me). Do you have any ideas on if this will be fixed in a later version of Chrome? Would love to be able to just add an aria-role to take care of this. Appreciate the help! – Brian

I had added role="main" in a wrapping div tag awhile back and I checked this morning again and it now seems to be working as you posted. Thanks for the post Kinlan! – Brian

The CSS disables user text selection completely. The OP is using text selection, so not a good answer to this particular question. Also, I just tried jsbin.com/subora/latest with Android Chrome 63.0.3239.111 on a Samsung Galaxy Tab Pro 12.2, and neither role=main nor tabindex=-1 disables Touch to Search from scrolling up from the bottom of my screen when I long-press on a word. – Manley

@Nicker this doesn't work at all. Any text selection from a none editable region is sent to the search widget. This feature needs to be developer controlled. – Tuberous

Answer 2

Possible workaround could be to wrap text in <button> tag. This obviously wouldn't work if talking about big blocks of text, but for other elements like titles, icons and other small stuff this works fine.

Ticktack

Answer 3

As of 2021, it isn't possible to disable touch-to-search (when this is triggered by a long-press for text selection) in chrome mobile. The article that Kinlan is referencing is apparently concerned only with touch-to-search triggered through a tap gesture.

Quoting donnd, from bugs.chromium.org:

Regarding #2 -- developer control: The 2015 article that you mentioned (https://developers.google.com/web/updates/2015/10/tap-to-search) focuses on triggering through the tap gesture. As you correctly point out, it does not address the long-press gesture triggering. Touch to Search responds to both tap and long-press but treats them differently. As I'm sure you know, the long-press gesture activates a whole set of features which can include copy, translation, smart text selection, and Web Search. A site developer can markup their page text as non-selectable in order to disable the long-press gesture entirely, but currently there's no way to disable only the Touch to Search response to long pressing. If you'd like to work with us to add such a feature, let us know and we'll file a separate feature request.

Semiporcelain

Answer 4

If you want disabled "touch to search" in a menu that has an action open / close (toggle), it is necessary to javascript :

event.preventDefault();

Eckhart

Please read carefully what the author is asking for. It has nothing to do with open / close toggles. – Ticktack

I think I read well. An interactive element (event) my solution is good. Please link this: developers.google.com – Eckhart

Kortex, yes, you were right and excuse me for misunderstanding. I tried using preventDefault() before posting my comment and it didn't work. It still doesn't work but maybe due to other reasons. – Ticktack

Answer 5

Navigate to about:flags or chrome:flags and look for Enable Contextual Search

Then toggle to Disabled and hit restart at the bottom.

Religieuse

Thanks Paul. I'm actually looking for a way to disable it temporarily for users who visit our web app. We have an "annotations bar" that flies up from the bottom of the page on the selectionchange event. The new Touch to Search bar is slightly larger than our bar and completely covers it up. We were hoping it was possible to programmatically disable it (CSS/HTML/JS), similar to how one could disable the right click menu (or replace it), so that the user didn't have to do anything and our current UX would continue to work. Appreciate the fast response! – Brian

This does not answer the question. – Zoometry