Unit-Test for a switch statement on Angular

Question

I'm new to angular unit testing and I don't know how to test this switch:

  displayBadge(text: any) {
    switch (text) {
      case 'blabla':
        return 'badge badge-pill badge-success';
      case 'lalala':
        return 'badge badge-pill badge-secondary';
      case 'uuuu':
        return 'badge badge-pill badge-warning';
      case 'ooooo':
        return 'badge badge-pill badge-warning';
      case 'eeee':
        return 'badge badge-pill badge-warning';
      case 'zzzzz':
        return 'badge badge-pill badge-dark';
      case 'aaaaa':
        return 'badge badge-pill badge-dark';
      case 'qqqqq':
        return 'badge badge-pill badge-success';
      case 'ccccc':
        return 'badge badge-pill badge-warning';
      case 'rrrrr':
        return 'badge badge-pill badge-success';
      case 'ttttt':
        return 'badge badge-pill badge-warning';
      case 'fffff':
        return 'badge badge-pill badge-success';
      default:
        return '';

I'm using Simontest plugin on VSCODE and the code coverage always tells me I'm missing like 80% of the coverage, which is this switch.

I've tried this way on my spec.ts file:

it('text aaaaa', () => {
    component.text ='aaaaa'
    component.displayBadge(component.text);
    expect('badge badge-pill badge-secondary');
  });

but it doesn't work.

text is defined like this in my ts:

@Input()
  text!: any;

I've seen there are others posts about testing a switch, I've tried everything I've seen here on stack and in general on Google, but SimonTest always tells me this function is not tested.

I don't think it's a good idea to unit-test a `switch` statement: you're using TypeScript, so `tsc` will verify and _mathematically prove_ (in its internal, type-theory-only, _mini-theorem-provider_) things like `switch` statements. Also, probably very brittle too. — Dai, Nov 29 '21 at 13:41
I wouldn't do this if it wasn't a requirement from one of my clients. I think the test should just verify if by putting in text the value "aaaaa" the switch returns the correct badge chosen for that input. It seems so simple, yet I can't find a way. — Maria Scetta, Nov 29 '21 at 13:46
"I wouldn't do this if it wasn't a requirement from one of my clients" - in which case I hope you add an extra "_customer-has-incredibly-ill-informed-requirements-accomodation-fee_" to your invoice then, and tell them to read this: https://levelup.gitconnected.com/the-dangerous-myth-of-100-code-coverage-42d0e3ad83f3 — Dai, Nov 29 '21 at 14:08

Brian Stanley · Accepted Answer · 2021-11-29T14:29:22.583

0

Since displayBadge() is returning the value you are testing for, something like this should work:

it('text aaaaa', () => {
 expect(component.displayBadge('aaaaa')).toEqual('badge badge-pill 
 badge-secondary');
});

edited Nov 29 '21 at 14:29

answered Nov 29 '21 at 13:49

Brian Stanley

2,078
5
24
43

thanks for your answer, but it doesn't work. – Maria Scetta Nov 29 '21 at 13:59
Updateded the answer to remove some code. If that doesn't work, what are the errors you are seeing for the test? – Brian Stanley Nov 29 '21 at 14:30
when I visit test.html file (in the code coverage folder) it appears this: "function not covered" hovering on the name of the function, and "statement not covered" hovering on top of each return of each case. – Maria Scetta Nov 29 '21 at 15:47

Unit-Test for a switch statement on Angular

1 Answers1