diff --git a/README.md b/README.md index bcf660b..ccd6bb6 100644 --- a/README.md +++ b/README.md @@ -47,6 +47,7 @@ You can also pass in the message into a named slot. This way you can for example | buttonText | 'Got It!' | String | 🔘 Well, its the button text | buttonLink | | String\|Object | Link to more infos. Simple href or a [vue-router](https://github.com/vuejs/vue-router) Location object | buttonLinkText | 'More info' | String | Label of link button +| buttonLinkNewTab | false | Boolean | If true, it opens the link in a new tab/window (href) | buttonClass | 'Cookie__button' | String | Custom class name for buttons | message | 'This website uses cookies to ensure you get the best experience on our website.' | String | Your message in the content area | theme | 'base' | String | Selected theme. You can also create a custom one diff --git a/src/components/CookieLaw.vue b/src/components/CookieLaw.vue index d8c7668..e555324 100644 --- a/src/components/CookieLaw.vue +++ b/src/components/CookieLaw.vue @@ -5,7 +5,7 @@ {{ message }} @@ -29,6 +29,10 @@ type: String, default: 'More info' }, + buttonLinkNewTab: { + type: Boolean, + default: false + }, message: { type: String, default: 'This website uses cookies to ensure you get the best experience on our website.' @@ -80,6 +84,9 @@ }, internalButtonLink () { return typeof this.buttonLink === 'object' && this.buttonLink != null && Object.keys(this.buttonLink).length + }, + target () { + return this.buttonLinkNewTab ? '_blank' : '_self' } }, created () { diff --git a/test/unit/specs/CookieLaw.spec.js b/test/unit/specs/CookieLaw.spec.js index 754a546..3333ca4 100644 --- a/test/unit/specs/CookieLaw.spec.js +++ b/test/unit/specs/CookieLaw.spec.js @@ -25,6 +25,12 @@ describe('CookieLaw.vue', () => { localStorage.clear() }) + it('should have an tag with target="_blank" if buttonLinkNewTab prop is true', () => { + const Constructor = Vue.extend(CookieLaw) + const vm = new Constructor({ propsData: { buttonLink: 'link', buttonLinkNewTab: true } }).$mount() + expect(vm.$el.querySelector('.Cookie__buttons > a').getAttribute('target')) + .to.equal('_blank') + }) // it('should set a cookie when localstorage is not available', () => { // const Constructor = Vue.extend(CookieLaw) // const vm = new Constructor().$mount()