Typescript: Property 'permissions' does not exist on type 'Navigator'

[mdwekat]

TypeScript Version:
2.7.2

Search Terms:
Property 'permissions' does not exist on type 'Navigator'

Code

const perm = navigator.permissions;
    perm.query({name: 'geolocation'})
      .then(permissionStatus => {
        console.log('geolocation permission state is ', permissionStatus.state);
        permissionStatus.onchange = () => {
          console.log('geolocation permission state has changed');
        };
      });

Expected behavior:
navigator.permissions should be defined
Actual behavior:
navigator.permissions does not exist.

Playground Link:
https://goo.gl/5ckgwD

Related Issues:

16246

[kitsonk]

The Permissions API is quite in draft status at the moment. It may not make sense to add this, as it is only supported by Chrome-based and Firefox. Adding these yourself should be possible. The API isn't even listed on Edge platform status, and the Chrome status indicates it is just a working draft.

[jwalton]

npm install --save-dev @types/w3c-permissions, for those looking for a work-around.

[saschanaz]

Recently the TS team have merged several draft-status web features into lib.d.ts because future migration to lib.d.ts from DefinitelyTyped packages can be annoying. Read more at https://github.com/Microsoft/TypeScript/issues/18480#issuecomment-341202123 for the previous discussion.

In this case, IMO it can be added to lib.d.ts as the official spec exists and multiple major vendors provide their implementations.

[vargavince91]

We also created types for the permissions API and submitted to DefinitelyTyped repository. We used the MDN Permissions page to add documentation using TSDoc. You can check the examples, if not clear how to use it.

You can check it on npm and install it as dev dependency by:

$ npm install --save-dev @types/navigator-permissions

Feedback is welcome.

Update: it was removed from DefinitelyTyped repository in https://github.com/DefinitelyTyped/DefinitelyTyped/pull/34641 as a separate type definition isn't needed in TypeScript 3.5+. NPM should still work.

[romain-faust]

@vargavince91 very good job !
There is only one thing that I want to point out. As stated here, the revoke descriptor does not accept the same name parameter as the query one does.

Query : 'accelerometer', 'accessibility-events', 'ambient-light-sensor', 'background-sync', 'camera'​, 'clipboard-read', 'clipboard-write', 'geolocation', 'gyroscope', 'magnetometer', 'microphone', 'midi', 'notifications', 'payment-handler', 'persistent-storage', 'push'

Revoke : 'geolocation', 'midi', 'notifications', 'push'

[vargavince91]

Oh thank you for pointing this out, I'm going to submit a merge request today with the fixes

[bennycode]

We also created types for the permissions API and submitted to DefinitelyTyped repository. We used the MDN Permissions page to add documentation using TSDoc.

@vargavince91 Super nice that you wrote types for it! Do you may also have types for navigator.clipboard?

[ProtocolNebula]

I have the same problem, but in some computers (maybe fault of node version) don't recognize the @types, so, additionally to that, I casted to any:

return (navigator as any).permissions.query({
  name: 'geolocation'
}).then((permission) => {
    console.log(permission);
});

[audiolion]

@saschanaz or @sandersn I see that these types were updated in the generator, but I dont see them in master

https://github.com/Microsoft/TypeScript/blob/9509a54e66034c7ae723051a3c79afaa9084046e/lib/lib.dom.d.ts#L10506

am I looking in the wrong place? have they not been released yet?

[sandersn]

@audiolion Take a look in src/lib/dom.generated.d.ts instead. lib/ has the built library files in it, generated by running --LKG if I remember correctly.

[audiolion]

@sandersn sorry for the naïveté, but I dont see src/lib/dom.generated.d.ts in this repo, I see it in the TSJS-lib-generator one, I thought it somehow got translated over here by running the generator? hah. I guess my main issue is that using typescript 3.4.5 (current latest), I cant seem to find those new Navigator.permission types that were merged into the TSJS repo 28 days ago.

[dartess]

for googling: Navigator.permission types in [email protected] works fine