makeplane/plane · error · Error

Invalid URL format

Error message

Invalid URL format

What it means

Second guard in getBase64Image: after confirming url is a non-empty string, the code runs `new URL(url)` to validate the URL syntax. If the constructor throws (malformed URL, missing scheme, invalid characters), this error is raised. Note relative URLs and schemeless hosts will also fail under `new URL`.

Source

Thrown at packages/utils/src/file.ts:49

  const assetUrl = sourcePaths[sourcePaths.length - 1];
  return assetUrl;
};

/**
 * @description encode image via URL to base64
 * @param {string} url
 * @returns
 */
export const getBase64Image = async (url: string): Promise<string> => {
  if (!url || typeof url !== "string") {
    throw new Error("Invalid URL provided");
  }

  // Try to create a URL object to validate the URL
  try {
    new URL(url);
  } catch {
    throw new Error("Invalid URL format");
  }

  const response = await fetch(url);
  // check if the response is OK
  if (!response.ok) {
    throw new Error(`Failed to fetch image: ${response.statusText}`);
  }

  const blob = await response.blob();
  return new Promise((resolve, reject) => {
    const reader = new FileReader();

    reader.onloadend = () => {
      if (reader.result) {
        resolve(reader.result as string);
      } else {
        reject(new Error("Failed to convert image to base64."));
      }

View on GitHub (pinned to 1c8a60f858)

Solutions

1. Ensure the value is an absolute URL with scheme (https://...).
2. If you have a relative path, resolve it against a base: `new URL(relative, window.location.origin).toString()`.
3. Prepend 'https://' if the caller commonly omits the scheme.

Example fix

// before
await getBase64Image(maybeRelative);

// after
const abs = /^https?:\/\//.test(maybeRelative)
  ? maybeRelative
  : new URL(maybeRelative, window.location.origin).toString();
await getBase64Image(abs);

function toAbsoluteUrl(u: string): string | null {
  try { return new URL(u).toString(); } catch { try { return new URL(u, location.origin).toString(); } catch { return null; } }
}

function isAbsoluteUrl(u: string): boolean { try { new URL(u); return true; } catch { return false; } }

try { await getBase64Image(url); } catch (e) { if (/Invalid URL format/.test((e as Error).message)) { url = toAbsoluteUrl(url) ?? DEFAULT; } else throw e; }

When it happens

Trigger: getBase64Image('/avatar.png') (relative), getBase64Image('example.com/x.png') (no scheme), getBase64Image('ht!tp://x'), or any string the WHATWG URL parser rejects.

Common situations: Passing a relative path that works in <img src> but not in new URL; missing https: prefix; copy-pasted URL with stray characters; data: URLs (valid for new URL but downstream fetch may differ).

Related errors

• Invalid URL provided
• Failed to fetch image: ${response.statusText}
• Invalid schema. Only HTTP and HTTPS are allowed.
• Missing required fields.
• Invalid file type. Please select an image.

AI-assisted analysis of makeplane/plane@1c8a60f858 (2026-08-12). Data as JSON: /api/errors/a203aa934bd62af7. Report an issue: GitHub.