Events are not isolated between multiple instances of IAB

[sagrawal31]

Bug Report

Problem

If multiple instances of IAB are created, only the events from the last created IAB instances are called back.

What does actually happen?

Consider, we create one InAppBrowser-

const inAppBrowserRef1 = cordova.InAppBrowser.open('http://example.com', '_blank', 'location=yes');

inAppBrowserRef1.addEventListener('loadstart', loadStartCallBack);
inAppBrowserRef1.addEventListener('exit', loadExitCallBack);
inAppBrowserRef1.addEventListener('message', messageCallBack);

All the callback works fine. Now, while this IAB is open and we launch another IAB with target as _system-

const inAppBrowserRef2 = cordova.InAppBrowser.open('http://google.com', '_system');

inAppBrowserRef2.addEventListener('loadstart', loadStartCallBack);
inAppBrowserRef2.addEventListener('exit', loadExitCallBack);
inAppBrowserRef2.addEventListener('message', messageCallBack);

After this code is executed, all the event listeners on inAppBrowserRef1 stop working and instead they start to execute on inAppBrowserRef2 listeners for the first IAB instance.

What is expected to happen?

Event callbacks on inAppBrowserRef1 should work irrespective of other IAB i.e. inAppBrowserRef2.

Information

Came to know about this problem while implementing message listeners and I was able to listen the message events only once as described here https://gist.github.com/sagrawal31/9004198ae56a58ff235ce0f1dd62362c

Command or Code

Already shared the code above.

Environment, Platform, Device, Version information

• Cordova- 9.0.0 ([email protected])
• cordova-android- 8.1.0 & 9.0.0
• Android OS- Samsung UI 2.0 (Android 10)
• Plugin version- ^4.0.0
• OS- macOS Catalina
• Tested on a fresh/empty Cordova app
• Android Studio- 4

Checklist

• [x] I searched for existing GitHub issues
• [x] I updated all Cordova tooling to most recent version
• [x] I included all the necessary information above

[pat-flew]

I had the same issue on Android. Reattaching events to the return value of the cordova.InAppBrowser.open('http://google.com', '_system') call seemed to resolve for me at the time. The issue didn't appear to affect iOS.

However having done some further testing in iOS, It appears that following opening a system browser and pressing the top left arrow to go back, the original app browser reference no longer responds to executeScript (script is not executed and callback is never called), and using the updated reference from InAppBrowser.open does not help.

[sagrawal31]

Yes, passing _system was not an option for me because of the same issue in iOS.

[javierjsp]

This is still a Issue Same behaviour on Android and iOS, the events are not isolated between multiple instances.

InAppBrowser.open('http://example.com', '_blank'); & cordova.InAppBrowser.open('http://google.com', '_system')

Tested on Android 10 and iOS 14.4(iphone XR)

[brunogc]

I am experiencing the same problem.

However, unlike everyone above, reattaching the event does not seem to work for me (Android 10, Cordova 10, InAppBrowser 5).

[Delagen]

Experience the same issue, look for plugin that simply open url in external browser

[FransGH]

Just stumbled over the same issue. As quick workaround for just being able to open a _system window, this seems to work (tested on iOS):

cordova.exec(iaRef._eventHandler.bind(iaRef), iaRef._eventHandler.bind(iaRef), 'InAppBrowser', 'open', [url, '_system', 'location=no,hidden=yes'])

This opens a new system window while passing the original event handlers.