Stencil unit test reporting (with Jest) broken

Question

I am currently struggling to unit test my Stencil code, due to its reporting being broken. I found some similar questions, but they all mention the problem that there is no percentage being shown. Mine is different, where the reporter (also in the HTML) is showing me completely wrong line where eg my conditional expression is not fully tested or line is not being covered by test. On top of that, the code highlighting itself is also completely off course.

The HTML reporter looks like the following:

(|| means it's red highlighted, not covered by test, and (i) means eg if-block is partially covered)

export class Test {
||  @Prop() input: boolean;
||  const aConst = 'abc';
    let counter = 0;
||
    t(i)estMe(a: number, b: number} {
      if (a > b) {
        ... //code
      } else {
||      ... //code
||    }
    } 
}

I am not sure how this could have happened, I suppose it is due to the version mismatch of Stencil and Jest but I can find no official description whatsoever regarding version compatibilities between them both. Does someone have any idea on what might cause it?

Thanks!

Answer 1

This is a known issue in Stencil v2.11.0, and has been fixed but not released yet . The fix will be included in the v2.12.0 release, which will occur on 2021.12.13. Once v2.12.0 is out, please try upgrading and let us know if that works (or not).