Typescript Intellisense and the Interface

Given: An interface definition like this:

export interface InjectDetails {
        /**
         * Optional.
         * If allFrames is true, implies that the JavaScript or CSS should be injected into all frames of current page. By default, it's false and is only injected into the top frame.
         */
        allFrames?: boolean;
        /**
         * Optional. JavaScript or CSS code to inject.
         * Warning: Be careful using the code parameter. Incorrect use of it may open your extension to cross site scripting attacks.
         */
        code?: string;
        /**
         * Optional. The soonest that the JavaScript or CSS will be injected into the tab.
         * One of: "document_start", "document_end", or "document_idle"
         * @since Chrome 20.
         */
        runAt?: string;
        /** Optional. JavaScript or CSS file to inject. */
        file?: string;
...

We make a declaration to use it as shown here:

let details
  :chrome.tabs.InjectDetails

We find; however, that this code doesn't work.

details.code = "";

Just hovering over the name 'details' shows the error.

It tells us to assign a value before using.

let details
 :chrome.tabs.InjectDetails 
    = {}
details.code="";

If we hover over "details" now, we see all the property definitions.

Intellisense is the single best way to learn an API, as we code! It also support the JSDOC shown above.

Typescript Intellisense Reference

JWP2021 Intellisense and the Interface