OneSignal / OneSignal-Website-SDK

OneSignal is a push notification service for web and mobile apps. This SDK makes it easy to integrate your website with OneSignal Push Notifications. https://onesignal.com
Other
389 stars 115 forks source link

[Bug]: ReplayCallsOnOneSignal.js:6 Uncaught TypeError: e is not iterable at o.processOneSignalDeferredArray, facing this issue whenever my app loads. #1190

Closed aman-u-7span closed 2 months ago

aman-u-7span commented 2 months ago

What happened?

I'm using Vue3

index.html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=yes"
    />
    <script src="https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.page.js" defer></script>
  </head>
  <body>
    <div id="app"></div>
    <script type="module" src="/src/main.js"></script>
  </body>
</html>

oneSignal.js (File i'm using to initialize one signal in the app)

async function getAccessToken() {
    try {
      window.OneSignalDeferred = window.OneSignalDeferred || []
      OneSignalDeferred.push(async function (OneSignal) {
        await OneSignal.init({
          appId: import.meta.env.VITE_ONE_SIGNAL_APP_ID,
          notifyButton: {
            enable: true
          }
        })
        const isPushNotificationSupported = OneSignal.Notifications.isPushSupported()

        await OneSignal.Notifications.requestPermission()

        if (
          isPushNotificationSupported &&
          OneSignal.Notifications.permission &&
          OneSignal.Notifications.permissionNative === 'granted'
        ) {
          console.log(OneSignal.User.PushSubscription.id)
          /* Code to save id in backend */
        } else {
          toast.notify({
            title: 'Check browser settings to recieve push notifications.',
            type: 'warning'
          })
        }
      })
    } catch (error) {
      console.log(error)
      handleGlobalError(error)
    }
  }

I'm not sure what i'm doing wrong, Onesignal-vue3 plugin didn't workout for me so had to use web-sdk for this one. Any guidance would be really helpful.

Screenshot 2024-09-06 at 12 06 24 PM

What browsers are you seeing the problem on?

Chrome (Chromium), Safari, Brave

What operating system are you running?

macOS monterey 12.7.1

Steps to reproduce?

Just use my code with vue3 and start the app with `npm run dev`

What did you expect to happen?

I expected it to work normally and also found that push notifications are bit inconsistence.

Relevant log output

No response

aleksi-magner commented 2 months ago

Try immediately after init to bind the context of the current user via the login() method

aman-u-7span commented 2 months ago

@aleksi-magner Tried it, still same issue. The thing is that this console error occurs even before init.

aleksi-magner commented 2 months ago

@aman-u-7span Isn't there a call somewhere to OneSignalDeferred.push() before this getAccessToken method is called? It looks like the window.OneSignalDeferred = window.OneSignalDeferred || [] initialization should be earlier

aman-u-7span commented 2 months ago

@aleksi-magner I tried calling .push() in index.html as well. Issue still persists.

aleksi-magner commented 2 months ago

@aman-u-7span For me, this error is reproduced only if window.OneSignalDeferred is not yet defined before the first call to window.OneSignalDeferred.push(). Therefore, I clarified - is window.OneSignalDeferred initialized before the first call to window.OneSignalDeferred.push()?

изображение

aman-u-7span commented 2 months ago

Ahh okay I got it. I was able to resolve the issue by initialising script manually and then defining the window.OneSignalDeferred. Thanks a lot mate @aleksi-magner