javascript 36 lines · 6 steps

Polling a job until it finishes in JavaScript

An async loop that repeatedly checks a job's status, with timeout and cancellation support.

Explained by highlit

Intermediate polling async-await abortsignal timeout error-handling

1async function pollJobUntilComplete(jobId, { interval = 2000, timeout = 60000, signal } = {}) {
const deadline = Date.now() + timeout;
3 
while (true) {
  const res = await fetch(`/api/jobs/${jobId}`, { signal });
  if (!res.ok) {
    throw new Error(`Failed to fetch job ${jobId}: ${res.status}`);
  }
9 
  const job = await res.json();
11 
  switch (job.status) {
    case 'completed':
      return job.result;
    case 'failed':
      throw new Error(job.error || `Job ${jobId} failed`);
    case 'pending':
    case 'running':
      break;
    default:
      throw new Error(`Unexpected status for job ${jobId}: ${job.status}`);
  }
23 
  if (Date.now() + interval >= deadline) {
    throw new Error(`Timed out waiting for job ${jobId} after ${timeout}ms`);
  }
27 
  await new Promise((resolve, reject) => {
    const timer = setTimeout(resolve, interval);
    signal?.addEventListener('abort', () => {
      clearTimeout(timer);
      reject(new DOMException('Polling aborted', 'AbortError'));
    }, { once: true });
  });
}
36}

01 / 01

STEP 01

Walkthrough

Space play ←→ step click any line

Three takeaways

1A while-true loop with await turns repeated network checks into readable sequential code.
2Threading an AbortSignal through both fetch and the delay makes the whole poll cancellable.
3Checking the deadline before sleeping avoids one pointless final wait past the timeout.

Related explainers

rust

use serde::Deserialize;
 
#[derive(Debug, Deserialize)]
#[serde(untagged)]

Parsing flexible JSON shapes with serde

deserialization enums json

Intermediate 6 steps

ruby

require "shellwords"
require "open3"
 
module Backup

Building safe shell commands in Ruby

shell-out subprocess command-injection

Intermediate 7 steps

javascript

function evaluate(expression) {
  const tokens = tokenize(expression);
  let pos = 0;

Building a recursive descent calculator

parsing recursion operator-precedence

Intermediate 8 steps

javascript

import { useState, useEffect, useCallback, useRef } from 'react';
 
const cache = new Map();
const inflight = new Map();

Building a stale-while-revalidate hook in React

caching request-deduplication custom-hooks

Advanced 10 steps

rust

use chrono::{Duration, NaiveDate};
 
#[derive(Debug)]
pub struct DateRange {

Parsing and iterating date ranges in Rust

error-handling iterators parsing

Intermediate 7 steps

javascript

import { useEffect, useRef, useState } from 'react';
 
export function useDelayedFlag(active, delay = 300) {
  const [visible, setVisible] = useState(false);