There are seemingly a few incompatibilities with Vue and Istanbul/nyc at the moment, making it a bit difficult to set up proper coverage reporting for Vue files. Thankfully, there's a relatively easy way to fix that!
This will walk you through everything you need to do to add tests and coverage reporting to your vue-cli based project.
Install dependencies for testing and coverage reporting
yarn add -D @vue/cli-plugin-unit-mocha @vue/test-utils istanbul-instrumenter-loader nyc
| <!DOCTYPE html> | |
| <meta charset="utf-8"> | |
| <title>SANKEY Experiment</title> | |
| <style> | |
| .node rect { | |
| cursor: move; | |
| fill-opacity: .9; | |
| shape-rendering: crispEdges; | |
| } |
| #!/usr/bin/env bash | |
| # TODO: Look at nixpkgs/pkgs/build-support/setup-hooks/auto-patchelf.sh | |
| # https://ms-vsliveshare.gallery.vsassets.io/_apis/public/gallery/publisher/MS-vsliveshare/extension/vsliveshare/0.3.423/assetbyname/Microsoft.VisualStudio.Services.VSIXPackage | |
| # Dangerous: | |
| # curl -q https://gist.githubusercontent.com/b333z/5fb902161685c5141bbc91b39a152831/raw/f65d2d0feb475b693c779eeb74fd52ca46b32916/vsls | bash | |
| set -eu |
| /* | |
| * The MIT License (MIT) | |
| * | |
| * Copyright (c) 2015 ARNAUD FRUGIER | |
| * | |
| * Permission is hereby granted, free of charge, to any person obtaining a copy | |
| * of this software and associated documentation files (the "Software"), to deal | |
| * in the Software without restriction, including without limitation the rights | |
| * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell | |
| * copies of the Software, and to permit persons to whom the Software is |
| .timeline { | |
| list-style: none; | |
| padding: 20px 0 20px; | |
| position: relative; | |
| } | |
| .timeline:before { | |
| top: 0; | |
| bottom: 0; | |
| position: absolute; |
| { | |
| "vars": { | |
| "@gray-base": "#000", | |
| "@gray-darker": "lighten(@gray-base, 13.5%)", | |
| "@gray-dark": "lighten(@gray-base, 20%)", | |
| "@gray": "lighten(@gray-base, 33.5%)", | |
| "@gray-light": "lighten(@gray-base, 46.7%)", | |
| "@gray-lighter": "lighten(@gray-base, 93.5%)", | |
| "@brand-primary": "#428bca", | |
| "@brand-success": "#5cb85c", |