@onekeyfe/react-native-pager-view 6.7.0-alpha.414 → 6.7.0-alpha.415

package/lib/module/WebCollapsiblePagerPage.js

@@ -148,7 +148,12 @@ export function WebCollapsiblePagerPage({
     owner.addEventListener("keydown", handleKey);
     owner.addEventListener("ok-collapsible-pager-user-scroll", handleUserInput);
     owner.addEventListener("ok-collapsible-pager-insets-changed", requestMeasure);
-    requestMeasure();
+    // Measure synchronously while still inside the layout phase: the metrics
+    // start at width 0, and deferring this first measurement to the next
+    // animation frame let the page paint once at width 0, which collapsed
+    // shrinkable page content (a fiat hero wrapped one character per line,
+    // OK-66299). Resize and scroll updates stay frame-coalesced.
+    measure();
     return () => {
       observer.disconnect();
       observerRef.current = null;
@@ -162,7 +167,7 @@ export function WebCollapsiblePagerPage({
       if (frameRef.current !== null) cancelAnimationFrame(frameRef.current);
       frameRef.current = null;
     };
-  }, [owner, requestMeasure, syncContentObservation]);
+  }, [owner, measure, requestMeasure, syncContentObservation]);
   React.useLayoutEffect(requestMeasure, [isFocused, isRouteActive, headerHeight, stickyHeaderHeight, requestMeasure]);
   const value = React.useMemo(() => ({
     isFocused,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onekeyfe/react-native-pager-view",
-  "version": "6.7.0-alpha.414",
+  "version": "6.7.0-alpha.415",
   "description": "React Native wrapper for Android and iOS ViewPager",
   "source": "./src/index.tsx",
   "main": "./lib/module/index.js",
@@ -43,7 +43,8 @@
     "prepare": "rm -rf lib && bob build",
     "typecheck": "tsc -b",
     "lint": "eslint \"**/*.{js,ts,tsx}\"",
-    "release": "yarn prepare && npm whoami && npm publish --access public"
+    "release": "yarn prepare && npm whoami && npm publish --access public",
+    "test": "jest"
   },
   "keywords": [
     "react-native",
@@ -73,7 +74,7 @@
     "typescript": "^5.9.2"
   },
   "peerDependencies": {
-    "@onekeyfe/react-native-native-logger": "6.7.0-alpha.414",
+    "@onekeyfe/react-native-native-logger": "6.7.0-alpha.415",
     "react": "*",
     "react-native": "*"
   },
@@ -110,5 +111,16 @@
       }
     }
   },
-  "react-native": "./lib/module/index.native.js"
+  "react-native": "./lib/module/index.native.js",
+  "jest": {
+    "preset": "react-native",
+    "modulePathIgnorePatterns": [
+      "<rootDir>/example/node_modules",
+      "<rootDir>/lib/"
+    ],
+    "watchman": false,
+    "testMatch": [
+      "<rootDir>/src/**/__tests__/*.test.ts?(x)"
+    ]
+  }
 }

package/src/WebCollapsiblePagerPage.tsx

@@ -221,7 +221,12 @@ export function WebCollapsiblePagerPage({
     owner.addEventListener("keydown", handleKey);
     owner.addEventListener("ok-collapsible-pager-user-scroll", handleUserInput);
     owner.addEventListener("ok-collapsible-pager-insets-changed", requestMeasure);
-    requestMeasure();
+    // Measure synchronously while still inside the layout phase: the metrics
+    // start at width 0, and deferring this first measurement to the next
+    // animation frame let the page paint once at width 0, which collapsed
+    // shrinkable page content (a fiat hero wrapped one character per line,
+    // OK-66299). Resize and scroll updates stay frame-coalesced.
+    measure();
     return () => {
       observer.disconnect();
       observerRef.current = null;
@@ -235,7 +240,7 @@ export function WebCollapsiblePagerPage({
       if (frameRef.current !== null) cancelAnimationFrame(frameRef.current);
       frameRef.current = null;
     };
-  }, [owner, requestMeasure, syncContentObservation]);
+  }, [owner, measure, requestMeasure, syncContentObservation]);
 
   React.useLayoutEffect(requestMeasure, [isFocused, isRouteActive, headerHeight, stickyHeaderHeight, requestMeasure]);