ionic-team / ionic-v1

The repo for Ionic 1.x. For the latest version of Ionic, please see https://github.com/ionic-team/ionic
Other
192 stars 187 forks source link

Wrong input takes value when moving from one <input> to another <input> (each <input> in <iframe>) #380

Open sriduth opened 6 years ago

sriduth commented 6 years ago

Short description of the problem:

If <input1> inside <iframe1> has the focus and iOS autocorrect suggestion comes up (word gets highlighted in blue), focussing on <input2> in <iframe2> and typing results in data appended to input1 instead of input2, even though cursor is on input2.

iframe1 and iframe2 have the same src.

What behavior are you expecting?

User Input is shown in the right element .

Steps to reproduce:

  1. Type input in first input of page, waiting for the iOS keyboard autocorrect.
  2. Once autocorrect suggests a spelling fix (example: typing Grt might suggest Get as the correction) tap on next input.
  3. Type something in the second input
index.html
<html>
    <head>
        <style>
            iframe {
                width: 100% !important;
                height: 100px !important;
                float: right;
            }
        </style>
    </head>
    <body>
        <form>
            <!-- 
             Use python -m SimpleHTTPServer 8001 to quickly host. Connect iPhone and Mac to same
            wifi. 192.168.0.178 is my laptop's IP.
            -->
            <iframe src="http://192.168.0.178:8001/safari2.html"></iframe>
            <iframe src="http://192.168.0.178:8001/safari2.html"></iframe>
        </form>
    </body>
</html>
safari2.html
<html>
    <head>
    </head>
    <body>
        <input  type="text" />
    </body>
</html>

GIF : https://user-images.githubusercontent.com/4116675/39105599-7a58562c-46d4-11e8-8ab8-7d2fee3d1bc0.gif

Other information:

WebView implementation: UIWebView

Which Ionic Version? 1.x

Plunker that shows an example of your issue

For Ionic 1 issues - http://plnkr.co/edit/Xo1QyAUx35ny1Xf9ODHx?p=preview

Run ionic info from terminal/cmd prompt: (paste output below)

myApp [master●●] % ionic info [WARN] Error with ./www/lib/ionic/version.json file: FILE_NOT_FOUND, trying ./bower.json.

cli packages: (/Users/sriduth.jayhari/code/myApp/myApp/node_modules)

@ionic/cli-utils  : 1.19.2
ionic (Ionic CLI) : 3.20.0

global packages:

cordova (Cordova CLI) : 7.0.1
Gulp CLI              : CLI version 3.9.1 Local version 3.9.1

local packages:

Cordova Platforms : ios 4.3.1
Ionic Framework   : ionic1 1.3.4

System:

Android SDK Tools : 26.1.1
ios-deploy        : 1.9.0
Node              : v9.5.0
npm               : 5.6.0
OS                : macOS High Sierra
Xcode             : Xcode 9.2 Build version 9C40b

Environment Variables:

ANDROID_HOME : /Users/sriduth.jayhari/Library/Android/sdk

Misc:

backend : pro