React jest Testing for Ternary operator to render components conditionally

Question

`

it('Should render ComB when parameter value=A', () => {
    const {container} = render(<ComB/>);
     expect(container).toBeInTheDocument()
  });

`I want write a jest test case for following code as it show branch coverage 50% and point out for this code.

export default function TestCom(){
  const parameter=useParams();
  return(
    <>
      {
        parameter.value==="A" ? 
        (<ComB/>) : 
        (parameter.value==="B" && <ComC/>)
      }
    </>
  )
}

I am fetching query parameter value and based upon the parameter value conditionally rendering the "components". So can anyone please help how can I write jest test cases for this ternary operator.

What is your jest test Case? – Chetan Kondawle Nov 02 '22 at 15:41 — Chetan Kondawle, Nov 02 '22 at 15:41

score 0 · Answer 1 · answered Nov 02 '22 at 15:41

50% branch coverage just means you're not reaching the other half of your code within the ternary. You need to have 2 tests, one where parameter.value will equal "A" and another test where it doesn't. It would help if you also showed what your test looks like.

React jest Testing for Ternary operator to render components conditionally

1 Answers1