File System API Permission Check

Check and request permissions for browser File System API.

Returns true immediately if current permission is granted. Requests permission if not granted. Permission request must be called within a user click event.

async function verifyPermission(handle: FileSystemHandle, readWrite: boolean) {
  const options = {};
  if (readWrite) {
    options.mode = 'readwrite';
  }

  // 1. Check current permission
  if ((await handle.queryPermission(options)) === 'granted') {
    return true;
  }

  // 2. Request permission if not granted
  if ((await handle.requestPermission(options)) === 'granted') {
    return true;
  }

  return false;
}

Where It Pays Off in Practice

This helper is useful when I do not want to repeat the queryPermission to requestPermission flow everywhere. It is especially helpful in UIs that reuse the same handle because the click logic stays smaller when the permission check lives in one place.

The main cautions are that permission requests still depend on a user gesture and that readonly and readwrite flows should not be mixed casually. Pre-checks can happen in the background, but the actual request is safer when it stays inside the click handler.

Practical Note

This snippet fits well when I do not want to rewrite the same operation or check around typescript, browser, file-system-api over and over. Keeping it as a small helper makes the caller easier to read because the intent stays in the foreground.

If the branches and preconditions start growing, it is usually better not to force everything into one snippet. Splitting the steps and helper responsibilities is easier to maintain.