Geometry and drawing
Compare a feature's full geometry, and draw with terra-draw or mapbox-gl-draw through real input.
toHaveGeometry compares the feature's full geometry as the map's source holds it (rendered geometry is tile-clipped)
against a GeoJSON geometry, a vertex list, or { circle: { center, edge } } — in pixels. Where the source cannot give
its data back (a tiled source; a GeoJSON URL source on MapLibre 2–3 and Mapbox GL 1.13), only one drawn piece can be
compared, which a tile border may clip: a match passes, a mismatch is no verdict, so .not.toHaveGeometry does not pass
there. Draw helpers are input choreography, not a binding to one tool: finish and gesture are explicit because
draw tools disagree. Tested against terra-draw and mapbox-gl-draw. Tools with a drag threshold (terra-draw: 8 px)
offset drag-drawn shapes and whole-shape moves by that much — for real users too.
const [a, b, c, d] = [{ lng: 34.825, lat: 32.04 }, { lng: 34.85, lat: 32.04 }, { lng: 34.85, lat: 32.055 }, { lng: 34.825, lat: 32.055 }];await page.getByTestId('draw-polygon').click();// the app's own draw button (terra-draw here)await map.draw.polygon([a, b, c, d], { finish: 'click-first' });// finish gesture is tool-specificconst drawn = map.feature({ layer: 'td-polygon' });await expect(drawn).toHaveGeometry([a, b, c, d], { tolerancePx: 2 });// read from the mapawait page.getByTestId('draw-select').click();await drawn.click();// selected: the tool shows vertex handlesconst c2 = { lng: 34.86, lat: 32.065 };await map.feature({ layer: 'td-point', where: { selectionPoint: true }, at: c }).dragTo(c2);// move a vertexconst mid = { lng: (a.lng + b.lng) / 2, lat: a.lat }, e = { lng: mid.lng, lat: 32.03 };await map.feature({ layer: 'td-point', where: { midPoint: true }, at: mid }).dragTo(e);// insert a vertexawait expect(drawn).toHaveGeometry([a, e, b, c2, d]);await page.getByTestId('draw-circle').click();await map.draw.circle({ lng: 34.72, lat: 32.1 }, { lng: 34.73, lat: 32.1 }, { gesture: 'drag' });await page.getByTestId('draw-polygon').click();await map.draw.polygon([a, b, c], { finish: 'none' });// a shape in progress...await map.draw.cancel();// ...and Escape