search

XRPLF / xrpl.js

A JavaScript/TypeScript API for interacting with the XRP Ledger in Node.js and the browser
https://xrpl.org/
1.19k stars 507 forks source link

Client event listener duplicates after browser reopening (Mostly mobile). #2486

Open josemq2000 opened 9 months ago

josemq2000 commented 9 months ago

Each time the browser is reopened, a new instance of the event listener is created.

How to reproduce:

main.js

const client = new xrpl.Client('wss://xrpl.ws');

client.connect()

client.on('connected', async () => {
     console.log('Test')
})

index.html

<!DOCTYPE html>
<html lang="en">

<head>...</head>
<body>...</body>
<script src="[https://unpkg.com/xrpl/build/xrpl-latest-min.js">](https://unpkg.com/xrpl/build/xrpl-latest-min.js%22%3E)</script>
<script src="src/main.js"></script>
</html>

Sandbox url: https://playcode.io/1603411

  1. Open url in browser.
  2. Minimize Browser (Do not kill the app).
  3. Open any other app.
  4. Reopen the browser.

Tested on Safari and Chrome for iOS.

9oelM commented 9 months ago

Having worked with websocket many times before, I believe this is an expected behavior, because the browser tends to stop the ws connection when it does not have heartbeat messages being exchanged back and forth and the browser is not 'focused'.

In this case, you may need some code that would refresh the page or sth inside the connected callback.

It will be easier to debug if u attach an event listener to other types of events like 'disconnected' if they exist.

josemq2000 commented 8 months ago

I've tried using the "disconnected" event listener, but unfortunately the web browser never calls it upon closing the app, it only works when closing the tab or redirecting to other url. A page refresh would definitely be a workaround, as you suggest.

ckniffen commented 8 months ago

@josemq2000 have you tried xrpl-client? Might help narrow down what the root cause is.

josemq2000 commented 8 months ago

@josemq2000 have you tried xrpl-client? Might help narrow down what the root cause is.

At this point, xrpl.js is so embedded in my project that it would require a lot of work to refactor everything, but it would be worth a try.

ckniffen commented 8 months ago

I just mean as a small proof of concept.

josemq2000 commented 8 months ago

I appreciate it, seems like with xrpl-client the issue persist. I have made a workaround using a connection counter to refresh the page, but this may not be the best approach as the application needs to process queued jobs sometimes.

IMG_6703

Maybe some sort of 'wake-up' handler would come handful.