From: Eduardo San Martin Morote Date: Sat, 29 Jun 2019 09:30:43 +0000 (+0200) Subject: test: setup tests for components X-Git-Tag: v4.0.0-alpha.0~325 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=6fa333cfd18524d320e7cdc9d98d454e8358a61d;p=thirdparty%2Fvuejs%2Frouter.git test: setup tests for components --- diff --git a/__tests__/helper.js b/__tests__/helper.js index 97c3ac1b..1ba01ea9 100644 --- a/__tests__/helper.js +++ b/__tests__/helper.js @@ -1,3 +1,4 @@ +'use strict' // make tests compatible with mocha so we can write using jest syntax if (typeof global !== 'undefined' && typeof global.beforeAll === 'undefined') { global.beforeAll = global.before diff --git a/__tests__/router-view.spec.js b/__tests__/router-view.spec.js new file mode 100644 index 00000000..075436b5 --- /dev/null +++ b/__tests__/router-view.spec.js @@ -0,0 +1,34 @@ +/** + * @jest-environment jsdom + * + */ +// @ts-check +require("./helper"); +const expect = require("expect"); +const { default: RouterView } = require("../src/components/View"); +const { components, isMocha } = require("./utils"); + +describe("RouterView", () => { + // skip these tests on mocha because @vue/test-utils + // do not work correctly + if (isMocha()) return; + const { mount } = require("@vue/test-utils"); + + it("displays current route component", async () => { + const wrapper = await mount(RouterView, { + mocks: { + $route: { + fullPath: "/", + name: undefined, + path: "/", + query: {}, + params: {}, + hash: "", + meta: {}, + matched: [{ component: components.Home, path: "/", name: undefined }] + } + } + }); + expect(wrapper.html()).toMatchInlineSnapshot(`"
Home
"`); + }); +}); diff --git a/__tests__/utils.ts b/__tests__/utils.ts index 5220564d..6110a6ae 100644 --- a/__tests__/utils.ts +++ b/__tests__/utils.ts @@ -1,5 +1,6 @@ import { JSDOM, ConstructorOptions } from 'jsdom' import { NavigationGuard } from '../src/types' +import { Component } from 'vue' export { HistoryMock } from './HistoryMock' @@ -32,8 +33,14 @@ export const noGuard: NavigationGuard = (to, from, next) => { next() } -export const components = { - Home: { template: `
Home
` }, - Foo: { template: `
Foo
` }, - Bar: { template: `
Bar
` }, +export const components: Record = { + Home: { render: h => h('div', {}, 'Home') }, + Foo: { render: h => h('div', {}, 'Foo') }, + Bar: { render: h => h('div', {}, 'Bar') }, } + +// allow using a .jest modifider to skip some tests on mocha +// specifically, skip component tests as they are a pain to correctly +// adapt to mocha +// @ts-ignore +export const isMocha = () => typeof global.before === 'function' diff --git a/package.json b/package.json index 0cbf99ca..6de03dd6 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "devDependencies": { "@types/jest": "^24.0.15", "@types/jsdom": "^12.2.4", + "@vue/test-utils": "^1.0.0-beta.29", "consola": "^2.9.0", "expect": "^24.8.0", "faked-promise": "^2.1.0", @@ -40,6 +41,7 @@ "ts-node": "^8.3.0", "typescript": "^3.5.2", "vue": "^2.6.10", + "vue-template-compiler": "^2.6.10", "webpack": "^4.35.0", "webpack-cli": "^3.3.5", "webpack-dev-server": "^3.7.2" diff --git a/src/components/View.ts b/src/components/View.ts index 23df951a..db04a5a7 100644 --- a/src/components/View.ts +++ b/src/components/View.ts @@ -1,8 +1,8 @@ // @ts-nocheck -import { FunctionalComponentOptions } from 'vue' +import { Component } from 'vue' -const View: FunctionalComponentOptions = { +const View: Component = { name: 'RouterView', functional: true, @@ -17,8 +17,6 @@ const View: FunctionalComponentOptions = { // @ts-ignore const route = parent.$route - console.log('rendering', route) - // TODO: support nested router-views const matched = route.matched[0] diff --git a/yarn.lock b/yarn.lock index 31917969..e781099f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -420,6 +420,14 @@ resolved "https://registry.yarnpkg.com/@types/yargs/-/yargs-12.0.11.tgz#a090d88e1f40a910e6443c95493c1c035c76ebdc" integrity sha512-IsU1TD+8cQCyG76ZqxP0cVFnofvfzT8p/wO8ENT4jbN/KKN3grsHFgHNl/U+08s33ayX4LwI85cEhYXCOlOkMw== +"@vue/test-utils@^1.0.0-beta.29": + version "1.0.0-beta.29" + resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.0.0-beta.29.tgz#c942cf25e891cf081b6a03332b4ae1ef430726f0" + integrity sha512-yX4sxEIHh4M9yAbLA/ikpEnGKMNBCnoX98xE1RwxfhQVcn0MaXNSj1Qmac+ZydTj6VBSEVukchBogXBTwc+9iA== + dependencies: + dom-event-types "^1.0.0" + lodash "^4.17.4" + "@webassemblyjs/ast@1.8.5": version "1.8.5" resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.8.5.tgz#51b1c5fe6576a34953bf4b253df9f0d490d9e359" @@ -1622,6 +1630,11 @@ date-now@^0.1.4: resolved "https://registry.yarnpkg.com/date-now/-/date-now-0.1.4.tgz#eaf439fd4d4848ad74e5cc7dbef200672b9e345b" integrity sha1-6vQ5/U1ISK105cx9vvIAZyueNFs= +de-indent@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d" + integrity sha1-sgOOhG3DO6pXlhKNCAS0VbjB4h0= + debug@2.6.9, debug@^2.2.0, debug@^2.3.3: version "2.6.9" resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f" @@ -1824,6 +1837,11 @@ dom-converter@~0.1: dependencies: utila "~0.3" +dom-event-types@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/dom-event-types/-/dom-event-types-1.0.0.tgz#5830a0a29e1bf837fe50a70cd80a597232813cae" + integrity sha512-2G2Vwi2zXTHBGqXHsJ4+ak/iP0N8Ar+G8a7LiD2oup5o4sQWytwqqrZu/O6hIMV0KMID2PL69OhpshLO0n7UJQ== + dom-serializer@0: version "0.1.0" resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82" @@ -2665,7 +2683,7 @@ he@1.1.x: resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd" integrity sha1-k0EP0hsAlzUVH4howvJx80J+I/0= -he@1.2.0: +he@1.2.0, he@^1.1.0: version "1.2.0" resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f" integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw== @@ -3818,7 +3836,7 @@ lodash.sortby@^4.7.0: resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438" integrity sha1-7dFMgk4sycHgsKG0K7UhBRakJDg= -lodash@^4.17.11: +lodash@^4.17.11, lodash@^4.17.4: version "4.17.11" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d" integrity sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg== @@ -6355,6 +6373,14 @@ vm-browserify@0.0.4: dependencies: indexof "0.0.1" +vue-template-compiler@^2.6.10: + version "2.6.10" + resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.6.10.tgz#323b4f3495f04faa3503337a82f5d6507799c9cc" + integrity sha512-jVZkw4/I/HT5ZMvRnhv78okGusqe0+qH2A0Em0Cp8aq78+NK9TII263CDVz2QXZsIT+yyV/gZc/j/vlwa+Epyg== + dependencies: + de-indent "^1.0.2" + he "^1.1.0" + vue@^2.6.10: version "2.6.10" resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.10.tgz#a72b1a42a4d82a721ea438d1b6bf55e66195c637"