Add Capacitor support

src/create-context.ts

@@ -49,6 +49,7 @@ export async function createContext<T extends Node>(node: T, options?: Options &
       bypassingCache: false,
       ...options?.fetch,
     },
+    fetchFn: null,
     font: {},
     drawImageInterval: 100,
     workerUrl: null,

src/fetch.ts

@@ -45,6 +45,7 @@ export function contextFetch(context: Context, options: ContextFetchOptions) {
     timeout,
     acceptOfImage,
     requests,
+    fetchFn,
     fetch: {
       requestInit,
       bypassingCache,
@@ -82,16 +83,24 @@ export function contextFetch(context: Context, options: ContextFetchOptions) {
       response: null as any,
     }
 
-    request.response = (
-      !IN_SAFARI && rawUrl.startsWith('http') && workers.length
-        ? new Promise((resolve, reject) => {
+    request.response = (async () => {
+      if (fetchFn && requestType === 'image') {
+        const result = await fetchFn(rawUrl)
+
+        if (result) return result
+      }
+
+      if (!IN_SAFARI && rawUrl.startsWith('http') && workers.length) {
+        return new Promise<string>((resolve, reject) => {
           const worker = workers[requests.size & (workers.length - 1)]
           worker.postMessage({ rawUrl, ...baseFetchOptions })
           request!.resolve = resolve
           request!.reject = reject
         })
-        : baseFetch(baseFetchOptions)
-    ).catch(error => {
+      }
+
+      return baseFetch(baseFetchOptions)
+    })().catch(error => {
       requests.delete(rawUrl)
 
       if (requestType === 'image' && placeholderImage) {

src/options.ts

@@ -69,6 +69,23 @@ export interface Options {
    */
   debug?: boolean
 
+  /**
+   * Custom implementation to get image data for a custom URL.
+   * This can be helpful for Capacitor or Cordova when using
+   * native fetch to bypass CORS issues.
+   *
+   * If returns a string, will completely bypass any `Options.fetch`
+   * settings with your custom implementation.
+   *
+   * If returns false, will fall back to normal fetch implementation
+   *
+   * @param url
+   * @returns A data URL for the image
+   */
+  fetchFn?: ((
+    url: string,
+  ) => Promise<string | false>) | null
+
   /**
    * The options of fetch resources.
    */