react-native-webgpu 0.10.4 → 0.11.0

package/Package.swift

@@ -30,14 +30,29 @@ let sibling = { (relative: String) -> String in
 // after changing either package's Dawn version reset the package caches
 // (File > Packages > Reset Package Caches) if this does not re-run.
 let dawnReleaseTag = "dawn-chrome-m154"
-let skiaCandidates = [
-  sibling("../@shopify/react-native-skia"), // consumer: sibling in node_modules
-  sibling("../../node_modules/@shopify/react-native-skia"), // this monorepo
-]
-for skia in skiaCandidates {
-  // Only Graphite builds of react-native-skia write this marker (Ganesh
-  // builds do not link Dawn and impose no constraint).
-  guard let data = FileManager.default.contents(atPath: "\(skia)/libs/.dawn-version"),
+// Only Graphite builds of react-native-skia carry this marker (Ganesh builds
+// do not link Dawn and impose no constraint). From v3 the Skia binaries ship
+// in react-native-skia-graphite-apple-ios, which records the tag at
+// libs/.dawn-version; react-native-skia's podspec copies it into its own
+// libs/ at `pod install`, which never runs here. The v2 Graphite previews
+// (e.g. @shopify/react-native-skia@2.12.0-next.1) keep it in their own libs/.
+// The graphite packages are normally hoisted next to this package, but may
+// be nested under react-native-skia when the package manager cannot hoist
+// them. Every marker found is checked.
+let skiaDawnMarkers = [
+  "react-native-skia-graphite-apple-ios/libs/.dawn-version",
+  "react-native-skia-graphite-apple-macos/libs/.dawn-version",
+  "react-native-skia/node_modules/react-native-skia-graphite-apple-ios/libs/.dawn-version",
+  "react-native-skia/node_modules/react-native-skia-graphite-apple-macos/libs/.dawn-version",
+  "@shopify/react-native-skia/libs/.dawn-version",
+].flatMap { marker in
+  [
+    sibling("../\(marker)"), // consumer: sibling in node_modules
+    sibling("../../node_modules/\(marker)"), // this monorepo
+  ]
+}
+for marker in skiaDawnMarkers {
+  guard let data = FileManager.default.contents(atPath: marker),
     let skiaDawn = String(data: data, encoding: .utf8)?
       .trimmingCharacters(in: .whitespacesAndNewlines)
   else { continue }
@@ -45,11 +60,10 @@ for skia in skiaCandidates {
     fatalError(
       """
       react-native-webgpu: Dawn version mismatch. This package links \(dawnReleaseTag) \
-      but the @shopify/react-native-skia Graphite build at \(skia) links \(skiaDawn). \
+      but the react-native-skia Graphite binaries (\(marker)) link \(skiaDawn). \
       Align the two packages so the app contains exactly one Dawn.
       """)
   }
-  break
 }
 
 // Unlike a native Xcode target, SwiftPM doesn't generate an implicit

package/android/cpp/AndroidPlatformContext.h

@@ -21,9 +21,19 @@ namespace rnwgpu {
 namespace jsi = facebook::jsi;
 namespace jni = facebook::jni;
 
+// The completion callbacks of one snapshotView request, heap-allocated and
+// carried through Java as an opaque pointer (WebGPUModule.snapshotView ->
+// onViewSnapshot), which hands them back exactly once.
+struct ViewSnapshotCallbacks {
+  std::function<void(ImageData)> onSuccess;
+  std::function<void(std::string)> onError;
+};
+
 class AndroidPlatformContext : public PlatformContext {
 private:
   jobject _blobModule;
+  // Global ref to the com.webgpu.WebGPUModule instance (view snapshots).
+  jobject _module;
 
   std::vector<uint8_t> resolveBlob(JNIEnv *env, const std::string &blobId,
                                    double offset, double size) {
@@ -63,14 +73,61 @@ private:
   }
 
 public:
-  explicit AndroidPlatformContext(jobject blobModule)
-      : _blobModule(blobModule) {}
+  // Both arguments are global refs; the context releases them.
+  AndroidPlatformContext(jobject blobModule, jobject module)
+      : _blobModule(blobModule), _module(module) {}
   ~AndroidPlatformContext() {
+    JNIEnv *env = facebook::jni::Environment::current();
     if (_blobModule) {
-      JNIEnv *env = facebook::jni::Environment::current();
       env->DeleteGlobalRef(_blobModule);
       _blobModule = nullptr;
     }
+    if (_module) {
+      env->DeleteGlobalRef(_module);
+      _module = nullptr;
+    }
+  }
+
+  void snapshotView(const ViewSnapshotRequest &request,
+                    std::function<void(ImageData)> onSuccess,
+                    std::function<void(std::string)> onError) override {
+    if (!_module) {
+      onError("drawElementImageToTexture: the WebGPU module is gone");
+      return;
+    }
+    jni::Environment::ensureCurrentThreadIsAttached();
+    JNIEnv *env = facebook::jni::Environment::current();
+    if (!env) {
+      onError("drawElementImageToTexture: couldn't get the JNI environment");
+      return;
+    }
+    jclass moduleClass = env->GetObjectClass(_module);
+    jmethodID method =
+        env->GetMethodID(moduleClass, "snapshotView", "(IDDDDIIJ)V");
+    env->DeleteLocalRef(moduleClass);
+    if (!method) {
+      env->ExceptionClear();
+      onError("drawElementImageToTexture: WebGPUModule.snapshotView not found");
+      return;
+    }
+    // Ownership passes to Java; Java_com_webgpu_WebGPUModule_onViewSnapshot
+    // (cpp-adapter.cpp) reclaims it.
+    auto *callbacks = new ViewSnapshotCallbacks{std::move(onSuccess),
+                                                std::move(onError)};
+    env->CallVoidMethod(_module, method, static_cast<jint>(request.viewTag),
+                        static_cast<jdouble>(request.sourceX),
+                        static_cast<jdouble>(request.sourceY),
+                        static_cast<jdouble>(request.sourceWidth),
+                        static_cast<jdouble>(request.sourceHeight),
+                        static_cast<jint>(request.width),
+                        static_cast<jint>(request.height),
+                        reinterpret_cast<jlong>(callbacks));
+    if (env->ExceptionCheck()) {
+      env->ExceptionClear();
+      auto fail = std::move(callbacks->onError);
+      delete callbacks;
+      fail("drawElementImageToTexture: WebGPUModule.snapshotView threw");
+    }
   }
 
   wgpu::Surface makeSurface(wgpu::Instance instance, void *window, int width,

package/android/cpp/cpp-adapter.cpp

@@ -1,11 +1,15 @@
+#include <cstring>
 #include <memory>
+#include <string>
 #include <unordered_map>
+#include <utility>
 
 #include <fbjni/fbjni.h>
 #include <jni.h>
 #include <jsi/jsi.h>
 
 #include <ReactCommon/CallInvokerHolder.h>
+#include <android/bitmap.h>
 #include <android/hardware_buffer_jni.h>
 #include <android/native_window_jni.h>
 #include <webgpu/webgpu_cpp.h>
@@ -19,21 +23,77 @@
 std::shared_ptr<rnwgpu::RNWebGPUManager> manager;
 
 extern "C" JNIEXPORT void JNICALL Java_com_webgpu_WebGPUModule_initializeNative(
-    JNIEnv *env, jobject /* this */, jlong jsRuntime,
-    jobject jsCallInvokerHolder, jobject blobModule) {
+    JNIEnv *env, jobject thiz, jlong jsRuntime, jobject jsCallInvokerHolder,
+    jobject blobModule) {
   auto runtime = reinterpret_cast<facebook::jsi::Runtime *>(jsRuntime);
   jobject globalBlobModule = env->NewGlobalRef(blobModule);
+  jobject globalModule = env->NewGlobalRef(thiz);
   auto jsCallInvoker{
       facebook::jni::alias_ref<facebook::react::CallInvokerHolder::javaobject>{
           reinterpret_cast<facebook::react::CallInvokerHolder::javaobject>(
-              jsCallInvokerHolder)} -> cthis()
-          ->getCallInvoker()};
-  auto platformContext =
-      std::make_shared<rnwgpu::AndroidPlatformContext>(globalBlobModule);
+              jsCallInvokerHolder)} -> cthis()->getCallInvoker()};
+  auto platformContext = std::make_shared<rnwgpu::AndroidPlatformContext>(
+      globalBlobModule, globalModule);
   manager = std::make_shared<rnwgpu::RNWebGPUManager>(runtime, jsCallInvoker,
                                                       platformContext);
 }
 
+// Completion of WebGPUModule.snapshotView (UI thread). Reclaims the callbacks
+// handed to Java and delivers either the bitmap's pixels or the error.
+extern "C" JNIEXPORT void JNICALL Java_com_webgpu_WebGPUModule_onViewSnapshot(
+    JNIEnv *env, jobject /* this */, jlong callbackPointer, jobject bitmap,
+    jstring error) {
+  std::unique_ptr<rnwgpu::ViewSnapshotCallbacks> callbacks(
+      reinterpret_cast<rnwgpu::ViewSnapshotCallbacks *>(callbackPointer));
+  if (!callbacks) {
+    return;
+  }
+  if (error != nullptr) {
+    const char *chars = env->GetStringUTFChars(error, nullptr);
+    std::string message(chars ? chars : "drawElementImageToTexture failed");
+    if (chars) {
+      env->ReleaseStringUTFChars(error, chars);
+    }
+    callbacks->onError(std::move(message));
+    return;
+  }
+  if (bitmap == nullptr) {
+    callbacks->onError("drawElementImageToTexture: no bitmap was produced");
+    return;
+  }
+  AndroidBitmapInfo info;
+  if (AndroidBitmap_getInfo(env, bitmap, &info) !=
+          ANDROID_BITMAP_RESULT_SUCCESS ||
+      info.format != ANDROID_BITMAP_FORMAT_RGBA_8888) {
+    callbacks->onError(
+        "drawElementImageToTexture: unexpected snapshot bitmap format");
+    return;
+  }
+  void *pixels = nullptr;
+  if (AndroidBitmap_lockPixels(env, bitmap, &pixels) !=
+          ANDROID_BITMAP_RESULT_SUCCESS ||
+      pixels == nullptr) {
+    callbacks->onError(
+        "drawElementImageToTexture: couldn't lock the snapshot bitmap");
+    return;
+  }
+  rnwgpu::ImageData image;
+  image.width = info.width;
+  image.height = info.height;
+  image.format = wgpu::TextureFormat::RGBA8Unorm;
+  // Bitmap.Config.ARGB_8888 stores premultiplied RGBA bytes.
+  image.premultiplied = true;
+  const size_t rowBytes = static_cast<size_t>(info.width) * 4;
+  image.data.resize(rowBytes * info.height);
+  const auto *src = static_cast<const uint8_t *>(pixels);
+  for (uint32_t row = 0; row < info.height; ++row) {
+    std::memcpy(image.data.data() + row * rowBytes, src + row * info.stride,
+                rowBytes);
+  }
+  AndroidBitmap_unlockPixels(env, bitmap);
+  callbacks->onSuccess(std::move(image));
+}
+
 extern "C" JNIEXPORT void JNICALL Java_com_webgpu_WebGPUView_onSurfaceChanged(
     JNIEnv *env, jobject thiz, jobject surface, jint contextId, jfloat width,
     jfloat height) {

package/android/src/main/java/com/webgpu/ViewSnapshot.java

@@ -0,0 +1,162 @@
+package com.webgpu;
+
+import android.graphics.Bitmap;
+import android.graphics.Canvas;
+import android.graphics.ColorSpace;
+import android.graphics.HardwareRenderer;
+import android.graphics.PixelFormat;
+import android.graphics.RecordingCanvas;
+import android.graphics.RenderNode;
+import android.hardware.HardwareBuffer;
+import android.media.Image;
+import android.media.ImageReader;
+import android.os.Build;
+import android.util.Log;
+import android.view.View;
+
+import androidx.annotation.NonNull;
+import androidx.annotation.RequiresApi;
+
+/**
+ * Rasterizes a native view for GPUQueue.drawElementImageToTexture. Must be
+ * called on the UI thread.
+ *
+ * On API 29+ the view is rendered through {@link HardwareRenderer}: the
+ * recording reuses the children's existing display lists, so the result is
+ * exactly what the window's own renderer draws (shadows, hardware layers,
+ * TextureView content). Older devices, or a failed hardware render, fall back
+ * to drawing the view into a software canvas, which misses anything that is
+ * only drawn hardware-accelerated. SurfaceView content is composed outside
+ * the view hierarchy and is captured by neither path.
+ */
+final class ViewSnapshot {
+  private static final String TAG = "WebGPUViewSnapshot";
+
+  private ViewSnapshot() {}
+
+  /**
+   * @param sourceX/Y/Width/Height the source rectangle in the view's own
+   *     coordinate space, in pixels (already scaled by the display density)
+   * @param width/height the output size in pixels
+   * @return a software ARGB_8888 (premultiplied) bitmap of exactly
+   *     width x height pixels
+   */
+  @NonNull
+  static Bitmap snapshot(
+      @NonNull View view,
+      float sourceX,
+      float sourceY,
+      float sourceWidth,
+      float sourceHeight,
+      int width,
+      int height) {
+    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q && view.isHardwareAccelerated()) {
+      try {
+        return snapshotHardware(view, sourceX, sourceY, sourceWidth, sourceHeight, width, height);
+      } catch (Throwable t) {
+        Log.w(TAG, "HardwareRenderer snapshot failed, falling back to software rendering", t);
+      }
+    }
+    return snapshotSoftware(view, sourceX, sourceY, sourceWidth, sourceHeight, width, height);
+  }
+
+  @NonNull
+  private static Bitmap snapshotSoftware(
+      @NonNull View view,
+      float sourceX,
+      float sourceY,
+      float sourceWidth,
+      float sourceHeight,
+      int width,
+      int height) {
+    Bitmap bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
+    Canvas canvas = new Canvas(bitmap);
+    canvas.scale(width / sourceWidth, height / sourceHeight);
+    canvas.translate(-sourceX, -sourceY);
+    view.draw(canvas);
+    return bitmap;
+  }
+
+  @RequiresApi(Build.VERSION_CODES.Q)
+  @NonNull
+  private static Bitmap snapshotHardware(
+      @NonNull View view,
+      float sourceX,
+      float sourceY,
+      float sourceWidth,
+      float sourceHeight,
+      int width,
+      int height) {
+    // The renderer draws into an ImageReader whose buffers are GPU-sampleable
+    // (a later zero-copy path can import them directly); for now the frame is
+    // read back into a software bitmap.
+    ImageReader reader =
+        ImageReader.newInstance(
+            width,
+            height,
+            PixelFormat.RGBA_8888,
+            1,
+            HardwareBuffer.USAGE_GPU_SAMPLED_IMAGE | HardwareBuffer.USAGE_GPU_COLOR_OUTPUT);
+    HardwareRenderer renderer = new HardwareRenderer();
+    Image image = null;
+    try {
+      renderer.setSurface(reader.getSurface());
+      // Match the framework's default light so elevation shadows come out
+      // like on screen (ThreadedRenderer reads these from the theme; the
+      // Material defaults are used here).
+      float density = view.getResources().getDisplayMetrics().density;
+      renderer.setLightSourceGeometry(
+          width / 2f, -400f * density, 500f * density, 800f * density);
+      renderer.setLightSourceAlpha(0.039f, 0.19f);
+
+      RenderNode root = new RenderNode("rnwgpu-view-snapshot");
+      root.setPosition(0, 0, width, height);
+      RecordingCanvas canvas = root.beginRecording(width, height);
+      try {
+        canvas.scale(width / sourceWidth, height / sourceHeight);
+        canvas.translate(-sourceX, -sourceY);
+        view.draw(canvas);
+      } finally {
+        root.endRecording();
+      }
+      renderer.setContentRoot(root);
+
+      HardwareRenderer.FrameRenderRequest request = renderer.createRenderRequest();
+      request.setWaitForPresent(true);
+      int status = request.syncAndDraw();
+      int failed =
+          HardwareRenderer.SYNC_LOST_SURFACE_REWARD_IF_FOUND
+              | HardwareRenderer.SYNC_CONTEXT_IS_STOPPED
+              | HardwareRenderer.SYNC_FRAME_DROPPED;
+      if ((status & failed) != 0) {
+        throw new IllegalStateException("HardwareRenderer.syncAndDraw failed with status " + status);
+      }
+      image = reader.acquireNextImage();
+      if (image == null) {
+        throw new IllegalStateException("HardwareRenderer produced no image");
+      }
+      HardwareBuffer buffer = image.getHardwareBuffer();
+      if (buffer == null) {
+        throw new IllegalStateException("HardwareRenderer image has no HardwareBuffer");
+      }
+      Bitmap hardware =
+          Bitmap.wrapHardwareBuffer(buffer, ColorSpace.get(ColorSpace.Named.SRGB));
+      buffer.close();
+      if (hardware == null) {
+        throw new IllegalStateException("Bitmap.wrapHardwareBuffer failed");
+      }
+      Bitmap software = hardware.copy(Bitmap.Config.ARGB_8888, false);
+      hardware.recycle();
+      if (software == null) {
+        throw new IllegalStateException("could not read back the hardware bitmap");
+      }
+      return software;
+    } finally {
+      if (image != null) {
+        image.close();
+      }
+      renderer.destroy();
+      reader.close();
+    }
+  }
+}

package/android/src/main/java/com/webgpu/WebGPUModule.java

@@ -1,6 +1,8 @@
 package com.webgpu;
 
+import android.graphics.Bitmap;
 import android.util.Log;
+import android.view.View;
 
 import androidx.annotation.OptIn;
 
@@ -11,7 +13,10 @@ import com.facebook.proguard.annotations.DoNotStrip;
 import com.facebook.react.bridge.ReactApplicationContext;
 import com.facebook.react.bridge.JavaScriptContextHolder;
 import com.facebook.react.bridge.ReactMethod;
+import com.facebook.react.bridge.UIManager;
+import com.facebook.react.bridge.UiThreadUtil;
 import com.facebook.react.common.annotations.FrameworkAPI;
+import com.facebook.react.uimanager.UIManagerHelper;
 import com.facebook.react.module.annotations.ReactModule;
 import com.facebook.react.modules.blob.BlobModule;
 import com.facebook.react.modules.blob.BlobProvider;
@@ -47,4 +52,67 @@ public class WebGPUModule extends NativeWebGPUModuleSpec {
   @OptIn(markerClass = FrameworkAPI.class)
   @DoNotStrip
   private native void initializeNative(long jsRuntime, CallInvokerHolderImpl jsInvoker, BlobModule blobModule);
+
+  /**
+   * Called from C++ (AndroidPlatformContext::snapshotView) on an arbitrary
+   * thread for GPUQueue.drawElementImageToTexture. Hops to the UI thread,
+   * resolves the view for {@code tag}, rasterizes the requested rectangle and
+   * always reports back through {@link #onViewSnapshot}, with either a bitmap
+   * or an error message. {@code callback} is an opaque native pointer that
+   * must be handed back exactly once.
+   *
+   * The source rectangle is in density-independent points (React Native
+   * layout units) and is converted to pixels here; a non-positive
+   * sourceWidth/sourceHeight means the whole view. A zero width/height means
+   * the natural pixel size of the source rectangle.
+   */
+  @DoNotStrip
+  void snapshotView(
+      final int tag,
+      final double sourceX,
+      final double sourceY,
+      final double sourceWidth,
+      final double sourceHeight,
+      final int width,
+      final int height,
+      final long callback) {
+    UiThreadUtil.runOnUiThread(
+        () -> {
+          Bitmap bitmap = null;
+          String error = null;
+          try {
+            ReactApplicationContext context = getReactApplicationContext();
+            UIManager uiManager = UIManagerHelper.getUIManagerForReactTag(context, tag);
+            View view = uiManager == null ? null : uiManager.resolveView(tag);
+            if (view == null) {
+              throw new IllegalArgumentException(
+                  "drawElementImageToTexture: no native view found for tag "
+                      + tag
+                      + " (is the view mounted, and rendered with collapsable={false}?)");
+            }
+            if (view.getWidth() <= 0 || view.getHeight() <= 0) {
+              throw new IllegalStateException(
+                  "drawElementImageToTexture: the view has no size yet");
+            }
+            float density = view.getResources().getDisplayMetrics().density;
+            float sx = (float) (sourceX * density);
+            float sy = (float) (sourceY * density);
+            float sw = sourceWidth > 0 ? (float) (sourceWidth * density) : view.getWidth();
+            float sh = sourceHeight > 0 ? (float) (sourceHeight * density) : view.getHeight();
+            int w = width > 0 ? width : Math.round(sw);
+            int h = height > 0 ? height : Math.round(sh);
+            if (w <= 0 || h <= 0) {
+              throw new IllegalArgumentException(
+                  "drawElementImageToTexture: the source rectangle is empty");
+            }
+            bitmap = ViewSnapshot.snapshot(view, sx, sy, sw, sh, w, h);
+          } catch (Throwable t) {
+            error = t.getMessage() != null ? t.getMessage() : t.toString();
+          }
+          onViewSnapshot(callback, bitmap, error);
+        });
+  }
+
+  @DoNotStrip
+  private native void onViewSnapshot(long callback, Bitmap bitmap, String error);
 }

package/apple/ApplePlatformContext.h

@@ -1,15 +1,25 @@
 #pragma once
 
 #include "PlatformContext.h"
+#include <functional>
 #include <string>
 
 namespace rnwgpu {
 
 class ApplePlatformContext : public PlatformContext {
 public:
-  ApplePlatformContext();
+  // Resolves a React tag to its native view (an unretained
+  // UIView* / NSView* bridged to void*, or nullptr). Called on the main thread
+  // only. Provided by WebGPUModule from React Native's view registry.
+  using ViewLookup = std::function<void *(int)>;
+
+  explicit ApplePlatformContext(ViewLookup viewLookup = nullptr);
   ~ApplePlatformContext() = default;
 
+  void snapshotView(const ViewSnapshotRequest &request,
+                    std::function<void(ImageData)> onSuccess,
+                    std::function<void(std::string)> onError) override;
+
   wgpu::Surface makeSurface(wgpu::Instance instance, void *surface, int width,
                             int height) override;
 
@@ -39,6 +49,9 @@ public:
   std::string writeTestVideoFile() override;
 
   VideoFrameHandle wrapNativeBuffer(void *pointer) override;
+
+private:
+  ViewLookup _viewLookup;
 };
 
 } // namespace rnwgpu