mirror of
https://github.com/element-plus/element-plus.git
synced 2026-03-13 07:51:17 +08:00
fix(components): [select] scrolling is not triggered when the option value is zero (#22578)
* fix(components): [select] scroll missing when first option value is zero * test: add case * test: update
This commit is contained in:
@@ -3740,4 +3740,46 @@ describe('Select', () => {
|
||||
await input.trigger('click')
|
||||
expect(selectVm.dropdownMenuVisible).toBeTruthy()
|
||||
})
|
||||
|
||||
test('should trigger scroll when option value is 0', async () => {
|
||||
wrapper = _mount(
|
||||
`
|
||||
<el-select v-model="value" :teleported="false">
|
||||
<el-option
|
||||
v-for="{ label, value } in options"
|
||||
:key="value"
|
||||
:label="label"
|
||||
:value="value"
|
||||
/>
|
||||
</el-select>`,
|
||||
() => ({
|
||||
options: Array.from({ length: 10 }).map((_, i) => ({
|
||||
label: `label-${i}`,
|
||||
value: i,
|
||||
})),
|
||||
value: '',
|
||||
})
|
||||
)
|
||||
|
||||
const select = wrapper.findComponent({ name: 'ElSelect' })
|
||||
const selectVm = select.vm as any
|
||||
const wrapEl = wrapper.find('.el-select-dropdown__wrap').element
|
||||
const optionEls = wrapper.findAll('.el-select-dropdown__item')
|
||||
const cleanup = optionEls.map((item, i) =>
|
||||
vi.spyOn(item.element, 'offsetTop', 'get').mockReturnValue(i * 30)
|
||||
)
|
||||
cleanup.push(
|
||||
vi.spyOn(wrapEl, 'clientHeight', 'get').mockReturnValue(5 * 30)
|
||||
)
|
||||
|
||||
const input = wrapper.find('input')
|
||||
await input.trigger('click')
|
||||
await input.trigger('keydown', { key: EVENT_CODE.up })
|
||||
expect(selectVm.states.hoveringIndex).toBe(9)
|
||||
expect(wrapEl.scrollTop).toBe(4 * 30)
|
||||
await input.trigger('keydown', { key: EVENT_CODE.down })
|
||||
expect(selectVm.states.hoveringIndex).toBe(0)
|
||||
expect(wrapEl.scrollTop).toBe(0)
|
||||
cleanup.forEach((fn) => fn())
|
||||
})
|
||||
})
|
||||
|
||||
@@ -7,7 +7,7 @@ import {
|
||||
watch,
|
||||
watchEffect,
|
||||
} from 'vue'
|
||||
import { findLastIndex, get, isEqual } from 'lodash-unified'
|
||||
import { findLastIndex, get, isEqual, isNil } from 'lodash-unified'
|
||||
import { useDebounceFn, useResizeObserver } from '@vueuse/core'
|
||||
import {
|
||||
ValidateComponentsMap,
|
||||
@@ -611,7 +611,7 @@ export const useSelect = (props: SelectProps, emit: SelectEmits) => {
|
||||
const targetOption = isArray(option) ? option[0] : option
|
||||
let target = null
|
||||
|
||||
if (targetOption?.value) {
|
||||
if (!isNil(targetOption?.value)) {
|
||||
const options = optionsArray.value.filter(
|
||||
(item) => item.value === targetOption.value
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user