[Bug]: unable to interact with symbolLayer using a test end2end framework (Detox)
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
React Native Version
0.76.7
React Native Architecture
Old Architecture (Paper/bridge)
Platform
iOS, Android
@rnmapbox/maps version
10.1.35
Standalone component to reproduce
import React from 'react';
import Mapbox from '@rnmapbox/maps';
type Props = {
clusters: any[];
markerStyle: any;
clusterStyle: any;
onPressMarkerCluster: (e: any) => void;
};
export default function ClusteredMarkers({
clusters,
markerStyle,
clusterStyle,
onPressMarkerCluster,
}: Props) {
return (
<Mapbox.ShapeSource
id="hotels"
shape={{
type: 'FeatureCollection',
features: clusters,
}}
onPress={onPressMarkerCluster}
>
<Mapbox.SymbolLayer
id="marker"
filter={['!', ['has', 'point_count']]}
style={markerStyle}
/>
<Mapbox.SymbolLayer
id="cluster"
filter={['has', 'point_count']}
style={clusterStyle}
/>
</Mapbox.ShapeSource>
);
}
We are encountering a significant blocker when attempting to write End-to-End (E2E) tests for features involving map interactions using Detox.
It is currently impossible to interact with markers rendered by the <Mapbox.SymbolLayer /> component.
Observed behavior and steps to reproduce
-
Inability to set testID: The <Mapbox.SymbolLayer /> component does not accept standard React Native UI properties like testID or accessibilityLabel.
-
No Text or Label Exposure: The text properties or names associated with the GeoJSON features used in the layer are not translated into accessible labels, making text-based targeting (e.g., by.text('My Marker Name')) also impossible.
Consequently, when running a Detox test, any attempt to select a symbol results in a "View not found" error.
Expected behavior
We require a mechanism to assign and expose a unique identifier to the symbols rendered by the SymbolLayer so that E2E tools can interact with them.
For example, we would expect a solution that allows:
-
Targeting by feature property: Using a property from the GeoJSON feature (e.g., properties.id) as the testID for the symbol.
-
Interaction: Tapping, long-pressing, or querying the visible state of the symbol.
Is there a documented way to achieve E2E testability for SymbolLayer symbols that we may have missed?
Notes / preliminary analysis
No response
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 ClusteredMarkers example and reproduce the missing SymbolLayer target in Detox on iOS and Android. Trace the SymbolLayer and ShapeSource APIs and their identifier or accessibility handling; done means a feature-derived identifier can be queried and used for tap, long-press, and visible-state assertions.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native
- Domain
- mobile, testing-qa
- Issue type
- Bug
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100