Incompatible between browser.tabs.query and browser.tabs.update

Hi! I have this code:

import { browser } from 'webextension-polyfill-ts';

async function fn() {
    const tabs = await browser.tabs.query({});
    browser.tabs.update(tabs[0].id, {active: true});
}

And ts shows error on tabs[0].id:

TS2345: Argument of type ‘number | undefined’ is not assignable to parameter of type ‘number’.   Type ‘undefined’ is not assignable to type ‘number’.

is it intended or a bug?

[Lusito]

Sure. I’m sure you know, that in TypeScript, optional parameters may not be followed by non-optional parameters:

function a(b: string, c?: string) {} // Valid
function a(b?: string, c: string) {} // Invalid

The previous approach to solve this was like this: If a function has non-optional parameters following optional parameters, do:

1. Get the first non-optional parameter.
2. remove the optional flag from the first non-optional parameter, and generate the code for this modified function (a recursive call, i.e. it might again do this trick)
3. Remove the parameter altogether and generate the code for this modified function (again recursively)

Example:

function a(b?: string, c: string) {} // Source
function a(b: string, c: string) {} // Generated
function a(c: string) {} // Generated

The new approach does the same thing, but instead of removing the optional flag, it sets an internal overloadFlag. If this is set, then the parameter doesn’t match when looking for the first optional parameter that is followed by a non-optional parameter. That way, the optional flag stays in the parameter and I use it later to add the “| undefined” instead of the “?”.

Example:

function a(b?: string, c: string) {} // Source
function a(b: string | undefined, c: string) {} // Generated
function a(c: string) {} // Generated

The commit for this was: https://github.com/Lusito/webextension-polyfill-ts/commit/cf4f93db834e49ee485453769675f4282b66b1c5

[Lusito]

@vitalets I’ve released a new version, which fixes the issue.