How to control Android Chromium's text selection handles on JavaScript level? - javascript

In an Android application, I use an WebView to load an html page with texts.
When long click on texts, the blue Chromium text selection handles show up so that I could drag to change the text selection and do actions like cut/copy/paste.
But the blue handles are on the Chromium level. Is it possible to control those blue handles on JavaScript level (or on Android level)?
For example, when some DOM events fired (or Android events), I want to move the right-side blue handles to the next line's 3rd character.
I've seen workaround to intercept the native Chromium selection and create customized selection handles, e.g. https://github.com/btate/BTAndroidWebViewSelection, but here I'm wondering if I could directly get control over the Chromium's text selection handles via some Chromium's public API either open to JavaScript or Android?

Related

How to prevent formula touch event in MathJax?

How can I prevent formula touch event in MathJax? e.g. when I touch or click a formula rendered by MathJax It is gone to surround by a blue border as a response that it is touched.
This is an Example form MathJax test folder.
I have already set showMathMenu: false but I am unable to prevent this.
The outline is part of the standard browser interface for focusable items on the page. In version 2.6, MathJax added support for users using assistive technology, and that included making the MathJax menu accessible to keyboard users and those with screen readers. In order for that to work, the math expressions need to be able to accept the browser focus (so that keystrokes will be targeted to them, so the menu can be opened).
The outlines you are seeing are the focus highlighting that is the default styling for focused items in the browser (the actual effect differs between browsers, but all browsers should provide some form of visual indication for the focused item). Without that, keyboard users will not be able to know when and which math expressions are selected for keyboard focus. Removing that would make it harder (or impossible) for those users to properly interact with MathJax and its menus.
While you certainly could add CSS to your page to remove the outlines, it would be a mistake to do so, unless you have no concern for those users who require assistive technology to support their reading of your pages. You should note that all focusable elements should get these outlines (buttons, menus, input areas, etc.) when you click on them. For example, the editor I'm typing into right now has a blue outline indicating that it currently has the keyboard focus. This is part of the standard interface for focusable items, and is not something you should try to disable.

How can I get a WKWebView to show the keyboard on iOS?

My iOS app uses a WKWebView with contenteditable = true on a specific div. I'd like to have code to make the keyboard show up for the web view, so the user can just start typing. Things I've tried that have had no effect:
Telling the web view to becomeFirstResponder (a long shot, because the web view wouldn't know what div to use).
Injecting JS to tell the div to focus(). (This works in other browsers, but sadly not in WKWebView)
Simulating touch events in JS via TouchEvent and dispatchEvent() in the hope of making it seem that the user had tapped on the div.
In the third case I also used addEventListener() to observe the simulated touches and compare them to real touch events from tapping the screen. It looks like the key difference is that the event's isTrusted value is false for the simulated touches.
I get that it's a potential security issue to let apps simulate touch events, but I didn't have any other ideas. I'm trying to get the keyboard to appear, what the user types is up to them and not something I want to mess with. Basically I want the same thing as calling becomeFirstResponder() on a UITextView.
This is very similar to a WebKit issue 142757 but I haven't figured out how to use the suggested workaround linked from there.
Clarification: I can set up and use an editable web view, but the keyboard doesn't appear until I tap on the web view. I'm trying to make the keyboard appear automatically, without requiring a tap to initiate editing.
I tried this in an iPad playground, and it works without any action on my part. It’s possible there is another view that is capturing touches, or “contenteditable” is misspelled, or something else?

Electron app interacting with WebView drag-drop

I'm developing a (desktop) application in Electron (v1.6.2) that has a <webview> element (hosting 'guest' web pages) and a number of text fields, both <textarea> and <input type="text">.
We would like the user to be able to select text within the guest page inside the WebView and drag-and-drop it into the application's fields -- but, this isn't working.
Without doing anything special, I can select text in the guest page and drag-and-drop it into other applications outside of Electron.
E.g. -
Dropping it into a text editor, a text-field in a web-browser or my terminal window works fine.
It even works dropping it into a field in a different instance of my Electron application.
I can also drag text that is in the application, but not inside the WebView, and drop that in the fields Ok.
However, when dragging the text selected in the WebView, the fields in the application are not sensitive to events -- i.e. they receive no dragover or drop events, and focus does not switch to them as you would expect.
I've tried adding event handlers to the <webview> to intercept the mouse events (mosedown, mousemove, mouseup) in order to manually control things and tried to use event.preventDefault = true to disable the events from passing down to the guest page.
Everything behaves as I would expect util the moment when it is recognised that you are dragging text. Visually, this is the moment when the pointer switches to a closed fist and a ghostly rectangle appears showing the selected text. At that moment all mouse events cease to be received by the <webview> event handlers. It seems that the application is 'frozen' when text is being dragged.
Is there anything I can do about this?
It would work either to: -
- prevent the WebView from actually dragging text, and for me to simulate it programmatically;
- or to find a way to 'unfreeze' the application during the text-dragging, so that the fields are active, can see events and can receive dropped text.
This is a bug present in Electron v1.6.2.
It is fixed in Electron v1.6.5, released at the end of March 2017.
I've now updated to the latest stable release, v1.6.11, and the issue is fixed.

How to disable the Android keyboard from taking the control over input fields in webview?

I have been working on this specific requirement for more than 2 months now. But I haven't found a solution yet to disable the native keyboard when an input field is focused in a webview. I am building an app which has a built in keypad(essentially a view) and I want this to be displayed instead of the native keyboard.
What I've tried so far:
Add javascript eventListener for click events to display my keypad
using JavscriptInterface.(Works)
Set the webview focusable:false and
its parent's descendantFocusability to blocksDescendants (This works
but doesn't display the cursor on the input field)
Hiding the native
keyboard on resize event of javascript using loadUrl method.(Works
but the native keyboard is displayed momentarily before hiding the
keyboard)
Listening to the OnGlobalLayoutChange event to check if
the keyboard has been added. (Works but the result is same as
in the case above with a little improve in performance)
Force stop the IME service. (Works but the app has to be a system
app to force stop packages and the keyboard service has to be started
whenever the app goes to background.
Is there a way in which I can make this work?
You should set the windowSoftInputMode to stateAlwaysHidden for the Activity containing the web view. This should keep the onscreen keyboard hidden for the entirety of that Activity.

How to remove or disable "Define" option when selecting text in an HTML input control on an iOS 7 WebView?

I have a simple input (type="text") html control being displayed inside a WebView in our iOS application.
When the text is selected inside the input control, an iOS dialog automatically appears with four options: "Cut", "Copy", "Replace...", and "Define". I need to be able to remove or disable, at minimum, the "Define" option.
The reason for this is because our application is typically used for connecting to another device on a local area network lacking an internet connection. When the "Define" option is pressed, it would appear iOS attempts to make some sort of internet request to search for something. When there is no internet connection present, the iOS application appears to lock up for a full 5-10 seconds, wrecking all sorts of havoc in our application.
Is there any sort of CSS, HTML META, or iOS option to prevent the "Define" option from being available?
In case anyone is confused, here is an example of what I'm talking about:
By using css you can prevent selection of the text, so menu will not apper( with user-select:none).
Also you can disable this menu to show using this link prevent define from showing in edit menu

Categories