Typescript: TS2322: Invalid assignment error

[SetTrend]

TypeScript Version: 3.6.2

Search Terms: TS2322 Invalid assignment error

Code

{
    "compilerOptions": {
        "outDir": "dist",
        "allowJs": true,
        "checkJs": true,
        "downlevelIteration": true,
        "emitBOM": true,
        "forceConsistentCasingInFileNames": true,
        "noImplicitAny": true,
        "module": "ESNext",
        "noEmitOnError": true,
        "noUnusedLocals": true,
        "noUnusedParameters": true,
        "preserveConstEnums": true,
        "sourceMap": true,
        "strict": true,
        "target": "es5",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "moduleResolution": "node"
    },
    "include": [
        "./app/",
        "./scripts/"
    ]
}

Expected behavior:

The assignment should be valid, because both sides of the assignment as declared as string | null.

Actual behavior:

TypeScript raises the error message:

TS2322: Type 'string | null' is not assignable to type 'string'. Type 'null' is not assignable to type 'string'.

Playground Link: Sorry, no playground link. I don't know nor do I understand what causes the false behaviour on this particular assignment.

Related Issues: ./.

[nmain]

More information may be needed to reproduce this. What's a StyleBackup?

[jcalz]

Sorry, but I doubt anyone can do much if you don't provide a way for others to reproduce your issue. Images of code are particularly unhelpful. The error implies that the compiler thinks you're trying to assign a string | null value to a string object property. I assume you've already triple-checked that the error is indeed coming from the line you think it's coming from? There's not much more here to go on. 🤷

Consider going through the Stack Overflow steps for producing a minimum reproducible example. Either you will end up with something more usable by others, or you will learn that there is something quirky about your particular environment and you can try to address that. In any case, unless you become reasonably confident that the problem is an actual compiler bug, you should probably post a question on Stack Overflow instead of here. Good luck!

[sandersn]

On 3.6, body.style.overflow no longer has type string | null, but string. See https://github.com/microsoft/TSJS-lib-generator/pull/714, which switched the definition to use the spec instead of a local definition.

You'll need to update StyleBackup to match this.

[SetTrend]

@jcalz : I know all this. But that's all I could provide.

As you can see from the image, the type lib still seems to assume that body.style.overflow is of type string | null (see tooltip in the image). So there was no way of finding or narrowing the reason for this error.

I already changed the assignment to body.style.overflow = bodyBU.overflow || "" as a workaround. Just wanted to drop a note that this error exists.

I'm running TypeScript 3.6.2. Any suggestions why Visual Studio Code still believes that body.style.overflow is of type string | null?

[fatcerberus]

Just a guess here but: Have you selected 3.6.2 for use in VSCode? The current VSCode release is bundled with 3.5.2 which is what it uses for IntelliSense but you can change it - check the TS version in the status bar and click it to use the version installed locally.

[SetTrend]

@fatcerberus 👍 👍 👍

Thanks a lot for pointing me to this setting! After the years I even forgot it existed.

[typescript-bot]

This issue has been marked 'Working as Intended' and has seen no recent activity. It has been automatically closed for house-keeping purposes.