NonNullable behaves differently when passing a property type from `this`

[shilangyu]

TypeScript Version: 3.7.2

Search Terms:
NonNullable this this[] this property nonnullable
Code

type SomeType = string | undefined

class Test {
    prop: SomeType

    func1 = (): this['prop'] => {
        return this.prop
    }

    func2 = (): SomeType => {
        return this.prop
    }

    func3 = (): NonNullable<this['prop']> => {
        return this.prop!
    }

    func4 = (): NonNullable<SomeType> => {
        return this.prop!
    }
}

Expected behavior:

This code compiles correctly, this['prop'] and SomeType point to the same type.

Actual behavior:

func3 is not happy with the return statement: Type 'string' is not assignable to type 'NonNullable<this["prop"]>'.

Playground Link: link

Related Issues: none

[AnyhowStep]

Workaround,

type SomeType = string | undefined

class Test {
    prop: SomeType

    func3 = (): NonNullable<this['prop']> => {
        const tmp: this["prop"] = this.prop;
        return tmp!
    }

}

Playground

[RyanCavanaugh]

@weswigham can you link to the proper duplicate please

[shilangyu]

Tried v3.8, still seems to not work. I also tried to find the duplicate issue but I couldn't (probably a broader topic)

[weswigham]

There's another similar issue to this one to do with this and NonNullable<this> not being compatible, but in this case the issue is that when we do a property access on this, we actually get the constraint of the access (so we report the "current" type rather than this["prop"]), which, when NonNullable'd, then produces a (less precise) result.

#26942 is a dupe with a slightly inaccurate answer (even adding a cast is not sufficient, because of what I described above).

[JoniJnm]

Works since 4.8

https://www.typescriptlang.org/docs/handbook/release-notes/typescript-4-8.html#improved-intersection-reduction-union-compatibility-and-narrowing

#49119