Jest throws error when using Drawing Library

[gluengenKmart]

We are attempting to write Jest tests with a map component that is using the google maps api drawing library

<LoadScript googleMapsApiKey={api_key} libraries={['drawing']}>
              ..
</LoadScript>

<GoogleMap
              mapContainerStyle={containerStyle}
              zoom={20}
              center={center}
              options={{ streetViewControl: false, mapTypeControl: false }}
            >
              <Marker position={center} />
              <Polygon
                paths={parseBoundary(centreBoundary?.coordinates).map((pt) => ({ lat: pt[0], lng: pt[1] }))}
                options={storeOptions}
              />
              <Polygon
                paths={parseBoundary(centreBoundary?.coordinates).map((pt) => ({ lat: pt[0], lng: pt[1] }))}
                options={centreOptions}
              />
              <DrawingManager
                onPolygonComplete={onCentrePolygonComplete}
                options={{ drawingControl: false, drawingMode: 'polygon' as OverlayType }}
              />
            </GoogleMap>

but when the component is accessed in the jest test

test('Should show dialog when button is pressed', async () => {
    renderWithClient(<MapPage />);
    const btn = await screen.findByRole('button', { name: /Show Map/i });
    btn.click();
    expect(await screen.findAllByText(/Click on the map/)).toBeTruthy();
  });

it throws the following error:

Invariant Violation: Did you include prop libraries={['drawing']} in the URL? undefined

[stuaylward]

I agree, this library seems to be missing the entire DrawingManager in it's mocks?

[usefulthink]

A feature request to add the drawingLibrary was added as #521. Besides that I don't see anything actionable for us here.

As for the original bug-report, I can't really tell where that error-message is coming from, but it coming from the implementation of the <GoogleMap> component seems reasonable. Unless that is the component you are developing and testing, I would advise to mock the entire component instead of trying to mock the Google Maps API and all it's interactions with the <GoogleMap> component.

The mocks provided here are really only useful if you are testing code that directly interacts with the Google Maps API, in which case there's no real alternative.