diff --git a/src/components/collapse/fixtures/collapse.html b/src/components/collapse/fixtures/collapse.html index 90e9972a40f..6110a4ffdfa 100644 --- a/src/components/collapse/fixtures/collapse.html +++ b/src/components/collapse/fixtures/collapse.html @@ -1,118 +1,129 @@
- -

Basic example - Directive Modifiers

-

- - Toggle Collapse 1 - -

- - Collapse 1 contents Here - - -

Basic example - Directive Argument

-

- - Toggle Collapse 2 - -

- - Collapse 2 contents Here - - -

Initially Open Example

-

- - Toggle Collapse 3 - -

- - - Initially visible Collapse 3 contents Here - - - -

v-model Example

-

- - Toggle Collapse 4 - -

- - - Initially visible Collapse 4 contents Here - - - -

Multiple Targets Example

-

- - Toggle Multi Collapse 1 & 2 - -

- - Multi-Collapse 1 contents Here - -

This paragraph doesn't collapse

- - Multi-Collapse 2 contents Here - - -

Accordion example

- Toggle Accordion 1 - - - Accordion 1 contents Here - - - Toggle Accordion 2 - - - Accordion 2 contents Here - - - Toggle Accordion 3 - - - Accordion 3 contents Here - + +

Basic example - Directive Modifiers

+

+ + Toggle Collapse 1 + +

+ + Collapse 1 contents Here + + + +

Basic example - Directive Argument

+

+ + Toggle Collapse 2 + +

+ + Collapse 2 contents Here + + + +

Initially Open Example

+

+ + Toggle Collapse 3 + +

+ + Initially visible Collapse 3 contents Here + + + +

v-model Example

+

+ + Toggle Collapse 4 + +

+ + Initially visible Collapse 4 contents Here + + + +

Multiple Targets Example

+

+ + Toggle Multi Collapse 1 & 2 + +

+ + Multi-Collapse 1 contents Here + +

This paragraph doesn't collapse

+ + Multi-Collapse 2 contents Here + + + +

Accordion example

+ + Toggle Accordion 1 + + + Accordion 1 contents Here + + + Toggle Accordion 2 + + + Accordion 2 contents Here + + + Toggle Accordion 3 + + + Accordion 3 contents Here + + + +

Inside Navbar

+ + + +

Nav Collapse contents Here

 +
diff --git a/src/components/input-group/fixtures/input-group.html b/src/components/input-group/fixtures/input-group.html deleted file mode 100644 index 067f0be0611..00000000000 --- a/src/components/input-group/fixtures/input-group.html +++ /dev/null @@ -1,20 +0,0 @@ -
- - - - - - $ - - AA - - - - - - - - $ - - -
diff --git a/src/components/input-group/fixtures/input-group.js b/src/components/input-group/fixtures/input-group.js deleted file mode 100644 index 0bae7b95202..00000000000 --- a/src/components/input-group/fixtures/input-group.js +++ /dev/null @@ -1,3 +0,0 @@ -window.app = new Vue({ - el: '#app' -}) diff --git a/src/components/input-group/input-group-append.spec.js b/src/components/input-group/input-group-append.spec.js new file mode 100644 index 00000000000..d580e540f1a --- /dev/null +++ b/src/components/input-group/input-group-append.spec.js @@ -0,0 +1,74 @@ +import InputGroupAppend from './input-group-append' +import { mount } from '@vue/test-utils' + +describe('input-group > input-group-append', () => { + it('has expected default structure', async () => { + const wrapper = mount(InputGroupAppend) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group-append') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.input-group-append > *').length).toBe(0) + expect(wrapper.text()).toEqual('') + }) + + it('renders custom root element when tag prop is set', async () => { + const wrapper = mount(InputGroupAppend, { + propsData: { + tag: 'span' + } + }) + + expect(wrapper.is('span')).toBe(true) + expect(wrapper.classes()).toContain('input-group-append') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.input-group-append > *').length).toBe(0) + expect(wrapper.text()).toEqual('') + }) + + it('renders content of default slot', async () => { + const wrapper = mount(InputGroupAppend, { + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group-append') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('foobar') + }) + + it('renders child input-group-text when prop is-text set', async () => { + const wrapper = mount(InputGroupAppend, { + propsData: { + isText: true + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group-append') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.input-group-text').length).toBe(1) + expect(wrapper.findAll('.input-group-append > .input-group-text').length).toBe(1) + expect(wrapper.text()).toEqual('') + }) + + it('renders default slot inside child input-group-text when prop is-text set', async () => { + const wrapper = mount(InputGroupAppend, { + propsData: { + isText: true + }, + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group-append') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.input-group-text').length).toBe(1) + expect(wrapper.text()).toEqual('foobar') + expect(wrapper.find('.input-group-text').text()).toEqual('foobar') + }) +}) diff --git a/src/components/input-group/input-group-prepend.spec.js b/src/components/input-group/input-group-prepend.spec.js new file mode 100644 index 00000000000..28ed7483859 --- /dev/null +++ b/src/components/input-group/input-group-prepend.spec.js @@ -0,0 +1,74 @@ +import InputGroupPrepend from './input-group-prepend' +import { mount } from '@vue/test-utils' + +describe('input-group > input-group-prepend', () => { + it('has expected default structure', async () => { + const wrapper = mount(InputGroupPrepend) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group-prepend') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.input-group-prepend > *').length).toBe(0) + expect(wrapper.text()).toEqual('') + }) + + it('renders custom root element when tag prop is set', async () => { + const wrapper = mount(InputGroupPrepend, { + propsData: { + tag: 'span' + } + }) + + expect(wrapper.is('span')).toBe(true) + expect(wrapper.classes()).toContain('input-group-prepend') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.input-group-prepend > *').length).toBe(0) + expect(wrapper.text()).toEqual('') + }) + + it('renders content of default slot', async () => { + const wrapper = mount(InputGroupPrepend, { + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group-prepend') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('foobar') + }) + + it('renders child input-group-text when prop is-text set', async () => { + const wrapper = mount(InputGroupPrepend, { + propsData: { + isText: true + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group-prepend') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.input-group-text').length).toBe(1) + expect(wrapper.findAll('.input-group-prepend > .input-group-text').length).toBe(1) + expect(wrapper.text()).toEqual('') + }) + + it('renders default slot inside child input-group-text when prop is-text set', async () => { + const wrapper = mount(InputGroupPrepend, { + propsData: { + isText: true + }, + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group-prepend') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.input-group-text').length).toBe(1) + expect(wrapper.text()).toEqual('foobar') + expect(wrapper.find('.input-group-text').text()).toEqual('foobar') + }) +}) diff --git a/src/components/input-group/input-group-text.spec.js b/src/components/input-group/input-group-text.spec.js new file mode 100644 index 00000000000..d8eec1415f6 --- /dev/null +++ b/src/components/input-group/input-group-text.spec.js @@ -0,0 +1,39 @@ +import InputGroupText from './input-group-text' +import { mount } from '@vue/test-utils' + +describe('input-group > input-group-text', () => { + it('has expected default structure', async () => { + const wrapper = mount(InputGroupText) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group-text') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toBe('') + }) + + it('has custom root element when prop tag set', async () => { + const wrapper = mount(InputGroupText, { + propsData: { + tag: 'span' + } + }) + + expect(wrapper.is('span')).toBe(true) + expect(wrapper.classes()).toContain('input-group-text') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toBe('') + }) + + it('renders content of default slot', async () => { + const wrapper = mount(InputGroupText, { + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group-text') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toBe('foobar') + }) +}) diff --git a/src/components/input-group/input-group.spec.js b/src/components/input-group/input-group.spec.js index 77ef7fe727a..9cb78088bda 100644 --- a/src/components/input-group/input-group.spec.js +++ b/src/components/input-group/input-group.spec.js @@ -1,170 +1,110 @@ -import { loadFixture, testVM } from '../../../tests/utils' +import InputGroup from './input-group' +import { mount } from '@vue/test-utils' describe('input-group', () => { - beforeEach(loadFixture(__dirname, 'input-group')) - testVM() - - it("should have '.input-group' class on root element", async () => { - const { - app: { $refs } - } = window - - const refs = ['basic', 'components'] - - refs.forEach(ref => { - expect($refs[ref]).toHaveClass('input-group') - }) - }) - - it("should have role 'group' on root element", async () => { - const { - app: { $refs } - } = window - - const refs = ['basic', 'components'] - - refs.forEach(ref => { - expect($refs[ref].getAttribute('role')).toBe('group') + it('should have expected default structure', async () => { + const wrapper = mount(InputGroup) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.attributes('role')).toBeDefined() + expect(wrapper.attributes('role')).toEqual('group') + expect(wrapper.findAll('.input-group > *').length).toBe(0) + expect(wrapper.text()).toEqual('') + }) + + it('should render custom root element when prop tag is set', async () => { + const wrapper = mount(InputGroup, { + propsData: { + tag: 'span' + } }) - }) - it('basic should have `div.input-group-prepend` as first child', async () => { - const { - app: { $refs } - } = window - - const left = $refs.basic.children[0] - expect(left).toBeDefined() - expect(left).toHaveClass('input-group-prepend') + expect(wrapper.is('span')).toBe(true) + expect(wrapper.classes()).toContain('input-group') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.attributes('role')).toBeDefined() + expect(wrapper.attributes('role')).toEqual('group') + expect(wrapper.findAll('.input-group > *').length).toBe(0) }) - it('basic should have content in left `.input-group-prepend`', async () => { - const { - app: { $refs } - } = window - - const left = $refs.basic.children[0] - expect(left).toBeDefined() - expect(left.textContent).toContain('$') - }) - - it('basic should have right `.input-group-append` as last child', async () => { - const { - app: { $refs } - } = window - - const right = $refs.basic.children[2] - expect(right).toBeDefined() - expect(right).toHaveClass('input-group-append') - }) - - it('basic should have content in `.input-group-append`', async () => { - const { - app: { $refs } - } = window - - const right = $refs.basic.children[2] - expect(right).toBeDefined() - expect(right.textContent).toContain('.00') - }) - - it('basic should have input as second child', async () => { - const { - app: { $refs } - } = window - - const input = $refs.basic.children[1] - expect(input).toBeDefined() - expect(input.tagName).toBe('INPUT') - }) - - it('components should have `.input-group-prepend` as first child', async () => { - const { - app: { $refs } - } = window - - const left = $refs.components.children[0] - expect(left).toBeDefined() - expect(left).toHaveClass('input-group-prepend') - }) - - it('components should have content in left `.input-group-prepend`', async () => { - const { - app: { $refs } - } = window - - const left = $refs.components.children[0] - expect(left).toBeDefined() - expect(left.textContent).toContain('$') - }) - - it('components should have right `.input-group-append` as last child', async () => { - const { - app: { $refs } - } = window - - const right = $refs.components.children[2] - expect(right).toBeDefined() - expect(right).toHaveClass('input-group-append') - }) - - it('components should have button in right `.input-group-append`', async () => { - const { - app: { $refs } - } = window - - const right = $refs.components.children[2] - expect(right).toBeDefined() - const button = right.children[0] - expect(button).toBeDefined() - expect(button.tagName).toBe('BUTTON') - }) - - it('components should have input as second child', async () => { - const { - app: { $refs } - } = window - - const input = $refs.components.children[1] - expect(input).toBeDefined() - expect(input.tagName).toBe('INPUT') - }) - - it("large should have '.input-group-lg' class on root element", async () => { - const { - app: { $refs } - } = window - - expect($refs.large).toHaveClass('input-group-lg') - }) - - it("small should have '.input-group-sm' class on root element", async () => { - const { - app: { $refs } - } = window + it('should apply size class when when prop size is set', async () => { + const wrapper = mount(InputGroup, { + propsData: { + size: 'lg' + } + }) - expect($refs.small).toHaveClass('input-group-sm') + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group') + expect(wrapper.classes()).toContain('input-group-lg') + expect(wrapper.classes().length).toBe(2) }) - it("tags should have root Element type of `fieldset'", async () => { - const { - app: { $refs } - } = window + it('should render default slot content', async () => { + const wrapper = mount(InputGroup, { + slots: { + default: 'foobar' + } + }) - const tags = $refs.tags - expect(tags).toBeDefined() - expect(tags.tagName).toBe('FIELDSET') - }) + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('foobar') + expect(wrapper.findAll('.input-group > *').length).toBe(0) + }) + + it('renders input-group-prepend & input-group-append when prepend & append props set', async () => { + const wrapper = mount(InputGroup, { + propsData: { + prepend: 'foo', + append: 'bar' + }, + slots: { + default: 'foobar' + } + }) - it("tags should have addon Element type of `span'", async () => { - const { - app: { $refs } - } = window + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('foofoobarbar') + expect(wrapper.findAll('.input-group > *').length).toBe(2) + expect(wrapper.findAll('.input-group-prepend').length).toBe(1) + expect(wrapper.findAll('.input-group-prepend > .input-group-text').length).toBe(1) + expect(wrapper.find('.input-group-prepend').text()).toBe('foo') + expect(wrapper.findAll('.input-group-append').length).toBe(1) + expect(wrapper.findAll('.input-group-append > .input-group-text').length).toBe(1) + expect(wrapper.find('.input-group-append').text()).toBe('bar') + expect(wrapper.find('.input-group > .input-group-prepend ~ .input-group-append').exists()).toBe( + true + ) + }) + + it('renders input-group-prepend & input-group-append when prepend & append slots present', async () => { + const wrapper = mount(InputGroup, { + slots: { + default: 'foobar', + prepend: 'foo', + append: 'bar' + } + }) - const tags = $refs.tags - expect(tags).toBeDefined() - const left = tags.children[0] - expect(left).toBeDefined() - expect(left.tagName).toBe('SPAN') + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('input-group') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('foofoobarbar') + expect(wrapper.findAll('.input-group > *').length).toBe(2) + expect(wrapper.findAll('.input-group-prepend').length).toBe(1) + expect(wrapper.findAll('.input-group-prepend > .input-group-text').length).toBe(0) + expect(wrapper.find('.input-group-prepend').text()).toBe('foo') + expect(wrapper.findAll('.input-group-append').length).toBe(1) + expect(wrapper.findAll('.input-group-append > .input-group-text').length).toBe(0) + expect(wrapper.find('.input-group-append').text()).toBe('bar') + expect(wrapper.find('.input-group > .input-group-prepend ~ .input-group-append').exists()).toBe( + true + ) }) }) diff --git a/src/components/layout/col.js b/src/components/layout/col.js index e3f5c1006da..4e4e403898c 100644 --- a/src/components/layout/col.js +++ b/src/components/layout/col.js @@ -136,9 +136,11 @@ export default (resolve, reject) => { } } + const hasColClasses = classList.some(className => /^col-/.test(className)) + classList.push({ - // Default to .col if no other classes generated nor `cols` specified. - col: props.col || (classList.length === 0 && !props.cols), + // Default to .col if no other col-{bp}-* classes generated nor `cols` specified. + col: props.col || (!hasColClasses && !props.cols), [`col-${props.cols}`]: props.cols, [`offset-${props.offset}`]: props.offset, [`order-${props.order}`]: props.order, diff --git a/src/components/layout/col.spec.js b/src/components/layout/col.spec.js index ff06eb6e656..4352e5a0245 100644 --- a/src/components/layout/col.spec.js +++ b/src/components/layout/col.spec.js @@ -1,72 +1,171 @@ -import { loadFixture, testVM } from '../../../tests/utils' - -// TODO: Export function from col.js -function computeBkPtClass(type, breakpoint, val) { - let className = type - if (val === false || val === null || val === undefined) { - return undefined - } - if (breakpoint) { - className += `-${breakpoint}` - } - if (type === 'col' && (val === '' || val === true)) { - // .col-md - return className.toLowerCase() - } - // .order-md-6 - className += `-${val}` - return className.toLowerCase() +import ColAsync from './col' +import { mount } from '@vue/test-utils' + +// Vue test utils doesnt currently support mounting Async Components +// So we have to resolve the component ourselves +// https://github.com/vuejs/vue-test-utils/issues/1012 +let Col +if (typeof ColAsync === 'function') { + // is async, so call resolve + ColAsync(cmp => { + Col = cmp + }) +} else { + // Not async function + Col = ColAsync } -describe('col', () => { - beforeEach(loadFixture(__dirname, 'col')) - testVM() +describe('layout > col', () => { + it('should have default expected structure', async () => { + const wrapper = mount(Col) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('col') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.col > *').length).toBe(0) + expect(wrapper.text()).toEqual('') + }) + + it('renders custom root element when tag prop set', async () => { + const wrapper = mount(Col, { + propsData: { + tag: 'span' + } + }) + + expect(wrapper.is('span')).toBe(true) + expect(wrapper.classes()).toContain('col') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.col > *').length).toBe(0) + expect(wrapper.text()).toEqual('') + }) + + it('should apply breakpoint specific col-{bp}-{#} classes', async () => { + const wrapper = mount(Col, { + propsData: { + cols: 6, + sm: 5, + md: 4, + lg: 3, + xl: 2 + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('col-6') + expect(wrapper.classes()).toContain('col-sm-5') + expect(wrapper.classes()).toContain('col-md-4') + expect(wrapper.classes()).toContain('col-lg-3') + expect(wrapper.classes()).toContain('col-xl-2') + expect(wrapper.classes().length).toBe(5) + }) + + it('should not have class "col" when only single breakpoint prop specified', async () => { + const wrapper = mount(Col, { + propsData: { + sm: 5 + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('col-sm-5') + expect(wrapper.classes().length).toBe(1) + }) + + it('should apply ".offset-*" classes with "offset-{bp}-{#}" props', async () => { + const wrapper = mount(Col, { + propsData: { + offset: 6, + offsetSm: 5, + offsetMd: 4, + offsetLg: 3, + offsetXl: 2 + } + }) - it("should apply '.col' when no props passed", async () => { - const { $refs } = window.app - expect($refs.basic).toHaveClass('col') + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('col') + expect(wrapper.classes()).toContain('offset-6') + expect(wrapper.classes()).toContain('offset-sm-5') + expect(wrapper.classes()).toContain('offset-md-4') + expect(wrapper.classes()).toContain('offset-lg-3') + expect(wrapper.classes()).toContain('offset-xl-2') + expect(wrapper.classes().length).toBe(6) }) - it("should apply '.col-*' class with 'cols' prop", async () => { - const { $refs } = window.app - $refs.cols.forEach((vnode, i) => { - const size = i + 1 - expect(vnode).toHaveClass(`col-${size}`) - expect(vnode).not.toHaveClass('col') + it('should apply ".order-*" classes with "order-{bp}-{#}" props', async () => { + const wrapper = mount(Col, { + propsData: { + order: 6, + orderSm: 5, + orderMd: 4, + orderLg: 3, + orderXl: 2 + } }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('col') + expect(wrapper.classes()).toContain('order-6') + expect(wrapper.classes()).toContain('order-sm-5') + expect(wrapper.classes()).toContain('order-md-4') + expect(wrapper.classes()).toContain('order-lg-3') + expect(wrapper.classes()).toContain('order-xl-2') + expect(wrapper.classes().length).toBe(6) }) - it("should apply '.offset-*' class with 'offset' prop", async () => { - const { $refs } = window.app - $refs.offset.forEach((vnode, i) => { - const size = i + 1 - expect(vnode).toHaveClass(`offset-${size}`) + it("should apply boolean breakpoint classes for 'sm', 'md', 'lg', 'xl' prop", async () => { + const wrapper = mount(Col, { + propsData: { + col: true, + sm: true, + md: true, + lg: true, + xl: true + } }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('col') + expect(wrapper.classes()).toContain('col-sm') + expect(wrapper.classes()).toContain('col-md') + expect(wrapper.classes()).toContain('col-lg') + expect(wrapper.classes()).toContain('col-xl') + expect(wrapper.classes().length).toBe(5) }) - it("should apply '.order-*' class with 'order' prop", async () => { - const { $refs } = window.app - $refs.order.forEach((vnode, i) => { - const size = i + 1 - expect(vnode).toHaveClass(`order-${size}`) + it("should apply boolean breakpoint classes for 'sm', 'md', 'lg', 'xl' prop set to empty string", async () => { + const wrapper = mount(Col, { + propsData: { + sm: '', + md: '', + lg: '', + xl: '' + } }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('col-sm') + expect(wrapper.classes()).toContain('col-md') + expect(wrapper.classes()).toContain('col-lg') + expect(wrapper.classes()).toContain('col-xl') + expect(wrapper.classes().length).toBe(4) }) - it("should apply breakpoint classes for 'col', 'offset', 'order' props", async () => { - const { $refs } = window.app - for (const bkpt of ['sm', 'md', 'lg', 'xl']) { - $refs[`multi-${bkpt}`].forEach((vnode, i) => { - const size = i + 1 - expect(vnode).toHaveAllClasses([ - `col-${bkpt}-${size}`, - `offset-${bkpt}-${size}`, - `order-${bkpt}-${size}` - ]) - expect(vnode).not.toHaveClass('col') - }) - } + it('should apply ".align-self-*" class with "align-self" prop', async () => { + const wrapper = mount(Col, { + propsData: { + alignSelf: 'center' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('col') + expect(wrapper.classes()).toContain('align-self-center') + expect(wrapper.classes().length).toBe(2) }) + /* it('computeBkPtClass helper should compute boolean classes', async () => { expect(computeBkPtClass('col', 'sm', true)).toBe('col-sm') expect(computeBkPtClass('col', 'md', true)).toBe('col-md') @@ -87,25 +186,5 @@ describe('col', () => { expect(computeBkPtClass('col', 'lg', false)).toBe(undefined) expect(computeBkPtClass('col', 'xl', false)).toBe(undefined) }) - - it("should apply boolean breakpoint classes for 'sm', 'md', 'lg', 'xl' prop", async () => { - const { $refs } = window.app - ;['sm', 'md', 'lg', 'xl'].forEach((bkpt, idx) => { - // Shorthand binding - expect($refs[bkpt]).toHaveClass(`col-${bkpt}`) - // Dynamically bound using object literals { sm: true } - expect($refs[`boolean-breakpoints`][idx]).toHaveClass(`col-${bkpt}`) - expect($refs[`boolean-breakpoints`][idx]).not.toHaveClass('col') - }) - }) - - it("should apply 'tag'", async () => { - const { $refs } = window.app - expect($refs.tag).toBeElement('section') - }) - - it("should apply '.align-self-*' class with 'align-self' prop", async () => { - const { $refs } = window.app - expect($refs.alignSelf).toHaveClass('align-self-center') - }) + */ }) diff --git a/src/components/layout/container.spec.js b/src/components/layout/container.spec.js index 634cd3b1560..9c8b5c4329a 100644 --- a/src/components/layout/container.spec.js +++ b/src/components/layout/container.spec.js @@ -1,90 +1,52 @@ -import { loadFixture, testVM } from '../../../tests/utils' - -describe('container', () => { - beforeEach(loadFixture(__dirname, 'container')) - testVM() - - it('default should contain default class', async () => { - const { - app: { $refs } - } = window - expect($refs.default).toHaveClass('container') - }) - - it('default should not contain fluid class', async () => { - const { - app: { $refs } - } = window - expect($refs.default).not.toHaveClass('container-fluid') - }) - - it('custom should contain default class', async () => { - const { - app: { $refs } - } = window - expect($refs.custom).toHaveClass('container') - }) - - it('custom should not contain fluid class', async () => { - const { - app: { $refs } - } = window - expect($refs.custom).not.toHaveClass('container-fluid') - }) - - it('fluid should not contain default class', async () => { - const { - app: { $refs } - } = window - expect($refs.fluid).not.toHaveClass('container') - }) - - it('fluid should contain fluid class', async () => { - const { - app: { $refs } - } = window - expect($refs.fluid).toHaveClass('container-fluid') - }) - - it('default should have content', async () => { - const { - app: { $refs } - } = window - expect($refs.default.textContent).toContain('default') - }) - - it('custom should have content', async () => { - const { - app: { $refs } - } = window - expect($refs.custom.textContent).toContain('custom') - }) - - it('fluid should have content', async () => { - const { - app: { $refs } - } = window - expect($refs.fluid.textContent).toContain('fluid') - }) - - it('default should have tag div', async () => { - const { - app: { $refs } - } = window - expect($refs.default).toBeElement('div') - }) - - it('custom should have tag p', async () => { - const { - app: { $refs } - } = window - expect($refs.custom).toBeElement('p') - }) - - it('fluid should have tag div', async () => { - const { - app: { $refs } - } = window - expect($refs.fluid).toBeElement('div') +import Container from './container' +import { mount } from '@vue/test-utils' + +describe('layout > container', () => { + it('should have expected default structure', async () => { + const wrapper = mount(Container) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('container') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('') + }) + + it('renders custom root element when prop tag set', async () => { + const wrapper = mount(Container, { + propsData: { + tag: 'section' + } + }) + + expect(wrapper.is('section')).toBe(true) + expect(wrapper.classes()).toContain('container') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('') + }) + + it('should have container-fluid class when prop fluid set', async () => { + const wrapper = mount(Container, { + propsData: { + fluid: true + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('container-fluid') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('') + }) + + it('has content from default slot', async () => { + const wrapper = mount(Container, { + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('container') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('foobar') }) }) diff --git a/src/components/layout/fixtures/col.html b/src/components/layout/fixtures/col.html deleted file mode 100644 index ac1f900281f..00000000000 --- a/src/components/layout/fixtures/col.html +++ /dev/null @@ -1,42 +0,0 @@ -
-
-
- -

Hello Vue!

- - - - - - - - - -
- -
- - -
-
-
diff --git a/src/components/layout/fixtures/col.js b/src/components/layout/fixtures/col.js deleted file mode 100644 index 630ab8a7ae4..00000000000 --- a/src/components/layout/fixtures/col.js +++ /dev/null @@ -1,13 +0,0 @@ -window.app = new Vue({ - el: '#app', - data: { - breakpoints: ['sm', 'md', 'lg', 'xl'], - breakpointObjs: [ - { sm: true, key: 'sm' }, - { md: true, key: 'md' }, - { lg: true, key: 'lg' }, - { xl: true, key: 'xl' } - ], - sizes: Array.from({ length: 12 }).map((_, i) => i + 1) - } -}) diff --git a/src/components/layout/fixtures/container.html b/src/components/layout/fixtures/container.html deleted file mode 100644 index ec6507aacf0..00000000000 --- a/src/components/layout/fixtures/container.html +++ /dev/null @@ -1,10 +0,0 @@ -
- - default -
- - custom -
- - fluid -
diff --git a/src/components/layout/fixtures/container.js b/src/components/layout/fixtures/container.js deleted file mode 100644 index 0bae7b95202..00000000000 --- a/src/components/layout/fixtures/container.js +++ /dev/null @@ -1,3 +0,0 @@ -window.app = new Vue({ - el: '#app' -}) diff --git a/src/components/layout/fixtures/row.html b/src/components/layout/fixtures/row.html deleted file mode 100644 index 38ca428db0e..00000000000 --- a/src/components/layout/fixtures/row.html +++ /dev/null @@ -1,14 +0,0 @@ -
- - default - - custom - - no gutters - - align v - - align h - - align content -
diff --git a/src/components/layout/fixtures/row.js b/src/components/layout/fixtures/row.js deleted file mode 100644 index 0bae7b95202..00000000000 --- a/src/components/layout/fixtures/row.js +++ /dev/null @@ -1,3 +0,0 @@ -window.app = new Vue({ - el: '#app' -}) diff --git a/src/components/layout/form-row.spec.js b/src/components/layout/form-row.spec.js new file mode 100644 index 00000000000..ac8b3674110 --- /dev/null +++ b/src/components/layout/form-row.spec.js @@ -0,0 +1,39 @@ +import FormRow from './form-row' +import { mount } from '@vue/test-utils' + +describe('layout > form-row', () => { + it('has expected default structure', async () => { + const wrapper = mount(FormRow) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('form-row') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('') + }) + + it('custom root element when prop tag set', async () => { + const wrapper = mount(FormRow, { + propsData: { + tag: 'span' + } + }) + + expect(wrapper.is('span')).toBe(true) + expect(wrapper.classes()).toContain('form-row') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('') + }) + + it('renders default slot content', async () => { + const wrapper = mount(FormRow, { + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('form-row') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('foobar') + }) +}) diff --git a/src/components/layout/row.spec.js b/src/components/layout/row.spec.js index 6645c6362ec..762c5ec2922 100644 --- a/src/components/layout/row.spec.js +++ b/src/components/layout/row.spec.js @@ -1,94 +1,91 @@ -import { loadFixture, testVM } from '../../../tests/utils' +import Row from './row' +import { mount } from '@vue/test-utils' -describe('form-row', () => { - beforeEach(loadFixture(__dirname, 'row')) - testVM() +describe('layout > row', () => { + it('has expected default structure', async () => { + const wrapper = mount(Row) - it('default should contain base class', async () => { - const { - app: { $refs } - } = window - expect($refs.default).toHaveClass('row') + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('row') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('') }) - it('custom should contain base class', async () => { - const { - app: { $refs } - } = window - expect($refs.custom).toHaveClass('row') - }) + it('renders custom root element when prop tag is set', async () => { + const wrapper = mount(Row, { + propsData: { + tag: 'p' + } + }) - it('noGutters should contain classes', async () => { - const { - app: { $refs } - } = window - expect($refs.noGutters).toHaveClass('row') - expect($refs.noGutters).toHaveClass('no-gutters') + expect(wrapper.is('p')).toBe(true) + expect(wrapper.classes()).toContain('row') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('') }) - it('alignV should contain classes', async () => { - const { - app: { $refs } - } = window - expect($refs.alignV).toHaveClass('row') - expect($refs.alignV).toHaveClass('align-items-center') - }) + it('renders default slot content', async () => { + const wrapper = mount(Row, { + slots: { + default: 'foobar' + } + }) - it('alignH should contain classes', async () => { - const { - app: { $refs } - } = window - expect($refs.alignH).toHaveClass('row') - expect($refs.alignH).toHaveClass('justify-content-center') + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('row') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('foobar') }) - it('alignContent should contain classes', async () => { - const { - app: { $refs } - } = window - expect($refs.alignContent).toHaveClass('row') - expect($refs.alignContent).toHaveClass('align-content-center') - }) + it('has class no-guttens when prop no-gutters is set', async () => { + const wrapper = mount(Row, { + propsData: { + noGutters: true + } + }) - it('default should have content', async () => { - const { - app: { $refs } - } = window - expect($refs.default.textContent).toContain('default') + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('row') + expect(wrapper.classes()).toContain('no-gutters') + expect(wrapper.classes().length).toBe(2) }) - it('custom should have content', async () => { - const { - app: { $refs } - } = window - expect($refs.custom.textContent).toContain('custom') - }) + it('has vertial align class when prop align-v is set', async () => { + const wrapper = mount(Row, { + propsData: { + alignV: 'baseline' + } + }) - it('noGutters should have content', async () => { - const { - app: { $refs } - } = window - expect($refs.noGutters.textContent).toContain('no gutters') + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('row') + expect(wrapper.classes()).toContain('align-items-baseline') + expect(wrapper.classes().length).toBe(2) }) - it('default should have tag div', async () => { - const { - app: { $refs } - } = window - expect($refs.default).toBeElement('div') - }) + it('has horizontal align class when prop align-h is set', async () => { + const wrapper = mount(Row, { + propsData: { + alignH: 'center' + } + }) - it('custom should have tag p', async () => { - const { - app: { $refs } - } = window - expect($refs.custom).toBeElement('p') + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('row') + expect(wrapper.classes()).toContain('justify-content-center') + expect(wrapper.classes().length).toBe(2) }) - it('noGutters should have tag div', async () => { - const { - app: { $refs } - } = window - expect($refs.noGutters).toBeElement('div') + it('has content align class when prop align-content is set', async () => { + const wrapper = mount(Row, { + propsData: { + alignContent: 'stretch' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('row') + expect(wrapper.classes()).toContain('align-content-stretch') + expect(wrapper.classes().length).toBe(2) }) }) diff --git a/src/components/list-group/list-group-item.spec.js b/src/components/list-group/list-group-item.spec.js index 0d119072a32..60b09ddc43f 100644 --- a/src/components/list-group/list-group-item.spec.js +++ b/src/components/list-group/list-group-item.spec.js @@ -1,7 +1,7 @@ import ListGroupItem from './list-group-item' import { mount } from '@vue/test-utils' -describe('list-group-item', () => { +describe('list-group > list-group-item', () => { it('default should have tag div', async () => { const wrapper = mount(ListGroupItem) expect(wrapper.is('div')).toBe(true) diff --git a/src/components/media/fixtures/media.html b/src/components/media/fixtures/media.html deleted file mode 100644 index 69d431cd513..00000000000 --- a/src/components/media/fixtures/media.html +++ /dev/null @@ -1,13 +0,0 @@ -
- - -
Center-aligned media
-

Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.

-

Donec sed odio dui. Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

- - - -
Center-aligned media
-

Donec sed odio dui. Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

- -
diff --git a/src/components/media/fixtures/media.js b/src/components/media/fixtures/media.js deleted file mode 100644 index 0bae7b95202..00000000000 --- a/src/components/media/fixtures/media.js +++ /dev/null @@ -1,3 +0,0 @@ -window.app = new Vue({ - el: '#app' -}) diff --git a/src/components/media/media-aside.spec.js b/src/components/media/media-aside.spec.js new file mode 100644 index 00000000000..27133a5a81b --- /dev/null +++ b/src/components/media/media-aside.spec.js @@ -0,0 +1,55 @@ +import MediaAside from './media-aside' +import { mount } from '@vue/test-utils' + +describe('media-aside', () => { + it('has expected default structure', async () => { + const wrapper = mount(MediaAside) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('d-flex') + expect(wrapper.classes()).toContain('align-self-top') + expect(wrapper.text()).toEqual('') + }) + + it('has custom root element when prop tag set', async () => { + const wrapper = mount(MediaAside, { + propsData: { + tag: 'span' + } + }) + + expect(wrapper.is('span')).toBe(true) + expect(wrapper.classes()).toContain('d-flex') + expect(wrapper.classes()).toContain('align-self-top') + expect(wrapper.classes().length).toBe(2) + expect(wrapper.text()).toEqual('') + }) + + it('has alignment class when prop vertical-align set', async () => { + const wrapper = mount(MediaAside, { + propsData: { + verticalAlign: 'bottom' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('d-flex') + expect(wrapper.classes()).toContain('align-self-bottom') + expect(wrapper.classes().length).toBe(2) + }) + + it('renders default slot content', async () => { + const wrapper = mount(MediaAside, { + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('d-flex') + expect(wrapper.classes()).toContain('align-self-top') + expect(wrapper.classes().length).toBe(2) + expect(wrapper.findAll('b').length).toBe(1) + expect(wrapper.find('b').text()).toBe('foobar') + }) +}) diff --git a/src/components/media/media-body.spec.js b/src/components/media/media-body.spec.js new file mode 100644 index 00000000000..c4cc92f670f --- /dev/null +++ b/src/components/media/media-body.spec.js @@ -0,0 +1,41 @@ +import MediaBody from './media-body' +import { mount } from '@vue/test-utils' + +describe('media-body', () => { + it('has expected default structure', async () => { + const wrapper = mount(MediaBody) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('media-body') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('') + }) + + it('custom root element when prop tag is set', async () => { + const wrapper = mount(MediaBody, { + propsData: { + tag: 'article' + } + }) + + expect(wrapper.is('article')).toBe(true) + expect(wrapper.classes()).toContain('media-body') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.text()).toEqual('') + }) + + it('renders default slot content', async () => { + const wrapper = mount(MediaBody, { + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('media-body') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('b').length).toBe(1) + expect(wrapper.find('b').text()).toEqual('foobar') + expect(wrapper.text()).toEqual('foobar') + }) +}) diff --git a/src/components/media/media.spec.js b/src/components/media/media.spec.js index 3827ed164c8..5dc493a0ade 100644 --- a/src/components/media/media.spec.js +++ b/src/components/media/media.spec.js @@ -1,6 +1,146 @@ -import { loadFixture, testVM } from '../../../tests/utils' +import Media from './media' +import { mount } from '@vue/test-utils' describe('media', () => { - beforeEach(loadFixture(__dirname, 'media')) - testVM() + it('has expected default structure', async () => { + const wrapper = mount(Media) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('media') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.media-body').length).toBe(1) + expect(wrapper.findAll('.d-flex').length).toBe(0) + expect(wrapper.text()).toEqual('') + // Should have only one child element + expect(wrapper.findAll('.media > *').length).toBe(1) + }) + + it('renders custom root element when tag prop set', async () => { + const wrapper = mount(Media, { + propsData: { + tag: 'section' + } + }) + + expect(wrapper.is('section')).toBe(true) + expect(wrapper.classes()).toContain('media') + expect(wrapper.classes().length).toBe(1) + }) + + it('has expected structure when slot aside present', async () => { + const wrapper = mount(Media, { + slots: { + aside: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('media') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.media-body').length).toBe(1) + expect(wrapper.findAll('.d-flex').length).toBe(1) + // Should have only two child elements + expect(wrapper.findAll('.media > *').length).toBe(2) + // Has expected child order + expect(wrapper.find('.media > .d-flex + .media-body').exists()).toBe(true) + expect(wrapper.find('.media > .media-body + .d-flex').exists()).toBe(false) + // Aside has extra classes + expect(wrapper.find('.d-flex').classes()).toContain('mr-3') + }) + + it('has expected structure when prop right-align is set and slot aside present', async () => { + const wrapper = mount(Media, { + propsData: { + rightAlign: true + }, + slots: { + aside: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('media') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.media-body').length).toBe(1) + expect(wrapper.findAll('.d-flex').length).toBe(1) + // Should have only two child elements + expect(wrapper.findAll('.media > *').length).toBe(2) + // Has expected child order + expect(wrapper.find('.media > .media-body + .d-flex').exists()).toBe(true) + expect(wrapper.find('.media > .d-flex + .media-body').exists()).toBe(false) + // Aside has extra classes + expect(wrapper.find('.d-flex').classes()).toContain('ml-3') + }) + + it('places default slot inside media-body', async () => { + const wrapper = mount(Media, { + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('media') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.media-body').length).toBe(1) + expect(wrapper.text()).toEqual('foobar') + expect(wrapper.find('.media-body').text()).toEqual('foobar') + }) + + it('does not have child media-body is prop no-body set', async () => { + const wrapper = mount(Media, { + propsData: { + noBody: true + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('media') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.media-body').length).toBe(0) + expect(wrapper.text()).toEqual('') + // Should have no child elements + expect(wrapper.findAll('.media > *').length).toBe(0) + }) + + it('places default slot inside self when no-body set', async () => { + const wrapper = mount(Media, { + propsData: { + noBody: true + }, + slots: { + default: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('media') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.media-body').length).toBe(0) + expect(wrapper.text()).toEqual('foobar') + }) + + it('sets vertialAlign prop on media-aside child', async () => { + const wrapper = mount(Media, { + propsData: { + verticalAlign: 'bottom' + }, + slots: { + aside: 'foobar' + } + }) + + expect(wrapper.is('div')).toBe(true) + expect(wrapper.classes()).toContain('media') + expect(wrapper.classes().length).toBe(1) + expect(wrapper.findAll('.media-body').length).toBe(1) + expect(wrapper.findAll('.d-flex').length).toBe(1) + expect(wrapper.text()).toEqual('foobar') + // Should have only two child elements + expect(wrapper.findAll('.media > *').length).toBe(2) + // Should have media aside with self align bottom + expect(wrapper.find('.d-flex').classes()).toContain('align-self-bottom') + // Should have content in aside + expect(wrapper.find('.d-flex').text()).toEqual('foobar') + }) }) diff --git a/src/components/nav/nav-item-dropdown.spec.js b/src/components/nav/nav-item-dropdown.spec.js new file mode 100644 index 00000000000..8de9df4c9a8 --- /dev/null +++ b/src/components/nav/nav-item-dropdown.spec.js @@ -0,0 +1,22 @@ +import NavItemDropdown from './nav-item-dropdown' +import { mount } from '@vue/test-utils' + +describe('nav-item-dropdown', () => { + it('should have custom toggle class in nav-item-dropdown', async () => { + const wrapper = mount(NavItemDropdown, { + propsData: { + text: 'toggle', + extraToggleClasses: 'nav-link-custom' + } + }) + expect(wrapper.isVueInstance()).toBe(true) + expect(wrapper.findAll('.dropdown-toggle').length).toBe(1) + const $toggle = wrapper.find('.dropdown-toggle') + + expect($toggle.classes()).toContain('nav-link') + expect($toggle.classes()).toContain('dropdown-toggle') + expect($toggle.classes()).toContain('nav-link-custom') + + wrapper.destroy() + }) +}) diff --git a/src/components/navbar/fixtures/navbar.html b/src/components/navbar/fixtures/navbar.html deleted file mode 100644 index 1020f72be52..00000000000 --- a/src/components/navbar/fixtures/navbar.html +++ /dev/null @@ -1,44 +0,0 @@ -
- - - - - - Bootstrap - - - - - Support - Docs - Contact Us - - - - - EN - - - ES - - - - - - Profile - - - Sign out - - - - CustomClassInNavLink - - - - - - -
diff --git a/src/components/navbar/fixtures/navbar.js b/src/components/navbar/fixtures/navbar.js deleted file mode 100644 index 0bae7b95202..00000000000 --- a/src/components/navbar/fixtures/navbar.js +++ /dev/null @@ -1,3 +0,0 @@ -window.app = new Vue({ - el: '#app' -}) diff --git a/src/components/navbar/navbar-dropdown.spec.js b/src/components/navbar/navbar-dropdown.spec.js deleted file mode 100644 index 49d8e5ca6d7..00000000000 --- a/src/components/navbar/navbar-dropdown.spec.js +++ /dev/null @@ -1,20 +0,0 @@ -import { loadFixture, testVM } from '../../../tests/utils' - -describe('navbar', () => { - beforeEach(loadFixture(__dirname, 'navbar')) - testVM() - - it('should have custom toggle class in nav-item-dropdown', async () => { - const { - app: { $refs } - } = window - const extraClass = $refs.extraToggleClasses - expect(extraClass).toBeDefined() - expect(extraClass.$refs.toggle).toBeDefined() - expect(extraClass.$refs.toggle).toHaveAllClasses([ - 'nav-link', - 'dropdown-toggle', - 'nav-link-custom' - ]) - }) -}) diff --git a/src/components/progress/fixtures/progress.html b/src/components/progress/fixtures/progress.html deleted file mode 100644 index 1bd2ae5cf16..00000000000 --- a/src/components/progress/fixtures/progress.html +++ /dev/null @@ -1,20 +0,0 @@ -
- - - - - - - - - - - - - - - - - Click me - -
diff --git a/src/components/progress/fixtures/progress.js b/src/components/progress/fixtures/progress.js deleted file mode 100644 index 9b84df99443..00000000000 --- a/src/components/progress/fixtures/progress.js +++ /dev/null @@ -1,11 +0,0 @@ -window.app = new Vue({ - el: '#app', - data: { - progress: Math.random() * 100 - }, - methods: { - clicked() { - this.progress = Math.random() * 100 - } - } -})