Connection promise gets rejected with error if destroyed by the user

[munichmule]

Imagine the following common scenario:

1. I have a single-page application.
2. When user comes to a specific area, I create an iframe and connect to it with penpal.
3. When user leaves that area, I destroy the connection and remove the iframe.

In this scenario, if user leaves the area before connection is established (it may take time due to network latency etc), connection promise is always resolved with an error logged in the console. This is nasty because from code perpective I do it right by calling connection.destroy() to let penpal know the connection is destroyed on purpose, so it's not an error and shouldn't be logged like that.

In order to hide the error, I have to eat all exceptions from connection.promise which potentially hides real connection problems.

Here is the code sample:

const page = document.getElementById('page');
const iframe = document.createElement('iframe');
iframe.src = 'child.html';

const connection = Penpal.connectToChild({iframe, debug: true });
page.appendChild(iframe);

// Emulate cleanup happening when user is leaving the page.
setTimeout( () => {
	connection.destroy();
	page.removeChild(iframe);
}, 0);

And here is the error logged in console:
Error in console

And here is the workaround I use:

const connection = Penpal.connectToChild({iframe, debug: true });
connection.promise.catch(()=>{}); // Ugly because it may hide real connection problems.
page.appendChild(iframe);

Ideally connection promise shouldn't get rejected with a error if connection was destoryed by a user. It should just never resolve, same way as child methods work on a destroyed connection.
We should see this error only if connection was aborted by penpal (for instance, by iframe watcher).

[Aaronius]

Hey @h15ter, thanks for logging the issue. I can see that being annoying. I'm going to leave this issue open because I'll probably change the behavior in the next major version.

In the meantime, could you do the connection.promise.catch(()=>{}); right before you destroy the connection?

const page = document.getElementById('page');
const iframe = document.createElement('iframe');
iframe.src = 'child.html';

const connection = Penpal.connectToChild({iframe, debug: true });
page.appendChild(iframe);

setTimeout( () => {
  connection.promise.catch(() => {}});
  connection.destroy();
  page.removeChild(iframe);
}, 0);

[Aaronius]

This change was released in v6. Thanks!