3.4.1.1 input field unselectable in webkit. "-webkit-user-select: none;" -> ignore

[lanbo]

Hi there,

File ext-all.css packaged in extjs 3.4.1.1 comes with a minor problem.

I have a grid using Ext.ux.grid.Search plugin. This plugin let's you search the grid.
The plugin adds an input field where you can type the text to search. The problem is the input field is unselectable when using extjs 3.4.1.1 combined with webkit.

I've traced the CSS and found the difference between 3.4.0 and 3.4.1.1. This is how 3.4.1.1 looks like:

.x-unselectable, .x-unselectable * {
user-select: none;
-o-user-select: none;
-ms-user-select: none;
-moz-user-select: -moz-none;
-webkit-user-select: none;
cursor: default;
}

While 3.4.0 had:

.x-unselectable, .x-unselectable * {
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: ignore;
}

I'm not an expert in CSS but I believe -webkit-user-select should have been kept to ignore.

EDIT: In fact -webkit-user-select: ignore; is an invalid property. I thing -webkit-user-select: auto; is better.

I added this to my css and makes it work:

.ext-webkit .x-unselectable, .x-unselectable * {
-webkit-user-select:auto;
}

I hope this report helps in fixing this possible problem for others. Perhaps developers acknowledge this as a bug and fix it for others too.

[mitchellsimoens]

If you are reporting a bug, please post in the bugs forum.

Thanks for the report! I have opened a bug in our bug tracker.

[msantang]

I try your sugested fix and works, but you can select all the obj on the screen too. I use this:

.ext-webkit input {
-webkit-user-select:auto;
}

So you change the css property on inputs only.