Mobile detection on TextInput is broken, please introduce an option/predicate to enable prompting

earthendev · April 14, 2020, 7:20pm

Yesterday I found out that my Babylon app ran almost* perfectly on my tablet without having to make any changes. Just by virtue of using the observables provided by Babylon itself Portability to mobile is one of Babylon’s major strengths I think. Thank you for that.

Unfortunately I wouldn’t be posting this to Bug reports if there was an issue where this portability broke down. I was using Chrome on Android (edit: the tablet version, phone version is fine) which does not have “mobile” in its UA string, leading to this check:

github.com

BabylonJS/Babylon.js/blob/master/gui/src/2D/controls/inputText.ts#L371


    return;
}
this._scrollLeft = null;
this._isFocused = true;
this._blinkIsEven = false;
this._cursorOffset = 0;
this._markAsDirty();


this.onFocusObservable.notifyObservers(this);


if (navigator.userAgent.indexOf("Mobile") !== -1 && !this.disableMobilePrompt) {
    let value = prompt(this.promptMessage);


    if (value !== null) {
        this.text = value;
    }
    this._host.focusedControl = null;
    return;
}


this._host.registerClipboardEvents();

failing and not showing the prompt. I was using the tablet without a physical keyboard and that left me with no option to enter text. The issue of course shows up in this PG as well:

https://www.babylonjs-playground.com/#UWS0TS

Of course I know there is no way to enable the virtual keyboard from JavaScript so this kludge is necessary. But checking this through the UA string breaks down in borderline cases such as this. Perhaps the caller should be able to supply a predicate function to decide whether a device is to be considered ‘mobile’ in this sense or not. Also, I think the default heuristic could be smarter, for example have the strings ‘iPad’, ‘iPhone’ or ‘Android’ also trigger the mobile behavior.

When I have the time I can do a PR for that. The change is simple enough. Just want to confirm whether there is a reason you are doing it this way. And are there any other places in the source code where prompts need to be displayed, or just this one?

Deltakosh · April 14, 2020, 7:56pm

Actually just set this to true if you detect condition that will prevent the use of the prompt

earthendev · April 14, 2020, 7:57pm

Yep, thanks, I saw that. My prob is exactly the opposite though! The prompt is supposed to show up but doesn’t.

Deltakosh · April 14, 2020, 8:01pm

hahaha! Maybe we can add a boolean to force it?

earthendev · April 14, 2020, 8:04pm

Yeah a boolean would be fine too. I have an onFocusObservable anyway so I’m doing my workaround through that. It’s just a bit surprising for simple cases.

Deltakosh · April 14, 2020, 9:27pm

Fancy doing a PR?

earthendev · April 14, 2020, 9:28pm

Yep. It’s on my to-do list

Mickael_PASTOR · October 1, 2020, 2:05pm

Hello !
I know this is an old topic, but I am currently having the same issue with a Huawei Mediapad M6 (if the model matter, but I doubt it).

Is the issue fixed? Is there something I can do to fix it?

Thx a lot

Deltakosh · October 1, 2020, 3:43pm

I think it was

Mickael_PASTOR · October 7, 2020, 12:33pm

I still have the problem, but I need to investigate further, maybe it’s due to my configuration.
Thx nevertheless

Topic		Replies	Views
Mobile GUI Improvements Feature requests	6	380	June 15, 2022
Change babylonjs version on playground mobile? Questions	5	525	October 26, 2020
Babylon.js native and inputs Questions	14	612	April 27, 2022
How to enable touch input for ArcRotateCamera on Babylon React Native Questions	21	2334	May 4, 2022
Babylon.GUI focus Questions	7	1022	July 15, 2019

Mobile detection on TextInput is broken, please introduce an option/predicate to enable prompting

Related topics