Migrating to stricter TypeScript

[abiyasa]

Problems

Currently, we are compiling UI Core React without strict mode https://github.com/eBay/ebayui-core-react/blob/abd3bb3ca6eef208bb8d3bf3dce68ff25bf60097/tsconfig.json#L17

This means we will not get compilation error on many things when building ui-core-react. However, this might cause problems when the project that consumes ui-core-react use strict mode.

Solution

We need to enable strict mode on our TypeScript. However, this would cause 250+ compilation errors (v5.6.2) if we just set strict: true on tsconfig.

Therefore we need to incrementally enable strict mode and fix them gradually.

Options for Incremental Migration to TypeScript Strict Mode

Generally, one need to:

1. (optional) maybe upgrade to TypeScript 4.6 or even 5? Currently, we're stil using v3.9 which is from 2020.
2. Enable strict mode strict: true on tsconfig, which actually enabling at least 5 strict mode family options
3. Add all strict mode family options and disable them all.
4. Enable one of the strict mode family rule/option.
5. Fix all errors related to the enabled rule.
6. Create PR, merged, and release
7. Repeat step 4.

See details on this article: https://www.bitovi.com/blog/how-to-incrementally-migrate-an-angular-project-to-typescript-strict-mode

Other techniques:

• Use yarn betterer, see https://alanharper.com.au/posts/2021-02-15-migrating-typescript-strict
• Use separated tsconfig with one stricter mode enabled and gradually fix the code: https://code.visualstudio.com/blogs/2019/05/23/strict-null#_coming-up-with-an-incremental-plan

Plan by Tim:

Step 1

• [x] strictBindCallApply
• [x] useUnknownInCatchVariables
• [x] noImplicitThis
• [x] alwaysStrict

Step 2

• [x] strictFunctionTypes 21 errors

Step 3

• [ ] strictNullChecks 150+ errors
• [ ] strictPropertyInitialization requires strictNullChecks

Step 4

• [ ] noImplicitAny 300+ errors

[darkwebdev]

Development blocked by the weird bug where icon is rendered two times, but not in dev environment. hard to reproduce and debug...