mirror of https://gitee.com/antv-l7/antv-l7
106 lines
2.9 KiB
TypeScript
106 lines
2.9 KiB
TypeScript
import { TestScene } from '@antv/l7-test-utils';
|
|
import SelectControl from '../src/control/baseControl/selectControl';
|
|
import { createL7Icon } from '../src/utils/icon';
|
|
|
|
class SingleControl extends SelectControl {
|
|
public getDefault(option: any): any {
|
|
return {
|
|
...super.getDefault(option),
|
|
options: [
|
|
{
|
|
icon: createL7Icon('icon-1'),
|
|
label: '1',
|
|
value: '1',
|
|
},
|
|
{
|
|
icon: createL7Icon('icon-2'),
|
|
label: '2',
|
|
value: '2',
|
|
},
|
|
],
|
|
defaultValue: '2',
|
|
};
|
|
}
|
|
|
|
protected getIsMultiple(): boolean {
|
|
return false;
|
|
}
|
|
}
|
|
|
|
class MultiControl extends SelectControl {
|
|
public getDefault(option: any): any {
|
|
return {
|
|
...super.getDefault(option),
|
|
options: [
|
|
{
|
|
img: '1',
|
|
label: '1',
|
|
value: '1',
|
|
},
|
|
{
|
|
img: '1',
|
|
label: '2',
|
|
value: '2',
|
|
},
|
|
],
|
|
defaultValue: ['2'],
|
|
};
|
|
}
|
|
protected getIsMultiple(): boolean {
|
|
return true;
|
|
}
|
|
}
|
|
|
|
describe('selectControl', () => {
|
|
const scene = TestScene();
|
|
|
|
it('life cycle', () => {
|
|
const control = new SingleControl({});
|
|
scene.addControl(control);
|
|
|
|
const container = control.getContainer();
|
|
expect(container.parentElement).toBeInstanceOf(HTMLElement);
|
|
|
|
scene.removeControl(control);
|
|
expect(container.parentElement).not.toBeInstanceOf(HTMLElement);
|
|
});
|
|
|
|
it('normal single select', () => {
|
|
const control = new SingleControl({});
|
|
scene.addControl(control);
|
|
|
|
expect(control.getSelectValue()).toEqual('2');
|
|
const popperContainer = control.getPopper().getContent() as HTMLDivElement;
|
|
const optionDomList = Array.from(
|
|
popperContainer.querySelectorAll('.l7-select-control-item'),
|
|
) as HTMLDivElement[];
|
|
expect(optionDomList).toHaveLength(2);
|
|
expect(optionDomList[0].getAttribute('data-option-value')).toEqual('1');
|
|
expect(optionDomList[0].getAttribute('data-option-index')).toEqual('0');
|
|
|
|
optionDomList[0].click();
|
|
|
|
expect(control.getSelectValue()).toEqual('1');
|
|
});
|
|
|
|
it('img multiple select', () => {
|
|
const control = new MultiControl({});
|
|
scene.addControl(control);
|
|
expect(control.getSelectValue()).toEqual(['2']);
|
|
const popperContainer = control.getPopper().getContent() as HTMLDivElement;
|
|
const optionDomList = Array.from(
|
|
popperContainer.querySelectorAll('.l7-select-control-item'),
|
|
) as HTMLDivElement[];
|
|
expect(optionDomList).toHaveLength(2);
|
|
expect(optionDomList[0].getAttribute('data-option-value')).toEqual('1');
|
|
expect(optionDomList[0].getAttribute('data-option-index')).toEqual('0');
|
|
expect(popperContainer.querySelectorAll('img')).toHaveLength(2);
|
|
|
|
optionDomList[0].click();
|
|
expect(control.getSelectValue()).toEqual(['2', '1']);
|
|
optionDomList[0].click();
|
|
optionDomList[1].click();
|
|
expect(control.getSelectValue()).toEqual([]);
|
|
});
|
|
});
|