Newer to jest testing and reaching out to the munity for direction. I need to write a jest test around the following block of code. The environment leverages jest, enzyme and chai. I have searched high and low for examples of optional chaining operator tests. Any examples or links anyone can provide to point me in the right direction.

<TableCell
   key={i}
   size={columnResizing?.columnWidths[column.id] || column.size}
/>

Newer to jest testing and reaching out to the munity for direction. I need to write a jest test around the following block of code. The environment leverages jest, enzyme and chai. I have searched high and low for examples of optional chaining operator tests. Any examples or links anyone can provide to point me in the right direction.

<TableCell
   key={i}
   size={columnResizing?.columnWidths[column.id] || column.size}
/>

• javascript
• reactjs
• jestjs
• enzyme
• chai

• 2 where this columnResizing is ing from? from props, some function call or separate constant? in general you just need to make this columneResizing be undefined but how to achieve that depends on where it es from – skyboyer Commented Sep 15, 2020 at 21:25

2 Answers 2

To enable optional-chaining, install it, like this:

yarn add @babel/plugin-proposal-optional-chaining --dev

After installing it, you need to ensure it's registered within your babel plugins section, like so:

{
  "plugins": ["@babel/plugin-proposal-optional-chaining"]
}

In case someone has a problem with optional chaining in jest + testing-library/react stack.

Test failed because of "Support for the experimental syntax 'optionalChaining' isn't currently enabled" can be resolved by adding

yarn add @babel/plugin-syntax-optional-chaining @babel/plugin-syntax-optional-chaining --dev

Add plugins inside .babelrc to enable transformation:

  "plugins": [
    "@babel/plugin-syntax-optional-chaining",
    "@babel/plugin-proposal-optional-chaining"
   ]