or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

browser-apis.mdbrowser-window.mdcss-styling.mdcustom-elements.mddom-core.mdevent-system.mdfetch-http.mdform-file.mdhtml-elements.mdindex.mdmedia-av.md
tile.json

fetch-http.mddocs/

Fetch & HTTP

Complete Fetch API implementation for HTTP requests and responses, including headers, request/response bodies, and abort signals. Provides modern HTTP communication capabilities.

Capabilities

Request Class

HTTP request representation.

/**
 * HTTP request representation
 */
class Request {
  constructor(input: string | Request, init?: RequestInit);
  
  /** Request URL */
  readonly url: string;
  
  /** HTTP method */
  readonly method: string;
  
  /** Request headers */
  readonly headers: Headers;
  
  /** Request body */
  readonly body: ReadableStream | null;
  
  /** Body used flag */
  readonly bodyUsed: boolean;
  
  /** Request cache mode */
  readonly cache: RequestCache;
  
  /** Request credentials */
  readonly credentials: RequestCredentials;
  
  /** Request destination */
  readonly destination: RequestDestination;
  
  /** Request integrity */
  readonly integrity: string;
  
  /** Request mode */
  readonly mode: RequestMode;
  
  /** Request redirect */
  readonly redirect: RequestRedirect;
  
  /** Request referrer */
  readonly referrer: string;
  
  /** Request referrer policy */
  readonly referrerPolicy: ReferrerPolicy;
  
  /** Request signal */
  readonly signal: AbortSignal;
  
  /** Clone request */
  clone(): Request;
  
  /** Get array buffer */
  arrayBuffer(): Promise<ArrayBuffer>;
  
  /** Get blob */
  blob(): Promise<Blob>;
  
  /** Get form data */
  formData(): Promise<FormData>;
  
  /** Get JSON */
  json(): Promise<any>;
  
  /** Get text */
  text(): Promise<string>;
}

interface RequestInit {
  method?: string;
  headers?: HeadersInit;
  body?: BodyInit | null;
  cache?: RequestCache;
  credentials?: RequestCredentials;
  integrity?: string;
  mode?: RequestMode;
  redirect?: RequestRedirect;
  referrer?: string;
  referrerPolicy?: ReferrerPolicy;
  signal?: AbortSignal | null;
}

type RequestCache = 'default' | 'no-store' | 'reload' | 'no-cache' | 'force-cache' | 'only-if-cached';
type RequestCredentials = 'omit' | 'same-origin' | 'include';
type RequestMode = 'cors' | 'no-cors' | 'same-origin' | 'navigate';
type RequestRedirect = 'follow' | 'error' | 'manual';

Response Class

HTTP response representation.

/**
 * HTTP response representation
 */
class Response {
  constructor(body?: BodyInit | null, init?: ResponseInit);
  
  /** Response headers */
  readonly headers: Headers;
  
  /** Response body */
  readonly body: ReadableStream | null;
  
  /** Body used flag */
  readonly bodyUsed: boolean;
  
  /** Response OK flag */
  readonly ok: boolean;
  
  /** Response redirected flag */
  readonly redirected: boolean;
  
  /** Response status */
  readonly status: number;
  
  /** Response status text */
  readonly statusText: string;
  
  /** Response type */
  readonly type: ResponseType;
  
  /** Response URL */
  readonly url: string;
  
  /** Clone response */
  clone(): Response;
  
  /** Get array buffer */
  arrayBuffer(): Promise<ArrayBuffer>;
  
  /** Get blob */
  blob(): Promise<Blob>;
  
  /** Get form data */
  formData(): Promise<FormData>;
  
  /** Get JSON */
  json(): Promise<any>;
  
  /** Get text */
  text(): Promise<string>;
  
  /** Create error response */
  static error(): Response;
  
  /** Create redirect response */
  static redirect(url: string, status?: number): Response;
}

interface ResponseInit {
  status?: number;
  statusText?: string;
  headers?: HeadersInit;
}

type ResponseType = 'basic' | 'cors' | 'default' | 'error' | 'opaque' | 'opaqueredirect';

Headers Class

HTTP headers management.

/**
 * HTTP headers management
 */
class Headers {
  constructor(init?: HeadersInit);
  
  /** Append value to header */
  append(name: string, value: string): void;
  
  /** Delete header */
  delete(name: string): void;
  
  /** Get header value */
  get(name: string): string | null;
  
  /** Check if header exists */
  has(name: string): boolean;
  
  /** Set header value */
  set(name: string, value: string): void;
  
  /** Iterate over headers */
  forEach(callback: (value: string, key: string, headers: Headers) => void): void;
  
  /** Get header names */
  keys(): IterableIterator<string>;
  
  /** Get header values */
  values(): IterableIterator<string>;
  
  /** Get header entries */
  entries(): IterableIterator<[string, string]>;
}

type HeadersInit = string[][] | Record<string, string> | Headers;

Abort Controller

Request abortion control.

/**
 * Request abortion control
 */
class AbortController {
  /** Abort signal */
  readonly signal: AbortSignal;
  
  /** Abort request */
  abort(reason?: any): void;
}

/**
 * Abort signal for request cancellation
 */
class AbortSignal extends EventTarget {
  /** Aborted flag */
  readonly aborted: boolean;
  
  /** Abort reason */
  readonly reason: any;
  
  /** Throw if aborted */
  throwIfAborted(): void;
  
  /** Create aborted signal */
  static abort(reason?: any): AbortSignal;
  
  /** Create timeout signal */
  static timeout(delay: number): AbortSignal;
  
  /** Any signal */
  static any(signals: AbortSignal[]): AbortSignal;
}

Fetch Function

Global fetch function for making HTTP requests.

/**
 * Global fetch function for making HTTP requests
 */
function fetch(input: string | Request, init?: RequestInit): Promise<Response>;

Usage Examples

Basic HTTP Requests

import { fetch, Request, Response } from "happy-dom";

// Simple GET request
const response = await fetch('https://api.example.com/data');
const data = await response.json();

// POST request with JSON data
const postResponse = await fetch('https://api.example.com/users', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    name: 'John Doe',
    email: 'john@example.com'
  })
});

if (postResponse.ok) {
  const user = await postResponse.json();
  console.log('Created user:', user);
}

Request Abortion

import { fetch, AbortController } from "happy-dom";

// Create abort controller
const controller = new AbortController();

// Make request with abort signal
const promise = fetch('https://api.example.com/slow-endpoint', {
  signal: controller.signal
});

// Abort after 5 seconds
setTimeout(() => {
  controller.abort('Request timeout');
}, 5000);

try {
  const response = await promise;
  console.log('Response received:', response.status);
} catch (error) {
  if (error.name === 'AbortError') {
    console.log('Request was aborted');
  }
}

Custom Headers

import { Headers, fetch } from "happy-dom";

// Create custom headers
const headers = new Headers();
headers.set('Authorization', 'Bearer token123');
headers.set('Accept', 'application/json');
headers.append('X-Custom-Header', 'value1');
headers.append('X-Custom-Header', 'value2');

// Use in request
const response = await fetch('https://api.example.com/protected', {
  method: 'GET',
  headers: headers
});

// Access response headers
console.log('Content-Type:', response.headers.get('content-type'));
console.log('All headers:');
response.headers.forEach((value, key) => {
  console.log(`${key}: ${value}`);
});