什么可能导致移动浏览器有时无法选择文本输入？

GOAL:
制作一个在桌面上也可以在移动设备上运行的聊天界面。

PROBLEM:
我已经整理了一个聊天机器人的概念验证。一切都是very简单，包括JS和CSS。
虽然我也有CSS 的一个单独问题 https://stackoverflow.com/questions/46434818/，我怀疑这个问题可能是JavaScript问题。

我有一个包含文本输入的 div。该 div 开始是隐藏的，当单击同级 div 时变得可见。
此外（当单击同级 div 时），焦点也会放置在其中包含的文本输入上。
然而......当某些人从移动浏览器进行测试时，输入字段无法访问/不可用。

// close invitation and open chat
document.getElementById('chatbot-invitation').addEventListener('click', function () {
    hideChatInvitation()
    showChatContainer()
});

function hideChatInvitation() {
    document.getElementById('chatbot-invitation').classList.add('hide');
}

function showChatContainer() {
    document.getElementById('chatbot-inner-wrapper').classList.remove('hide');
    document.getElementById('textInput').focus();
}

EXAMPLE:
http://temp.mosaranch.com/chatbot-tester http://temp.mosaranch.com/chatbot-tester

问题：
目前的重点是桌面浏览器。对于移动浏览器是否需要做一些不同的事情？