mirror of
https://github.com/tenrok/vue-select.git
synced 2026-06-22 10:30:34 +03:00
tests(helpers): type output of helpers
This commit is contained in:
@@ -1,14 +1,16 @@
|
|||||||
import { mount, shallowMount } from '@vue/test-utils'
|
import { mount, VueWrapper } from '@vue/test-utils'
|
||||||
import VueSelect from '@/components/Select.vue'
|
import VueSelect from '@/components/Select.vue'
|
||||||
|
|
||||||
|
type WrappedVueSelect = VueWrapper<InstanceType<typeof VueSelect>>
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Trigger a submit event on the search
|
* Trigger a submit event on the search
|
||||||
* input with a provided search text.
|
* input with a provided search text.
|
||||||
*
|
|
||||||
* @param Wrapper {Wrapper<Vue>}
|
|
||||||
* @param searchText
|
|
||||||
*/
|
*/
|
||||||
export const searchSubmit = async (Wrapper, searchText = undefined) => {
|
export const searchSubmit = async (
|
||||||
|
Wrapper: WrappedVueSelect,
|
||||||
|
searchText?: string
|
||||||
|
) => {
|
||||||
await Wrapper.get('input').trigger('focus')
|
await Wrapper.get('input').trigger('focus')
|
||||||
|
|
||||||
if (searchText) {
|
if (searchText) {
|
||||||
@@ -22,18 +24,18 @@ export const searchSubmit = async (Wrapper, searchText = undefined) => {
|
|||||||
/**
|
/**
|
||||||
* Focus the search input
|
* Focus the search input
|
||||||
*/
|
*/
|
||||||
export const searchFocus = async (Wrapper) => {
|
export const searchFocus = async (Wrapper: WrappedVueSelect) => {
|
||||||
await Wrapper.get('input').trigger('focus')
|
await Wrapper.get('input').trigger('focus')
|
||||||
await Wrapper.vm.$nextTick()
|
await Wrapper.vm.$nextTick()
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Focus the input, enter some search text, hit return.
|
* Focus the input, enter some search text, hit return.
|
||||||
* @param Wrapper {Wrapper<Vue>}
|
|
||||||
* @param searchText
|
|
||||||
* @return {Promise<void>}
|
|
||||||
*/
|
*/
|
||||||
export const selectTag = async (Wrapper, searchText) => {
|
export const selectTag = async (
|
||||||
|
Wrapper: WrappedVueSelect,
|
||||||
|
searchText: string
|
||||||
|
) => {
|
||||||
Wrapper.vm.$refs.search.focus()
|
Wrapper.vm.$refs.search.focus()
|
||||||
await Wrapper.vm.$nextTick()
|
await Wrapper.vm.$nextTick()
|
||||||
|
|
||||||
@@ -46,20 +48,15 @@ export const selectTag = async (Wrapper, searchText) => {
|
|||||||
/**
|
/**
|
||||||
* Create a new VueSelect instance with
|
* Create a new VueSelect instance with
|
||||||
* a provided set of props.
|
* a provided set of props.
|
||||||
* @param props
|
|
||||||
* @returns {Wrapper<Vue>}
|
|
||||||
*/
|
*/
|
||||||
export const selectWithProps = (props = {}) => {
|
export const selectWithProps = (props = {}): WrappedVueSelect => {
|
||||||
return mount(VueSelect, { props })
|
return mount(VueSelect, { props })
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Returns a Wrapper with a v-select component.
|
* Returns a Wrapper with a v-select component.
|
||||||
* @param props
|
|
||||||
* @param options
|
|
||||||
* @return {Wrapper<Vue>}
|
|
||||||
*/
|
*/
|
||||||
export const mountDefault = (props = {}, options = {}) => {
|
export const mountDefault = (props = {}, options = {}): WrappedVueSelect => {
|
||||||
return mount(VueSelect, {
|
return mount(VueSelect, {
|
||||||
props: {
|
props: {
|
||||||
options: ['one', 'two', 'three'],
|
options: ['one', 'two', 'three'],
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
import { it, describe, expect } from 'vitest'
|
import { it, describe, expect } from 'vitest'
|
||||||
import { mountDefault } from '@tests/helpers.js'
|
import { mountDefault } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('Search Slot Scope', () => {
|
describe('Search Slot Scope', () => {
|
||||||
/**
|
/**
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { it, describe, expect } from 'vitest'
|
import { it, describe, expect } from 'vitest'
|
||||||
import { selectWithProps } from '@tests/helpers.js'
|
import { selectWithProps } from '@tests/helpers.ts'
|
||||||
import { shallowMount } from '@vue/test-utils'
|
import { shallowMount } from '@vue/test-utils'
|
||||||
import vSelect from '@/components/Select.vue'
|
import vSelect from '@/components/Select.vue'
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { it, describe, expect, vi, afterEach } from 'vitest'
|
import { it, describe, expect, vi, afterEach } from 'vitest'
|
||||||
import pointerScroll from '@/mixins/pointerScroll.js'
|
import pointerScroll from '@/mixins/pointerScroll.js'
|
||||||
import { mountDefault } from '@tests/helpers.js'
|
import { mountDefault } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('Automatic Scrolling', () => {
|
describe('Automatic Scrolling', () => {
|
||||||
let spy
|
let spy
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { it, describe, expect } from 'vitest'
|
import { it, describe, expect } from 'vitest'
|
||||||
import { defineComponent } from 'vue'
|
import { defineComponent } from 'vue'
|
||||||
import { selectWithProps } from '@tests/helpers.js'
|
import { selectWithProps } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('Components API', () => {
|
describe('Components API', () => {
|
||||||
it('swap the Deselect component', () => {
|
it('swap the Deselect component', () => {
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { it, describe, expect } from 'vitest'
|
import { it, describe, expect } from 'vitest'
|
||||||
import { selectTag, selectWithProps } from '@tests/helpers.js'
|
import { selectTag, selectWithProps } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('CreateOption When Tagging Is Enabled', () => {
|
describe('CreateOption When Tagging Is Enabled', () => {
|
||||||
it('can select the current search text as a string', async () => {
|
it('can select the current search text as a string', async () => {
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { it, describe, expect, vi } from 'vitest'
|
import { it, describe, expect, vi } from 'vitest'
|
||||||
import { mountDefault, selectWithProps } from '@tests/helpers.js'
|
import { mountDefault, selectWithProps } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('Removing values', () => {
|
describe('Removing values', () => {
|
||||||
it('can remove the given tag when its close icon is clicked', async () => {
|
it('can remove the given tag when its close icon is clicked', async () => {
|
||||||
|
|||||||
@@ -1,7 +1,8 @@
|
|||||||
import { it, describe, expect, vi, afterEach } from 'vitest'
|
import { it, describe, expect, vi, afterEach } from 'vitest'
|
||||||
import { selectWithProps } from '@tests/helpers.js'
|
import { selectWithProps } from '@tests/helpers.ts'
|
||||||
import OpenIndicator from '@/components/OpenIndicator.vue'
|
import OpenIndicator from '@/components/OpenIndicator.vue'
|
||||||
import VueSelect from '@/components/Select.vue'
|
import VueSelect from '@/components/Select.vue'
|
||||||
|
import DropdownMenu from '@/components/DropdownMenu.vue'
|
||||||
|
|
||||||
const preventDefault = vi.fn()
|
const preventDefault = vi.fn()
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { it, describe, expect, vi, afterEach } from 'vitest'
|
import { it, describe, expect, vi, afterEach } from 'vitest'
|
||||||
import typeAheadPointer from '@/mixins/typeAheadPointer.js'
|
import typeAheadPointer from '@/mixins/typeAheadPointer.js'
|
||||||
import { mountDefault } from '@tests/helpers.js'
|
import { mountDefault } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('Custom Keydown Handlers', () => {
|
describe('Custom Keydown Handlers', () => {
|
||||||
let spy
|
let spy
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { it, describe, expect, vi } from 'vitest'
|
import { it, describe, expect, vi } from 'vitest'
|
||||||
import { mount } from '@vue/test-utils'
|
import { mount } from '@vue/test-utils'
|
||||||
import VueSelect from '@/components/Select.vue'
|
import VueSelect from '@/components/Select.vue'
|
||||||
import { selectWithProps } from '@tests/helpers.js'
|
import { selectWithProps } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('Labels', () => {
|
describe('Labels', () => {
|
||||||
it('can generate labels using a custom label key', () => {
|
it('can generate labels using a custom label key', () => {
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { it, describe, expect, vi, afterEach } from 'vitest'
|
import { it, describe, expect, vi, afterEach } from 'vitest'
|
||||||
import { shallowMount } from '@vue/test-utils'
|
import { shallowMount } from '@vue/test-utils'
|
||||||
import VueSelect from '@/components/Select.vue'
|
import VueSelect from '@/components/Select.vue'
|
||||||
import { mountDefault } from '@tests/helpers.js'
|
import { mountDefault } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('Reset on options change', () => {
|
describe('Reset on options change', () => {
|
||||||
it('should not reset the selected value by default when the options property changes', async () => {
|
it('should not reset the selected value by default when the options property changes', async () => {
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { it, describe, expect } from 'vitest'
|
import { it, describe, expect } from 'vitest'
|
||||||
import { mount, shallowMount } from '@vue/test-utils'
|
import { mount, shallowMount } from '@vue/test-utils'
|
||||||
import VueSelect from '@/components/Select.vue'
|
import VueSelect from '@/components/Select.vue'
|
||||||
import { mountDefault } from '@tests/helpers.js'
|
import { mountDefault } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('When reduce prop is defined', () => {
|
describe('When reduce prop is defined', () => {
|
||||||
it('determines when a reducer has been supplied', async () => {
|
it('determines when a reducer has been supplied', async () => {
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { it, describe, expect } from 'vitest'
|
import { it, describe, expect } from 'vitest'
|
||||||
import { searchSubmit, selectWithProps } from '@tests/helpers.js'
|
import { searchSubmit, selectWithProps } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('Selectable prop', () => {
|
describe('Selectable prop', () => {
|
||||||
it('should select selectable option if clicked', async () => {
|
it('should select selectable option if clicked', async () => {
|
||||||
|
|||||||
@@ -2,7 +2,7 @@ import { it, describe, expect, vi, beforeEach, afterEach } from 'vitest'
|
|||||||
import { mount } from '@vue/test-utils'
|
import { mount } from '@vue/test-utils'
|
||||||
import VueSelect from '@/components/Select.vue'
|
import VueSelect from '@/components/Select.vue'
|
||||||
import typeAheadPointer from '@/mixins/typeAheadPointer.js'
|
import typeAheadPointer from '@/mixins/typeAheadPointer.js'
|
||||||
import { mountDefault } from '@tests/helpers.js'
|
import { mountDefault } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('VS - Selecting Values', () => {
|
describe('VS - Selecting Values', () => {
|
||||||
let defaultProps
|
let defaultProps
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { it, test, describe, expect, vi } from 'vitest'
|
import { it, test, describe, expect, vi } from 'vitest'
|
||||||
import { h } from 'vue'
|
import { h } from 'vue'
|
||||||
import { mountDefault } from '@tests/helpers.js'
|
import { mountDefault } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('Scoped Slots', () => {
|
describe('Scoped Slots', () => {
|
||||||
it('receives an option object to the selected-option-container slot', () => {
|
it('receives an option object to the selected-option-container slot', () => {
|
||||||
|
|||||||
@@ -4,7 +4,7 @@ import {
|
|||||||
searchSubmit,
|
searchSubmit,
|
||||||
selectTag,
|
selectTag,
|
||||||
selectWithProps,
|
selectWithProps,
|
||||||
} from '@tests/helpers.js'
|
} from '@tests/helpers.ts'
|
||||||
import VueSelect from '@/components/Select.vue'
|
import VueSelect from '@/components/Select.vue'
|
||||||
|
|
||||||
describe('When Tagging Is Enabled', () => {
|
describe('When Tagging Is Enabled', () => {
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { it, describe, expect } from 'vitest'
|
import { it, describe, expect } from 'vitest'
|
||||||
import { shallowMount } from '@vue/test-utils'
|
import { shallowMount } from '@vue/test-utils'
|
||||||
import VueSelect from '@/components/Select.vue'
|
import VueSelect from '@/components/Select.vue'
|
||||||
import { mountDefault } from '@tests/helpers.js'
|
import { mountDefault } from '@tests/helpers.ts'
|
||||||
|
|
||||||
describe('Moving the Typeahead Pointer', () => {
|
describe('Moving the Typeahead Pointer', () => {
|
||||||
it('should set the pointer to zero when the filteredOptions watcher is called', async () => {
|
it('should set the pointer to zero when the filteredOptions watcher is called', async () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user