or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

authentication-sessions.mdbrowser-operations.mdcustom-tabs-management.mdindex.md
tile.json

index.mddocs/

Expo Web Browser

Expo Web Browser provides access to the system's web browser and supports handling redirects for React Native and Expo applications. It offers platform-specific implementations using SFSafariViewController and ASWebAuthenticationSession on iOS, and ChromeCustomTabs on Android, ensuring native browser experiences while maintaining security and performance.

Package Information

  • Package Name: expo-web-browser
  • Package Type: npm
  • Language: TypeScript
  • Installation: npx expo install expo-web-browser or npm install expo-web-browser

Core Imports

import * as WebBrowser from 'expo-web-browser';

For specific imports:

import { 
  openBrowserAsync, 
  openAuthSessionAsync, 
  WebBrowserOpenOptions,
  WebBrowserAuthSessionResult 
} from 'expo-web-browser';

CommonJS:

const WebBrowser = require('expo-web-browser');

Basic Usage

import * as WebBrowser from 'expo-web-browser';

// Open a simple web page
const result = await WebBrowser.openBrowserAsync('https://example.com');

// Open authentication session with redirect handling
const authResult = await WebBrowser.openAuthSessionAsync(
  'https://accounts.google.com/oauth/authorize?...',
  'myapp://redirect'
);

if (authResult.type === 'success') {
  console.log('OAuth success, redirect URL:', authResult.url);
}

Architecture

Expo Web Browser is built around platform-specific browser implementations:

  • iOS Implementation: Uses SFSafariViewController for general browsing and ASWebAuthenticationSession for authentication flows
  • Android Implementation: Uses Chrome Custom Tabs for native-like browser experience with session management capabilities
  • Web Implementation: Uses browser window.open() API with localStorage-based state management for authentication
  • Type System: Full TypeScript integration with comprehensive type definitions for all platforms

Capabilities

Browser Operations

Core browser functionality for opening web pages and managing browser sessions. Perfect for displaying content like privacy policies, terms of service, or general web content.

function openBrowserAsync(
  url: string, 
  browserParams?: WebBrowserOpenOptions
): Promise<WebBrowserResult>;

function dismissBrowser(): Promise<{ type: WebBrowserResultType.DISMISS }>;

Browser Operations

Authentication Sessions

Secure authentication session management with proper redirect handling for OAuth flows. Designed for authentication workflows that require secure token exchange and proper session isolation.

function openAuthSessionAsync(
  url: string,
  redirectUrl?: string | null,
  options?: AuthSessionOpenOptions
): Promise<WebBrowserAuthSessionResult>;

function dismissAuthSession(): void;

function maybeCompleteAuthSession(
  options?: WebBrowserCompleteAuthSessionOptions
): WebBrowserCompleteAuthSessionResult;

Authentication Sessions

Custom Tabs Management

Android-specific Custom Tabs optimization features for improved performance and user experience. These functions provide fine-grained control over Custom Tabs lifecycle.

function getCustomTabsSupportingBrowsersAsync(): Promise<WebBrowserCustomTabsResults>;

function warmUpAsync(browserPackage?: string): Promise<WebBrowserWarmUpResult>;

function mayInitWithUrlAsync(
  url: string, 
  browserPackage?: string
): Promise<WebBrowserMayInitWithUrlResult>;

function coolDownAsync(browserPackage?: string): Promise<WebBrowserCoolDownResult>;

Custom Tabs Management

Core Types

enum WebBrowserResultType {
  CANCEL = 'cancel',
  DISMISS = 'dismiss', 
  OPENED = 'opened',
  LOCKED = 'locked'
}

enum WebBrowserPresentationStyle {
  FULL_SCREEN = 'fullScreen',
  PAGE_SHEET = 'pageSheet',
  FORM_SHEET = 'formSheet',
  CURRENT_CONTEXT = 'currentContext',
  OVER_FULL_SCREEN = 'overFullScreen',
  OVER_CURRENT_CONTEXT = 'overCurrentContext',
  POPOVER = 'popover',
  AUTOMATIC = 'automatic'
}

interface WebBrowserResult {
  type: WebBrowserResultType;
}

interface WebBrowserRedirectResult {
  type: 'success';
  url: string;
}

type WebBrowserAuthSessionResult = WebBrowserRedirectResult | WebBrowserResult;

interface AuthSessionOpenOptions extends WebBrowserOpenOptions {
  preferEphemeralSession?: boolean;
}

interface WebBrowserCompleteAuthSessionOptions {
  skipRedirectCheck?: boolean;
}

interface WebBrowserCompleteAuthSessionResult {
  type: 'success' | 'failed';
  message: string;
}

type WebBrowserWindowFeatures = Record<string, number | boolean | string>;

type RedirectEvent = {
  url: string;
};