Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

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);
});
like image 679
GiVeR Avatar asked Oct 03 '12 06:10

GiVeR


People also ask

How do you access the properties of objects in TypeScript?

To dynamically access an object's property: Use keyof typeof obj as the type of the dynamic key, e.g. type ObjectKey = keyof typeof obj; . Use bracket notation to access the object's property, e.g. obj[myVar] .

How do you pass an object as a parameter in TypeScript?

Inside the function we assign the parameters to properties in the object. To do this, we have to specify the this keyword, which refers to the calling object. The variables and parameters may have the same names. Anything we pass to the constructor as an argument, will be assigned to the property of the object.

How do I add a property in TypeScript?

To add a property to an object in TypeScript, set the property as optional on the interface you assign to the object using a question mark. You can then add the property at a later point in time without getting a type error. Copied!

How do I create a new object in TypeScript?

Syntax. var object_name = { key1: “value1”, //scalar value key2: “value”, key3: function() { //functions }, key4:[“content1”, “content2”] //collection }; As shown above, an object can contain scalar values, functions and structures like arrays and tuples.


2 Answers

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)

like image 165
Jack128 Avatar answered Oct 05 '22 04:10

Jack128


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

like image 25
rt2800 Avatar answered Oct 05 '22 04:10

rt2800