@repliqo/sdk-react-native 0.3.6 → 0.3.8

package/src/core/client.ts

@@ -12,7 +12,7 @@ import { Logger } from './logger';
 import { ApiClient } from '../transport/api.client';
 import { BatchQueue } from '../transport/batch-queue';
 import { ErrorTracker } from '../trackers/error.tracker';
-import { captureNativeFrame, scanFullContent } from '../snapshot/NativeScreenCapture';
+import { captureNativeFrame } from '../snapshot/NativeScreenCapture';
 
 export class AppAnalytics {
   private static instance: AppAnalytics | null = null;
@@ -446,14 +446,21 @@ export class AppAnalytics {
    * Capture the current viewport as a tile for collaborative screen
    * building. Called by RepliqoScrollView on scroll stops.
    *
-   * The tile includes the scrollOffsetY so the backend knows where
-   * in the full content this viewport belongs. Multiple users/sessions
-   * contribute tiles until the full content is covered.
+   * The tile includes:
+   *  - `scrollOffsetY`: where in the full content this viewport belongs
+   *  - `viewportTop`: Y position (window logical px) of the ScrollView's
+   *    top edge. Used by the backend to crop each tile to just the
+   *    scrollable area, removing fixed headers/footers that would
+   *    otherwise duplicate in the composite.
+   *  - `windowHeight`: window height in logical px, for image-to-logical
+   *    scale computation during backend cropping.
    */
   captureScrollTile(
     scrollOffsetY: number,
     viewportHeight: number,
     contentHeight: number,
+    viewportTop?: number,
+    windowHeight?: number,
   ): void {
     if (!this.sessionId || !this.currentScreen) return;
     if (viewportHeight <= 0) return; // No real dimensions yet
@@ -470,6 +477,7 @@ export class AppAnalytics {
         this.logger.log(
           `Scroll tile: "${screenName}" Y=${Math.round(scrollOffsetY)} ` +
             `vp=${Math.round(viewportHeight)} content=${Math.round(contentHeight)} ` +
+            `top=${viewportTop !== undefined ? Math.round(viewportTop) : '?'} ` +
             `${Math.round(frame.image.length / 1024)}KB`,
         );
 
@@ -482,6 +490,8 @@ export class AppAnalytics {
           scrollOffsetY,
           viewportHeight,
           contentHeight,
+          viewportTop,
+          windowHeight,
         );
       } catch (err) {
         this.logger.warn('Scroll tile failed:', err);
@@ -489,48 +499,6 @@ export class AppAnalytics {
     })();
   }
 
-  /**
-   * Programmatically scroll-scan the current ScrollView and upload all
-   * tiles to the backend. Invisible to the user (~300-500ms).
-   */
-  private autoScanScreen(screenName: string): void {
-    (async () => {
-      try {
-        const tiles = await scanFullContent();
-        if (!tiles || tiles.length === 0) {
-          this.logger.log(`Auto-scan: no ScrollView found for "${screenName}"`);
-          return;
-        }
-
-        this.logger.log(
-          `Auto-scan: "${screenName}" captured ${tiles.length} tiles ` +
-            `(content=${tiles[0].contentHeight}px)`,
-        );
-
-        // Upload all tiles in parallel
-        const sessionId = this.sessionId!;
-        await Promise.all(
-          tiles.map((tile) =>
-            this.apiClient.uploadScreenTile(
-              sessionId,
-              screenName,
-              tile.image,
-              tile.width,
-              tile.height,
-              tile.scrollOffsetY,
-              tile.viewportHeight,
-              tile.contentHeight,
-            ).catch(() => {}),
-          ),
-        );
-
-        this.logger.log(`Auto-scan: "${screenName}" tiles uploaded`);
-      } catch (err) {
-        this.logger.warn('Auto-scan failed:', err);
-      }
-    })();
-  }
-
   onScreenEnter(screenName: string): void {
     this.currentScreen = screenName;
     this.currentScreenEnteredAt = new Date().toISOString();
@@ -539,14 +507,12 @@ export class AppAnalytics {
     this.scrollViewRegistry.clear();
     this.errorTracker?.setCurrentScreen(screenName);
     this.snapshotCapture?.setCurrentScreen(screenName);
-    // NOTE: autoScanScreen (PixelCopy / programmatic scroll) is DISABLED.
-    // React Native does NOT render off-screen content to the GPU or view
-    // tree, so programmatic scroll + View.draw()/PixelCopy produces blank
-    // tiles. Worse, those blank tiles poison the dedup cache and block
-    // real tiles captured during natural user scroll.
-    //
-    // Full-content capture relies entirely on RepliqoScrollView capturing
-    // viewport tiles as the user naturally scrolls through the content.
+    // NOTE: full-content capture is NOT done via programmatic scroll +
+    // native capture. React Native does NOT render off-screen content to
+    // the GPU or view tree, so any programmatic-scroll approach produces
+    // blank tiles. Full-content heatmap backgrounds are built entirely
+    // from viewport tiles captured by RepliqoScrollView as the user
+    // naturally scrolls through the content.
 
     this.logger.log('Screen entered:', screenName);
   }

package/src/index.ts

@@ -19,9 +19,7 @@ export { captureScreenshot } from './snapshot/captureScreenshot';
 export {
   isNativeScreenCaptureAvailable,
   captureNativeFrame,
-  captureFullContent,
 } from './snapshot/NativeScreenCapture';
-export type { FullContentResult } from './snapshot/NativeScreenCapture';
 
 // Types
 export type {

package/src/snapshot/NativeScreenCapture.ts

@@ -14,24 +14,8 @@ interface NativeCaptureResult {
   format: string;
 }
 
-interface NativeFullContentResult extends NativeCaptureResult {
-  isFullContent: boolean;
-}
-
-interface NativeTile {
-  image: string;
-  width: number;
-  height: number;
-  scrollOffsetY: number;
-  viewportHeight: number;
-  contentHeight: number;
-  format: string;
-}
-
 interface NativeScreenCaptureModule {
   captureFrame(): Promise<NativeCaptureResult | null>;
-  captureFullContent(): Promise<NativeFullContentResult | null>;
-  scanFullContent(): Promise<NativeTile[] | null>;
   isAvailable(): Promise<boolean>;
 }
 
@@ -51,6 +35,12 @@ export function isNativeScreenCaptureAvailable(): boolean {
  *
  * No permissions required. No dialog. No foreground service.
  *
+ * This is the ONLY native capture path. Full-content capture of
+ * off-screen ScrollView content is NOT possible natively (React Native
+ * doesn't render off-screen content to the GPU/view tree) — full-content
+ * heatmap backgrounds are instead built collaboratively from viewport
+ * tiles captured as the user naturally scrolls (see RepliqoScrollView).
+ *
  * @returns NativeFrameResult or null if capture failed / not available
  */
 export async function captureNativeFrame(): Promise<NativeFrameResult | null> {
@@ -70,88 +60,3 @@ export async function captureNativeFrame(): Promise<NativeFrameResult | null> {
     return null;
   }
 }
-
-/**
- * Capture the FULL content of the primary ScrollView on screen,
- * including content scrolled off-screen. Used for heatmap backgrounds.
- *
- * Falls back to a viewport capture if no ScrollView is found.
- * Max height: 5000px. JPEG quality: 60%. Width: ~500px.
- *
- * @returns NativeFrameResult or null if capture failed / not available
- */
-export interface FullContentResult extends NativeFrameResult {
-  /** True if the capture includes full scrollable content. False if viewport-only fallback. */
-  isFullContent: boolean;
-}
-
-/**
- * Capture the FULL content of the primary ScrollView on screen,
- * including content scrolled off-screen. Used for heatmap backgrounds.
- *
- * Falls back to a viewport capture if no ScrollView is found.
- * Max height: 5000px. JPEG quality: 60%. Width: ~500px.
- *
- * Known limitation: FlatList/SectionList use RecyclerView which only
- * renders visible items — full-content capture falls back to viewport.
- *
- * @returns FullContentResult with isFullContent flag, or null
- */
-export async function captureFullContent(): Promise<FullContentResult | null> {
-  if (!NativeModule) return null;
-
-  try {
-    const result = await NativeModule.captureFullContent();
-    if (!result || !result.image) return null;
-
-    return {
-      image: result.image,
-      width: result.width,
-      height: result.height,
-      format: 'jpeg',
-      isFullContent: !!result.isFullContent,
-    };
-  } catch {
-    return null;
-  }
-}
-
-export interface ScanTile {
-  image: string;
-  width: number;
-  height: number;
-  scrollOffsetY: number;
-  viewportHeight: number;
-  contentHeight: number;
-}
-
-/**
- * Perform a fast programmatic scroll-scan of the main ScrollView.
- * Captures the entire content as viewport tiles in ~300-500ms.
- *
- * The scan is invisible to the user — scroll position is saved and
- * restored. Returns an array of tiles covering the full content.
- *
- * @returns Array of tiles, or null if no ScrollView or not available
- */
-export async function scanFullContent(): Promise<ScanTile[] | null> {
-  if (!NativeModule) return null;
-
-  try {
-    const tiles = await NativeModule.scanFullContent();
-    if (!tiles || !Array.isArray(tiles) || tiles.length === 0) return null;
-
-    return tiles
-      .filter((t) => t && t.image)
-      .map((t) => ({
-        image: t.image,
-        width: t.width,
-        height: t.height,
-        scrollOffsetY: t.scrollOffsetY,
-        viewportHeight: t.viewportHeight,
-        contentHeight: t.contentHeight,
-      }));
-  } catch {
-    return null;
-  }
-}

package/src/transport/api.client.ts

@@ -229,6 +229,13 @@ export class ApiClient {
    */
   /**
    * Upload a scroll tile for collaborative screen building.
+   *
+   * @param viewportTop Y position (window logical px) of the ScrollView's
+   *   top edge. Used by the backend to crop each tile to just the
+   *   scrollable area, removing fixed headers/footers that would
+   *   otherwise duplicate in the composite.
+   * @param windowHeight Window height (logical px) at capture time.
+   *   Used by the backend to compute image-to-logical scale for cropping.
    */
   async uploadScreenTile(
     sessionId: string,
@@ -239,23 +246,33 @@ export class ApiClient {
     scrollOffsetY: number,
     viewportHeight: number,
     contentHeight: number,
+    viewportTop?: number,
+    windowHeight?: number,
   ): Promise<void> {
     try {
+      const body: Record<string, unknown> = {
+        sessionId,
+        screenName,
+        image,
+        width,
+        height,
+        scrollOffsetY: Math.round(scrollOffsetY),
+        viewportHeight: Math.round(viewportHeight),
+        contentHeight: Math.round(contentHeight),
+      };
+      if (typeof viewportTop === 'number' && Number.isFinite(viewportTop)) {
+        body.viewportTop = Math.round(viewportTop);
+      }
+      if (typeof windowHeight === 'number' && Number.isFinite(windowHeight)) {
+        body.windowHeight = Math.round(windowHeight);
+      }
+
       const response = await fetch(
         `${this.baseUrl}/api/screen-tiles`,
         {
           method: 'POST',
           headers: this.getHeaders(),
-          body: JSON.stringify({
-            sessionId,
-            screenName,
-            image,
-            width,
-            height,
-            scrollOffsetY: Math.round(scrollOffsetY),
-            viewportHeight: Math.round(viewportHeight),
-            contentHeight: Math.round(contentHeight),
-          }),
+          body: JSON.stringify(body),
         },
       );
 

package/android/src/main/java/com/repliqo/screencapture/FullContentCapture.java

@@ -1,273 +0,0 @@
-package com.repliqo.screencapture;
-
-import android.app.Activity;
-import android.graphics.Bitmap;
-import android.graphics.Canvas;
-import android.util.Base64;
-import android.util.Log;
-import android.view.View;
-import android.view.ViewGroup;
-import android.widget.ScrollView;
-
-import java.io.ByteArrayOutputStream;
-import java.lang.reflect.Field;
-import java.util.ArrayList;
-
-/**
- * Captures the FULL content of the primary vertical ScrollView found in
- * the app's view hierarchy — including content scrolled off-screen.
- *
- * Used for heatmap backgrounds where we need the complete screen layout,
- * not just the visible viewport.
- *
- * Supports:
- *  - Android ScrollView
- *  - AndroidX NestedScrollView
- *  - React Native ReactScrollView (old arch)
- *  - React Native ReactScrollViewManager (Fabric / new arch)
- *
- * Known limitation: FlatList / SectionList use RecyclerView which only
- * renders visible items. Full-content capture is not possible for those.
- * The method falls back to a viewport capture in that case.
- *
- * No permissions needed. Runs on UI thread.
- */
-public class FullContentCapture {
-    private static final String TAG = "RepliqoCapture";
-    private static final int TARGET_WIDTH = 500;
-    private static final int JPEG_QUALITY = 60;
-    private static final int MAX_HEIGHT = 5000;
-
-    /** Result that includes whether this is a full-content or viewport capture. */
-    public static class FullCaptureResult {
-        public final String image;
-        public final int width;
-        public final int height;
-        public final boolean isFullContent;
-
-        FullCaptureResult(String image, int width, int height, boolean isFullContent) {
-            this.image = image;
-            this.width = width;
-            this.height = height;
-            this.isFullContent = isFullContent;
-        }
-    }
-
-    /**
-     * Capture the full content of the primary vertical ScrollView.
-     * Falls back to viewport capture if no suitable ScrollView is found.
-     *
-     * @param activity Current activity
-     * @return FullCaptureResult with isFullContent flag
-     */
-    public static FullCaptureResult capture(Activity activity) {
-        if (activity == null || activity.isFinishing()) return null;
-
-        try {
-            // Find the primary vertical ScrollView
-            View scrollView = findVerticalScrollView(activity);
-            if (scrollView == null) {
-                Log.d(TAG, "No vertical ScrollView found, falling back to viewport");
-                return viewportFallback(activity);
-            }
-
-            // Get the content child
-            View contentView = getContentChild(scrollView);
-            if (contentView == null) {
-                return viewportFallback(activity);
-            }
-
-            int contentWidth = contentView.getWidth();
-            int contentHeight = contentView.getHeight();
-
-            if (contentWidth <= 0 || contentHeight <= 0) {
-                return viewportFallback(activity);
-            }
-
-            // If content height is same as viewport, it's not scrollable
-            int viewportHeight = scrollView.getHeight();
-            if (contentHeight <= viewportHeight) {
-                Log.d(TAG, "Content fits in viewport, no scroll needed");
-                return viewportFallback(activity);
-            }
-
-            // Cap height to avoid OOM
-            int captureHeight = Math.min(contentHeight, MAX_HEIGHT);
-
-            // Scale to output dimensions
-            float scale = (float) TARGET_WIDTH / contentWidth;
-            int outWidth = TARGET_WIDTH & ~1;
-            int outHeight = Math.round(captureHeight * scale) & ~1;
-
-            if (outWidth <= 0 || outHeight <= 0) {
-                return viewportFallback(activity);
-            }
-
-            // Force the content view to measure and layout at its full
-            // height. React Native's ScrollView optimization may skip
-            // laying out off-screen children, causing draw() to only
-            // render the visible portion. This forces a full layout pass.
-            int widthSpec = View.MeasureSpec.makeMeasureSpec(
-                    contentWidth, View.MeasureSpec.EXACTLY);
-            int heightSpec = View.MeasureSpec.makeMeasureSpec(
-                    captureHeight, View.MeasureSpec.EXACTLY);
-            contentView.measure(widthSpec, heightSpec);
-            contentView.layout(0, 0, contentWidth, captureHeight);
-
-            // Create bitmap — wrapped in OOM catch
-            Bitmap bitmap;
-            try {
-                bitmap = Bitmap.createBitmap(outWidth, outHeight,
-                        Bitmap.Config.ARGB_8888);
-            } catch (OutOfMemoryError oom) {
-                Log.w(TAG, "OOM creating bitmap " + outWidth + "x" + outHeight +
-                        ", falling back to viewport");
-                return viewportFallback(activity);
-            }
-
-            Canvas canvas = new Canvas(bitmap);
-            canvas.scale(scale, scale);
-
-            // Draw the full content
-            contentView.draw(canvas);
-
-            // Restore the original layout so the UI isn't affected.
-            // requestLayout triggers an async re-layout on the next frame.
-            contentView.requestLayout();
-
-            // Compress to JPEG
-            ByteArrayOutputStream baos = new ByteArrayOutputStream();
-            bitmap.compress(Bitmap.CompressFormat.JPEG, JPEG_QUALITY, baos);
-            String base64 = Base64.encodeToString(baos.toByteArray(), Base64.NO_WRAP);
-            bitmap.recycle();
-
-            Log.d(TAG, "Full content captured: " + outWidth + "x" + outHeight +
-                    " (content: " + contentWidth + "x" + contentHeight +
-                    ", viewport: " + contentWidth + "x" + viewportHeight + ")");
-
-            return new FullCaptureResult(base64, outWidth, outHeight, true);
-
-        } catch (Exception e) {
-            Log.w(TAG, "FullContentCapture failed: " + e.getMessage());
-            return viewportFallback(activity);
-        }
-    }
-
-    /**
-     * Fallback: capture just the visible viewport via MultiWindowCapture.
-     */
-    private static FullCaptureResult viewportFallback(Activity activity) {
-        MultiWindowCapture.CaptureResult vp = MultiWindowCapture.capture(activity);
-        if (vp == null) return null;
-        return new FullCaptureResult(vp.image, vp.width, vp.height, false);
-    }
-
-    /**
-     * Find the first VERTICAL ScrollView in the view hierarchy.
-     * Searches all root views (including modals).
-     *
-     * Matches by walking the class hierarchy for known scroll classes:
-     *  - android.widget.ScrollView
-     *  - androidx.core.widget.NestedScrollView
-     *  - com.facebook.react.views.scroll.ReactScrollView (old arch)
-     *  - Any class with "ScrollView" in the name (catches Fabric variants)
-     *
-     * Explicitly SKIPS HorizontalScrollView and classes containing
-     * "Horizontal" to avoid capturing carousels.
-     */
-    private static View findVerticalScrollView(Activity activity) {
-        View decorView = activity.getWindow().getDecorView();
-        View found = findVerticalScrollInTree(decorView);
-        if (found != null) return found;
-
-        // Check other windows (modals)
-        try {
-            Class<?> wmgClass = Class.forName("android.view.WindowManagerGlobal");
-            Object wmg = wmgClass.getMethod("getInstance").invoke(null);
-            Field viewsField = wmgClass.getDeclaredField("mViews");
-            viewsField.setAccessible(true);
-            @SuppressWarnings("unchecked")
-            ArrayList<View> views = (ArrayList<View>) viewsField.get(wmg);
-            if (views != null) {
-                for (View root : views) {
-                    if (root == decorView) continue;
-                    found = findVerticalScrollInTree(root);
-                    if (found != null) return found;
-                }
-            }
-        } catch (Exception e) {
-            // Reflection failed
-        }
-
-        return null;
-    }
-
-    /**
-     * DFS for a vertical scroll view in the tree.
-     */
-    private static View findVerticalScrollInTree(View view) {
-        if (view == null) return null;
-
-        if (isVerticalScrollView(view)) {
-            if (view instanceof ViewGroup && ((ViewGroup) view).getChildCount() > 0) {
-                return view;
-            }
-        }
-
-        if (view instanceof ViewGroup) {
-            ViewGroup group = (ViewGroup) view;
-            for (int i = 0; i < group.getChildCount(); i++) {
-                View found = findVerticalScrollInTree(group.getChildAt(i));
-                if (found != null) return found;
-            }
-        }
-
-        return null;
-    }
-
-    /**
-     * Check if a view is a vertical scroll view.
-     * Walks the class hierarchy to catch subclasses.
-     */
-    private static boolean isVerticalScrollView(View view) {
-        // Direct instanceof for standard Android ScrollView
-        if (view instanceof ScrollView) return true;
-
-        // Walk class hierarchy for name-based matching
-        Class<?> clazz = view.getClass();
-        while (clazz != null && clazz != View.class) {
-            String name = clazz.getName();
-
-            // Skip horizontal variants
-            if (name.contains("Horizontal")) return false;
-
-            // Match known vertical scroll classes:
-            // - androidx.core.widget.NestedScrollView
-            // - com.facebook.react.views.scroll.ReactScrollView (old arch)
-            // - com.facebook.react.views.scroll.ReactScrollViewManager$... (Fabric)
-            // - Any other class ending in "ScrollView" that isn't horizontal
-            if (name.contains("NestedScrollView") ||
-                name.contains("ReactScrollView") ||
-                (name.endsWith("ScrollView") && !name.contains("Horizontal"))) {
-                return true;
-            }
-
-            clazz = clazz.getSuperclass();
-        }
-
-        return false;
-    }
-
-    /**
-     * Get the content child of a ScrollView.
-     */
-    private static View getContentChild(View scrollView) {
-        if (scrollView instanceof ViewGroup) {
-            ViewGroup group = (ViewGroup) scrollView;
-            if (group.getChildCount() > 0) {
-                return group.getChildAt(0);
-            }
-        }
-        return null;
-    }
-}