Categories
TypeScript Answers

How to check if specific object is empty in TypeScript?

Sometimes, we want to check if specific object is empty in TypeScript.

In this article, we’ll look at how to check if specific object is empty in TypeScript.

How to check if specific object is empty in TypeScript?

To check if specific object is empty in TypeScript, we can use the Object.keys method.

For instance, we write

const isEmpty = Object.keys(obj).length === 0;

to use Object.keys to return an array of non-inherited keys in obj.

Then we get the length of that and check if it’s 0 to see if obj is empty or not.

Conclusion

To check if specific object is empty in TypeScript, we can use the Object.keys method.

Categories
TypeScript Answers

How to fix the error ‘”TS2322: Type ‘Timeout’ is not assignable to type ‘number'” when running unit tests with TypeScript?

Sometimes, we want to fix the error ‘"TS2322: Type ‘Timeout’ is not assignable to type ‘number’" when running unit tests with TypeScript.

In this article, we’ll look at how to fix the error ‘"TS2322: Type ‘Timeout’ is not assignable to type ‘number’" when running unit tests with TypeScript.

How to fix the error ‘"TS2322: Type ‘Timeout’ is not assignable to type ‘number’" when running unit tests with TypeScript?

To fix the error ‘"TS2322: Type ‘Timeout’ is not assignable to type ‘number’" when running unit tests’ with TypeScript, we can define the type of the value returned by setTimeout.

For instance, we write

let timeoutId: null | ReturnType<typeof setTimeout> = null;

timeoutId = setTimeout(() => {
  //...
});

to set the timeoutId to the null | ReturnType<typeof setTimeout> union type.

We use typeof setTimeout to get the type for the setTimeout function.

And we use ReturnType to get the return type of the setTimeout function.

Then we can assign the value returned by setTimeout to timeoutId without error.

Conclusion

To fix the error ‘"TS2322: Type ‘Timeout’ is not assignable to type ‘number’" when running unit tests’ with TypeScript, we can define the type of the value returned by setTimeout.

Categories
TypeScript Answers

How to import a JavaScript library without definition file in a TypeScript file?

Sometimes, we want to import a JavaScript library without definition file in a TypeScript file.

In this article, we’ll look at how to import a JavaScript library without definition file in a TypeScript file.

How to import a JavaScript library without definition file in a TypeScript file?

To import a JavaScript library without definition file in a TypeScript file, we can add the typed definition file for the module in our own project.

To do this, we add

declare module "lib/errorInfoHandler" {
  const noTypeInfoYet: any;
  export = noTypeInfoYet;
}

into a .d.ts file in our TypeScript project.

We add our own type definition for the lib/errorInfoHandler module.

In it, we add the members of the modules that we know exit with

const noTypeInfoYet: any;
export = noTypeInfoYet;

Conclusion

To import a JavaScript library without definition file in a TypeScript file, we can add the typed definition file for the module in our own project.

Categories
TypeScript Answers

How to fix error ‘”Unexpected token *” on import statement’ with Jest?

Sometimes, we want to fix the error ‘"Unexpected token *" on import statement’ with Jest.

In this article, we’ll look at how to fix the error ‘"Unexpected token *" on import statement’ with Jest.

How to fix error ‘"Unexpected token *" on import statement’ with Jest?

To fix the error ‘"Unexpected token *" on import statement’ with Jest, we need to tell Jest to transpile ES6 modules before we can use them.

To do this, we write

{
  //...
  "jest": {
    "preset": "react-native",
    "transformIgnorePatterns": [
      "node_modules/(?!(jest-)?react-native|react-(native|universal|navigation)-(.*)|@react-native-community/(.*)|@react-navigation/(.*)|bs-platform|(@[a-zA-Z]+/)?(bs|reason|rescript)-(.*)+)"
    ]
  }
  //...
}

in our Jest config.

We set transformIgnorePatterns to an array with the pattern of the module names that we want to transform before we run our tests.

Then Jest will transform the modules into something it can use.

Conclusion

To fix the error ‘"Unexpected token *" on import statement’ with Jest, we need to tell Jest to transpile ES6 modules before we can use them.

Categories
TypeScript Answers

How to define string literal union type from constants in TypeScript?

Sometimes, we want to define string literal union type from constants in TypeScript.

In this article, we’ll look at how to define string literal union type from constants in TypeScript.

How to define string literal union type from constants in TypeScript?

To define string literal union type from constants in TypeScript, we can use the typeof operator on the constants and join the types returned together with |.

For instance, we write

const MY_CONSTANT = "MY_CONSTANT";
const SOMETHING_ELSE = "SOMETHING_ELSE";
type MyType = typeof MY_CONSTANT | typeof SOMETHING_ELSE;

to define 2 constants MY_CONSTANT and SOMETHING_ELSE.

Then we get their types with typeof.

Finally, we create the union type with the returned types with | and assign the expression to MyType.

Conclusion

To define string literal union type from constants in TypeScript, we can use the typeof operator on the constants and join the types returned together with |.