How to handle warnings for proprietary/custom properties of built-in objects in TypeScript

60,812

Solution 1

1) You can reinterpret navigator prop.

(<any>navigator).id.request();

2) You can declare id prop youself

mycompany.lib.d.ts

interface Navigator {
  id: any
}

app.ts

navigator.id.request();

see this video http://channel9.msdn.com/posts/Anders-Hejlsberg-Introducing-TypeScript/ There Anders tell as jQuery.UI add new methods to jQuery (see 46 min)

Solution 2

Add checks like if(navigator.id != null && typeof navigator.id != 'undefined') before stmt where navigator.id is referred

Share:
60,812
GiVeR
Author by

GiVeR

Updated on October 03, 2020

Comments

  • GiVeR
    GiVeR over 3 years

    I am using Personas which relies on the proprietary property navigator.id. Since this property is not standard, the TypeScript compiler generates the following warning:

    $ tsc home.ts --out my_ts_generated_code.js
    /Users/..../home.ts(27,18): The property 'id' does not exist on value of type 'Navigator'
    

    But the .js file is successfully generated and runs on the FF15 browser without any warning/error message.
    I also include a polyfill for navigator.id, as instructed by the documentation, so navigator.id will definitely by available in every browser.

    Could someone suggest me how to deal with this warning?

    index.html

    <!-- some HTML omit above -->
    <script src="https://login.persona.org/include.js"></script>
    <script src="my_ts_generated_code.js"></script>
    <button class="btn" id="signin">Sign in</button>
    <button class="btn" id="signout">Sign out</button>
    <!-- some HTML omit below -->
    

    home.ts

    declare var $;
    
    class Student {
        fullname : string;
        constructor(public firstname, public middleinitial, public lastname) {
            this.fullname = firstname + " " + middleinitial + " " + lastname;
        }
    }
    
    interface Person {
        firstname: string;
        lastname: string;
    }
    
    function greeter(person : Person) {
        return "Hello, " + person.firstname + " " + person.lastname;
    }
    
    var user = new Student("Jane", "M.", "User");
    
    $(function() {
        $('#signin').on('click', function(e) {
            e.preventDefault();
            navigator.id.request();
        });
    
        $('#signout').on('click', function(e) {
            e.preventDefault();
            navigator.id.logout();
        });
        //document.body.innerHTML = greeter(user);
    });