Object is possibly 'undefined'.ts(2532)
Published: 2022-07-08 08:00:44

Let me tell you now, there is no solution, but there is a method of deal with the error.

Microsoft team member for Typescript said in a related trend that [_"This is working as intended"_](https://github.com/microsoft/TypeScript/issues/16928).

Many developers are talking about this from different use cases as arrays, function callbacks, string values, html elements inside a React components (my case), and the list grows and grows...

I could found suggested solution that it doesn't worked, as background is that _"The type system would effectively have to make a distinction between empty and non-empty arrays which isn't something we track"_.

So, a few links where this is discussed:

1. [Null References: The Billion Dollar Mistake][7]
2. [How can I solve the error 'TS2532: Object is possibly 'undefined'?][1]
3. [False "Property does not exist on type 'never'" when changing value inside callback with strictNullChecks][3]
4. ['Property does not exist on type 'never'][2]
5. [TypeScript does not expect variable change in forEach][4]
6. [TS2531: Object is possibly 'null'][5]
7. [How to suppress "error TS2533: Object is possibly 'null' or 'undefined'"?][6]
8. [Getting Object is possibly 'undefined' in typescript react][8]
9. [Annotate immediately-invoked functions for inlining flow control analysis][9]


[7]: https://www.infoq.com/presentations/Null-References-The-Billion-Dollar-Mistake-Tony-Hoare/
[1]: https://stackoverflow.com/questions/54884488/how-can-i-solve-the-error-ts2532-object-is-possibly-undefined
[2]: https://stackoverflow.com/questions/44147937/property-does-not-exist-on-type-never
[3]: https://github.com/Microsoft/TypeScript/issues/12176
[4]: https://github.com/microsoft/TypeScript/issues/16928
[5]: https://stackoverflow.com/questions/49431880/ts2531-object-is-possibly-null
[6]: https://stackoverflow.com/questions/40349987/how-to-suppress-error-ts2533-object-is-possibly-null-or-undefined
[8]: https://www.angularfix.com/2021/10/getting-object-is-possibly-in.html
[9]: https://github.com/microsoft/TypeScript/issues/11498

## Suppressing errors 

* the deal

[Suppress errors in .ts files using ’// @ts-ignore’ comments](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-6.html#suppress-errors-in-ts-files-using--ts-ignore-comments)

A // @ts-ignore comment suppresses all errors that originate on the following line. **It is recommended practice to have the remainder of the comment following @ts-ignore explain which error is being suppressed.**

Please note that this comment only suppresses the error reporting, and we recommend you use this comments very sparingly.

## How I solve this

* "the right combination of types and assertion"

So, TypeScript also has a special syntax for removing null and undefined from a type without doing any explicit checking. Writing `!` after any expression is effectively a type assertion that the value isn’t null or undefined:
```
# case
const textElementRef = useRef();
// this provokes the error in the next line
const text = textElementRef.current;
// Object is possibly 'undefined'.ts(2532)'
const textWidth = text.offsetWidth;

# what I was trying
const textElementRef = useRef();
const text = textElementRef.current; 
const textWidth = text!.offsetWidth; <-- type assertion
// causing : Property 'offsetWidth' does not exist on type 'never'.ts(2339)

# then I have to change the useRef definition too
const textElementRef = useRef<HTMLSpanElement>(null);
const text = textElementRef.current!; <-- type assertion
const textWidth = text.offsetWidth;
```