Geolocation permission request is not made correctly

spwoodcock commented 5 months ago

Describe the bug

If geolocation is not enabled by default, normally websites request for permissions to access it:

Then the user grants it

Instead we just get

To Reproduce

Disable geolocation permission default for the browser in android settings.

Expected behavior

The user is promoted for permission.
This is all done with native web APIs, and not hooking into the Android APIs.

Smartphone (please complete the following information):

Device: Pixel 6
OS: Android 13
Browser: Vanadium, privacy enhanced Chromium.

Additional context:

Just in case this was some Google wizardry, hooking into Android APIs, I tested on OpenStreetMap and its the same:

NSUWAL123 commented 5 months ago

@spwoodcock, it seems that for the first time, the browser would ask the user for the location permission where the browser would give 2 options: allow and deny. If the user denies to give location permissions, and the 2nd time if the user again if the user clicks the location button then the browser will give a message: User denied location. This seems to be the default behavior of the browser to respect users' privacy.

I had researched and I think the only option left is to clearly tell user where they can change their location settings to enable location services. Any suggestions?

spwoodcock commented 5 months ago

I am testing on openstreetmap.com:

If I deny the first time, the I get the error you said: User denied location.
I can then click the geolocation icon again and it prompts me again.
If I accept the second time, it works as it should.

This suggests it should be possible!

I will check the openstreetmap code as an example to see if we can do something similar 👍

spwoodcock commented 5 months ago

This is the Leaflet plugin used by OSM: https://github.com/domoritz/leaflet-locatecontrol

And this the code they use:

const oriAbs = "ondeviceorientationabsolute" in window;
if (oriAbs || "ondeviceorientation" in window) {
  const _this = this;
  const deviceorientation = function () {
    L.DomEvent.on(window, oriAbs ? "deviceorientationabsolute" : "deviceorientation", _this._onDeviceOrientation, _this);
  };
  if (DeviceOrientationEvent && typeof DeviceOrientationEvent.requestPermission === "function") {
    DeviceOrientationEvent.requestPermission().then(function (permissionState) {
      if (permissionState === "granted") {
        deviceorientation();
      }
    });
  } else {
    deviceorientation();
  }
}

The license is MIT - we can use the code if needed.

spwoodcock commented 5 months ago

If the user denies permission on a web browser, then this is remembered for subsequent attempts to geolocate. The user must refresh the page to try again. It's normal browser behavior, so it's fine to leave it like that :thumbs

manjitapandey commented 5 months ago

Current status of this issue:

for the first time when user tries to access location, an permission pop-up appears. If the user denies the access, the pop-up showing geolocation permission denied shows when trying to access location feature for other times. The similar behavior was seen with openstreetmap also.

https://github.com/hotosm/fmtm/assets/97273021/2bdb2ab4-34a9-42fa-b6ed-6056a7bf4544

But in case of google maps, when user denies geolocation permission for the first time and try to access location later, a help section banner appears which redirects it to help section and shows how users can manually update permission of different devices.

https://github.com/hotosm/fmtm/assets/97273021/6deb540f-a3b8-4055-8b4f-aa2e6df3868b

We can also follow the similar method to inform user about manually updating the permission.

cc: @spwoodcock , @varun2948 , @NSUWAL123

spwoodcock commented 5 months ago

Different browser behaviours

Interesting! The behaviour is different on Firefox. Chrome seems to remember your selection, but Firefox does not (desktop).

https://github.com/hotosm/fmtm/assets/78538841/23d53e01-6fe3-473f-8496-7dd3e3fdcfbd

Always be sure to test your features on both Chrome and Firefox (and, if possible, Safari would be great too). Playwright can help with this in future though!

Closing this issue

When testing on Android I got the following behaviour:

First prompt for geolocation is denied.
Clicking the button again allows for a second attempt / prompt.
If this is denied again, then it needs to be reset in the device settings (refresh doesn't help either) - the same behaviour you show in the video!

I think the current behaviour is fine in this case.

Related issue

I will close this issue for now & if we encounter any problems in the future we can revisit.

A related issue to this, after recent updates I can't seem to load the dev server at all, unless I delete cache / use incognito. I don't know if this is PWA related, or caching via the Nginx proxy. To be investigated - I may make a new issue about it.

hotosm / fmtm