Vue-jest: Pug + Vue named template slot + Istanbul fails to build coverage with Jest

[nothingismagick]

Version

1.0.0-beta.29

Reproduction link

https://github.com/quasarframework/quasar-testing/issues/87

Steps to reproduce

With a very simple example of using a named slot Istanbul coverage within Jest fails:

<template lang="pug">
  q-layout(view="lHh Lpr lFf")
    q-input()
      template(v-slot:append)
        h2 asdf
</template>

Stacktrace

Running coverage on untested files...Failed to collect coverage from pug-test/src/layouts/MyLayout.vue
ERROR: Unexpected token (1:141)
STACK: SyntaxError: Unexpected token (1:141)
    at Parser.pp$4.raise (node_modules/vue-template-es2015-compiler/buble.js:2757:13)
    at Parser.pp.unexpected (node_modules/vue-template-es2015-compiler/buble.js:647:8)
    at Parser.pp.expect (node_modules/vue-template-es2015-compiler/buble.js:641:26)
    at Parser.pp$2.parseBindingList (node_modules/vue-template-es2015-compiler/buble.js:1694:19)
    at Parser.pp$1.parseFunctionParams (node_modules/vue-template-es2015-compiler/buble.js:1231:22)
    at Parser.pp$1.parseFunction (node_modules/vue-template-es2015-compiler/buble.js:1218:8)
    at Parser.pp$3.parseExprAtom (node_modules/vue-template-es2015-compiler/buble.js:2184:17)
    at Parser.<anonymous> (node_modules/vue-template-es2015-compiler/buble.js:6003:24)
    at Parser.parseExprAtom (node_modules/vue-template-es2015-compiler/buble.js:6129:31)
    at Parser.pp$3.parseExprSubscripts (node_modules/vue-template-es2015-compiler/buble.js:2047:19)

Fix 1

<template lang="pug">
  q-layout(view="lHh Lpr lFf")
    q-input()
      template(v-slot:append="")
        h2 asdf
</template>

Adding the ="" seems to be good enough for Istanbul not to complain, and quasar renders it as expected. I don't like this workaround, though its slightly better than this one:

Fix 2

<template lang="pug">
  q-layout(view="lHh Lpr lFf")
    q-input()
      <template v-slot:append>
        <h2>asdf</h2>
      </template>
</template>

What is expected?

No Stacktrace shown, no errors.

What is actually happening?

Stacktrace

[giddie]

I'm running into this with any named slot in Pug imported into the module under test. For now the first workaround (assigning a blank string) appears to work. Appears to be a parsing bug:

SyntaxError: Unexpected token (1:193)

      at Parser.pp$4.raise (node_modules/vue-template-es2015-compiler/buble.js:2757:13)
      at Parser.pp.unexpected (node_modules/vue-template-es2015-compiler/buble.js:647:8)
      at Parser.pp.expect (node_modules/vue-template-es2015-compiler/buble.js:641:26)
      at Parser.pp$2.parseBindingList (node_modules/vue-template-es2015-compiler/buble.js:1694:19)
      at Parser.pp$1.parseFunctionParams (node_modules/vue-template-es2015-compiler/buble.js:1231:22)
      at Parser.pp$1.parseFunction (node_modules/vue-template-es2015-compiler/buble.js:1218:8)
      at Parser.pp$3.parseExprAtom (node_modules/vue-template-es2015-compiler/buble.js:2184:17)
      at Parser.<anonymous> (node_modules/vue-template-es2015-compiler/buble.js:6003:24)
      at Parser.parseExprAtom (node_modules/vue-template-es2015-compiler/buble.js:6129:31)
      at Parser.pp$3.parseExprSubscripts (node_modules/vue-template-es2015-compiler/buble.js:2047:19)

[giddie]

I've also just run into a similar issue:

div(@click.stop)

    SyntaxError: Unexpected character '@' (1:475)

      at Parser.pp$4.raise (node_modules/vue-template-es2015-compiler/buble.js:2757:13)
      at Parser.pp$8.getTokenFromCode (node_modules/vue-template-es2015-compiler/buble.js:4906:8)
      at Parser.pp$8.readToken (node_modules/vue-template-es2015-compiler/buble.js:4628:15)
      at Parser.readToken (node_modules/vue-template-es2015-compiler/buble.js:6029:22)
      at Parser.pp$8.nextToken (node_modules/vue-template-es2015-compiler/buble.js:4619:15)
      at Parser.pp$8.next (node_modules/vue-template-es2015-compiler/buble.js:4576:8)
      at Parser.pp.eat (node_modules/vue-template-es2015-compiler/buble.js:577:10)
      at Parser.pp.semicolon (node_modules/vue-template-es2015-compiler/buble.js:624:13)
      at Parser.pp$1.parseExpressionStatement (node_modules/vue-template-es2015-compiler/buble.js:1093:8)
      at Parser.pp$1.parseStatement (node_modules/vue-template-es2015-compiler/buble.js:818:24)

Just like for the slot parameter, the problem goes away when I add an empty string:

div(@click.stop="")

The issue with these is really how difficult it is to trace the actual line where the issue originated. The backtrace is no help: it has to be inferred by commenting out code starting at the root component of the app, working down the tree.

[Deckluhm]

https://github.com/vuejs/vue-jest/issues/175#issuecomment-575043315 fixes the issue without needing to change the code.

[giddie]

Can confirm that fixes the issue :)