Skip to main content
Beta Feature: This feature is currently in testing. Use at your own risk. Behavior may change in future updates.
Pop Onboarding allows you to add a “Request Notification Permission” action to any button or icon in your flow. Since WebViews cannot request native permissions directly due to OS security sandboxing, this action sends a message to your native app, which must then trigger the actual OS permission dialog.

​
How it works

  1. You select “Request Notifications” as the action for a button in the Pop Editor.
  2. User taps the button.
  3. The WebView sends a postMessage with { type: 'request_notification' }.
  4. Your native code intercepts this message and calls the native permission API.

​
Implementation Guide

​
React Native

You can use the react-native-permissions or specific push notification libraries. 
import { check, request, PERMISSIONS, RESULTS } from 'react-native-permissions';

// Inside your WebView onMessage handler:
if (data.type === 'request_notification') {
  request(PERMISSIONS.IOS.NOTIFICATIONS).then((result) => {
    console.log('Permission result:', result);
    // Optionally trigger next screen in WebView
    // webViewRef.current.injectJavaScript('window.nextScreen();');
  });
}

​
Expo

If you are using Expo, use expo-notifications: 
npx expo install expo-notifications

import * as Notifications from 'expo-notifications';

// Inside your WebView onMessage handler:
if (data.type === 'request_notification') {
  const { status } = await Notifications.requestPermissionsAsync();
  console.log('Permission status:', status);
}

​
iOS (Swift)

import UserNotifications

// Inside your message handler:
if messageType == "request_notification" {
    UNUserNotificationCenter.current().requestAuthorization(options: [.alert, .sound, .badge]) { granted, error in
        print("Permission granted: \(granted)")
    }
}

​
Android (Kotlin)

// Inside your JavascriptInterface or implementation:
if (type == "request_notification") {
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.TIRAMISU) {
        requestPermissions(arrayOf(Manifest.permission.POST_NOTIFICATIONS), 101)
    }
}