Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-24259] iOS: Multiple Webviews with same local URL does not inject Titanium XHR bridge properly

GitHub Issuen/a
TypeBug
PriorityCritical
StatusClosed
ResolutionFixed
Resolution Date2016-12-28T19:57:26.000+0000
Affected Version/sRelease 6.0.1
Fix Version/sRelease 6.1.0
ComponentsiOS
Labelscommunity, ios, local, notable, webview
ReporterFlavio De Stefano
AssigneeHans Knöchel
Created2016-12-24T11:46:26.000+0000
Updated2017-01-20T22:32:56.000+0000

Description

Yes, I know that this is an extreme case, but it happened to us (me and @Jei). When you try to load multiple (1+) webviews at the same time with *same local URL*, the listeners provided by the XHR bridge (ti-injection) works *only for the first one instantiated*. I debugged for hours, and finally realized why this happens. The _LocalProtocolHandler_ class implemented in the Webview communication receives only the first URL to load; and this causes only one injection *with the same Ti.pageToken*. In this screenshot you can see that the generated pageToken is the same: !https://cl.ly/3H393n3C2a2D/Screen%20Shot%202016-12-24%20at%2012.29.07.png! The solution would be to inject a new header that has a unique counter thats incremented every time a new local URL is set.

Attachments

FileDateSize
file.html2017-01-20T19:47:11.000+0000369

Comments

  1. Hans Knöchel 2016-12-28

    Community PR: https://github.com/appcelerator/titanium_mobile/pull/8712 Test-Case:
       var w = Ti.UI.createWindow();
       var i = 0;
        
       var a1 = Ti.UI.createWebView({ url: "file.html", borderColor: "#000", borderWidth: 1, left: 0, top: 0, width: "50%", height: "50%" });
       var a2 = Ti.UI.createWebView({ url: "file.html", borderColor: "#000", borderWidth: 1, right: 0, top: 0, width: "50%", height: "50%" });
       var a3 = Ti.UI.createWebView({ url: "file.html", borderColor: "#000", borderWidth: 1, left: 0, bottom: 0, width: "50%", height: "50%" });
       var a4 = Ti.UI.createWebView({ url: "file.html", borderColor: "#000", borderWidth: 1, right: 0, bottom: 0, width: "50%", height: "50%" });
        
       w.add(a1);
       w.add(a2);
       w.add(a3);
       w.add(a4);
        
       function onLoad() {
           // should be "FEFIFO-4" after the first load and "FEFIFO-5" after clicking the first web view
           Ti.App.fireEvent('test', { text: 'FEFIFO-' + (++i) }); 
       }
       
       function reload(e) {
           e.source.reload();
       } 
        
       a1.addEventListener('load', onLoad);
       a2.addEventListener('load', onLoad);
       a3.addEventListener('load', onLoad);
       a4.addEventListener('load', onLoad);
       
       a1.addEventListener('click', reload);
       a2.addEventListener('click', reload);
       a3.addEventListener('click', reload);
       a4.addEventListener('click', reload);
        
       w.open();
       
  2. Lee Morris 2017-01-20

    Using the sample code above with the attached HTML file I verified that the page token was unique for each instance of the web view and that all event listeners fired on all web views. Tested on; iPhone 7 (10.2) and Simulator (10.2) MacOS 10.11.6 (15G31) Studio 4.8.1.201612050850 Ti SDK 6.1.0.v20170118152304 Appc NPM 4.2.8 Appc CLI 6.1.0 Ti CLI 5.0.11 Alloy 1.9.5 Arrow 1.10.1 Xcode 8.2 (8C38) Node v4.6.0 Java 1.7.0_80

JSON Source