diff options
-rw-r--r-- | .circleci/config.yml | 33 | ||||
-rw-r--r-- | components/Footer.vue | 14 | ||||
-rw-r--r-- | components/NavLink.vue (renamed from components/NavLink/index.vue) | 8 | ||||
-rw-r--r-- | components/NavLink/NavLink.test.js | 20 | ||||
-rw-r--r-- | test/Logo.spec.js | 9 | ||||
-rw-r--r-- | test/NavLink.test.js | 15 |
6 files changed, 57 insertions, 42 deletions
diff --git a/.circleci/config.yml b/.circleci/config.yml new file mode 100644 index 0000000..447bd4b --- /dev/null +++ b/.circleci/config.yml @@ -0,0 +1,33 @@ +version: 2 +jobs: + build: + docker: + # specify the version you desire here + - image: circleci/node:12.7.10 + + # Specify service dependencies here if necessary + # CircleCI maintains a library of pre-built images + # documented at https://circleci.com/docs/2.0/circleci-images/ + # - image: circleci/mongo:3.4.4 + + working_directory: ~/repo + + steps: + - checkout + + # Download and cache dependencies + - restore_cache: + keys: + - v1-dependencies-{{ checksum "package.json" }} + # fallback to using the latest cache if no exact match is found + - v1-dependencies- + + - run: npm install + + - save_cache: + paths: + - node_modules + key: v1-dependencies-{{ checksum "package.json" }} + + # run tests! + - run: npm test diff --git a/components/Footer.vue b/components/Footer.vue index 1cdad44..69ea76a 100644 --- a/components/Footer.vue +++ b/components/Footer.vue @@ -2,14 +2,10 @@ <div class="footer" :style="style"> <div class="map"> <div class="routes"> - <router-link v-for="route in routes" :key="route.name" :to="route.path">{{route.name}}</router-link> + <nuxt-link v-for="route in routes" :key="route.name" :to="route.path">{{route.name}}</nuxt-link> </div> <div class="routes"> - <router-link - v-for="route in specialRoutes" - :key="route.name" - :to="route.path" - >{{route.name}}</router-link> + <nuxt-link v-for="route in specialRoutes" :key="route.name" :to="route.path">{{route.name}}</nuxt-link> </div> </div> <div class="space"></div> @@ -34,15 +30,15 @@ export default { specialRoutes: Array, color: { type: String, - default: "#507b34" + default: '#507b34' } }, computed: { style() { - return `background-color: ${this.color}`; + return `background-color: ${this.color}` } } -}; +} </script> <style scoped> diff --git a/components/NavLink/index.vue b/components/NavLink.vue index 8915585..f3a1c6e 100644 --- a/components/NavLink/index.vue +++ b/components/NavLink.vue @@ -1,7 +1,7 @@ <template> <li class="navlink"> <a v-if="external" class="link" target="_blank" rel="”noopener”" :href="link">{{ name }}</a> - <router-link v-else class="link" :to="link">{{ name }}</router-link> + <nuxt-link v-else class="link" :to="link">{{ name }}</nuxt-link> </li> </template> @@ -12,14 +12,14 @@ export default { name: String, external: { type: Boolean, default: false } } -}; +} </script> <style scoped> -@import url("https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap"); +@import url('https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap'); .link { - font-family: "Roboto Slab", serif; + font-family: 'Roboto Slab', serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; diff --git a/components/NavLink/NavLink.test.js b/components/NavLink/NavLink.test.js deleted file mode 100644 index a5da412..0000000 --- a/components/NavLink/NavLink.test.js +++ /dev/null @@ -1,20 +0,0 @@ -import { mount } from '@vue/test-utils'; -import NavLink from './index.vue'; - -describe('NavLink', () => { - // Now mount the component and you have the wrapper - const wrapper = mount(NavLink); - - wrapper.setProps({ link: '/link', name: 'Link' }); - - it('renders the correct markup', () => { - expect(wrapper.html()).toContain(` <li class="navlink"> - <a class="link" href="/link">Link</a> - </li>`); - }); - - // it's also easy to check for the existence of elements - it('has a button', () => { - expect(wrapper.contains('button')).toBe(true); - }); -}); diff --git a/test/Logo.spec.js b/test/Logo.spec.js deleted file mode 100644 index 1628640..0000000 --- a/test/Logo.spec.js +++ /dev/null @@ -1,9 +0,0 @@ -import { mount } from '@vue/test-utils' -import Logo from '@/components/Logo.vue' - -describe('Logo', () => { - test('is a Vue instance', () => { - const wrapper = mount(Logo) - expect(wrapper.isVueInstance()).toBeTruthy() - }) -}) diff --git a/test/NavLink.test.js b/test/NavLink.test.js new file mode 100644 index 0000000..8a1f144 --- /dev/null +++ b/test/NavLink.test.js @@ -0,0 +1,15 @@ +import { mount } from '@vue/test-utils' +import NavLink from '../components/NavLink' + +describe('NavLink', () => { + // Now mount the component and you have the wrapper + const wrapper = mount(NavLink) + + wrapper.setProps({ link: '/link', name: 'Link' }) + + it('renders the correct markup', () => { + expect(wrapper.html()).toContain( + `<li class="navlink"><nuxt-link class="link" to="/link">Link</nuxt-link></li>` + ) + }) +}) |