[Bug]: `Camera` manipulation not working within `onLongPress`
Open
Nobody has claimed this yet.
- Dominant language
- Kotlin
- Stars
- 2.9k
- Forks
- 947
- Avg merge
- 6d 37m
- Merged PRs (30d)
- 1
Description
Mapbox Implementation
Mapbox
Mapbox Version
default
Platform
iOS, Android
@rnmapbox/maps version
10.0.0-rc.1
Standalone component to reproduce
import MapboxGL, { Camera } from "@rnmapbox/maps";
import React, { useRef } from "react";
import { StyleSheet, View } from "react-native";
const MapView = MapboxGL.MapView;
const Map: React.FC = () => {
const mapCamera = useRef<Camera>(null);
const flyToCoordinates = async (coordinates: GeoJSON.Position) => {
mapCamera.current?.flyTo(coordinates);
};
const onLongPress = (feature: GeoJSON.Feature) => {
const point = feature as GeoJSON.Feature<GeoJSON.Point>;
const coordinates = point.geometry.coordinates;
flyToCoordinates(coordinates);
};
return (
<View style={StyleSheet.absoluteFillObject}>
<MapView onLongPress={onLongPress} style={{ flex: 1 }}>
<Camera
centerCoordinate={[-0.15, 51.51]}
zoomLevel={16}
maxZoomLevel={18}
ref={mapCamera}
/>
</MapView>
</View>
);
};
export default Map;
Observed behavior and steps to reproduce
- Long press with finger on a map
- Map doesn't pan to place where finger was held despite
flyTohaving been called
Expected behavior
Map should pan to the place where user's finger was held.
Notes / preliminary analysis
- This code works if
flyTois called insideonPresscallback. - This affects all
Cameramethods, includingflyTo,panTo,setCamera. - It seems to be caused by
longPressevent firing before user takes their finger off the screen.
Additional links and references
No response
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the standalone React Native reproduction and trace how MapView dispatches onLongPress while Camera methods such as flyTo, panTo, and setCamera are invoked. Compare this with the working onPress path on iOS and Android. Done means camera manipulation works when triggered from onLongPress without disrupting the expected long-press behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native, typescript
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100