Hawk
Posts: 0
Joined: Mon Aug 04, 2014 11:23 am

Populate data into new window

Hi,

I have the following line onclick that open login page of some website:

prewindow.open('https://link.com', '_blank', 'location=yes'); /pre

It opens new window that looks like this:

Image

I want to populate some data into username and password fields automatically when the window open. How can I do that?

Egor Kotov6832188
Posts: 0
Joined: Wed Nov 19, 2014 5:15 pm

Populate data into new window

Hello Hawk

This feature can be implemented only with postMessage API released in HTML5, this imply you need to implement some part of this feature in targeted site

Hawk
Posts: 0
Joined: Mon Aug 04, 2014 11:23 am

Populate data into new window

Hi Egor,

I managed to do that in the browser (Chrome), but when I tested it in Appery tester and after I generated the apk, it is not working.

This is my code on click:

prevar username = localStorage.getItem("username");
var password = localStorage.getItem("password");
var language = localStorage.getItem("lang");
var credentials = username+'-'+password;
var msg = language+':'+username+'-'+password;
var loginWindow = window.open('https://jtipartner.com.my/jdev', '_blank', 'location=yes');
//loginWindow.postMessage('username', 'https://jtipartner.com.my/jdev');

function giveMeUsername(){
loginWindow.postMessage(msg, 'https://jtipartner.com.my/jdev');
}

window.addEventListener('message', function(event) {
var message = event.data;
if(message == 'giveMeUsername'){
giveMeUsername();
}
}, false);
/pre

On the website side, I've added

preaddScriptDeclaration("
console.log('message received1: ');

window.onload = function(){
window.opener.postMessage('giveMeUsername', '*');
console.log('message received2: ');
};

function GetSubstringIndex(str, substring, n) {
var times = 0, index = null;

Code: Select all

 while (times < n && index !== -1) { 
     index = str&#46;indexOf(substring, index+1); 
     times++; 
 } 

 return index; 

}

Code: Select all

 window&#46;addEventListener('message', function(event) { 
console&#46;log('message received3:  '); 
&#47;&#47;if(event&#46;origin !== 'http:&#47;&#47;appery&#46;io') return; 
   var message = event&#46;data; 
console&#46;log('message received5:  '+message); 
&#47;&#47;var username = message&#46;substr(0, message&#46;indexOf('-')); 
var lang = message&#46;slice(0,2); 
var username = message&#46;substring(message&#46;lastIndexOf(':')+1,message&#46;lastIndexOf('-')); 
   var password = message&#46;substr(message&#46;indexOf('-') + 1);    
jQuery('input#username')&#46;val(username); 
jQuery('input#password')&#46;val(password); 

 document&#46;getElementById('loginbtn')&#46;click(); 
 var x = document&#46;getElementById('loginbtn')&#46;name; 

 console&#46;log('message received6:  '+ x); 

 }, false); 

");

$document-addScriptDeclaration("
console&#46;log('message received6: ');
");

?/pre

This is working very fine on the browser. It opens new window, and it populates the username and passwords in their fields. On the device, nothing occurs!

Thank you for your help!

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Populate data into new window

Hi Hawk,

Good implementation.

Please add to your code some console.log to see where this process stucks. Then use WEINRE debugger to see these logs.

Regards.

Hawk
Posts: 0
Joined: Mon Aug 04, 2014 11:23 am

Populate data into new window

Hi Yurii,

I added console.log and I tested it. No errors show in WEINRE or Chrome console.
To replicate it:

public link: http://appery.io/app/mobile-frame?src...

credentials: 10500050/JTI00050

Navigation: login - earn points (from NavBar) -- website button (it opens new window and populates username and passwords into their fields. However, this only happens when I use browser. Even with WEINRE, I use browser to debug and everything is working fine. Only on Appery tester and after I generate apk, it does not work. But I'm not sure how to debug on the DEVICE itself.

Thanks,

Egor Kotov6832188
Posts: 0
Joined: Wed Nov 19, 2014 5:15 pm

Populate data into new window

Hawk,

try to add console.log or alert function inside next event:
window.addEventListener('message', function(event) { ...

You probably will not get any notification from that handler.

Hawk
Posts: 0
Joined: Mon Aug 04, 2014 11:23 am

Populate data into new window

Hi Egor,

That is correct. In browser, the alert is showing, but in appery tester it is not.
Why is that? and how can I solve it?

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Populate data into new window

Hi Hawk,

You use inAppBrowser. In this case window.open returns other then window object.

Thus you can not use there "postMessage" functionality.

Please take a look about details here: http://blogs.telerik.com/appbuilder/p...

Regards.

Hawk
Posts: 0
Joined: Mon Aug 04, 2014 11:23 am

Populate data into new window

Hi Yurri,

"postMessage" was recommended by Appery!

I went through the blog. I did not see any use of postMessage, the method provided is to pass from inAppBrowser and not to it.

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Populate data into new window

Hi Hawk,

Thanks for this update.

If you want to interact with inapp browser you need to use API defined in this cordova plugin.

More info here: http://blogs.telerik.com/appbuilder/p...

Regards.

Return to “Issues”