Trigger Option change on el-select element of element-ui with Vue Jest ( Vue Test Utils )

767 views Asked by At

I want to trigger option change for the el-select element of element-ui library, can anyone help how should i trigger it to change from option2 of default to option1 or something else using vue-test-utils with jest ?

I tried triggering 'change' event on el-select but nothing happens..

Below is how my rendered el-select element looks:

<div class="el-select testSelect">
  <div class="el-input el-input--suffix">
        <input type="text" readonly="readonly" autocomplete="off" placeholder="Select" class="el-input__inner">
        <span class="el-input__suffix"><span class="el-input__suffix-inner"><i
                    class="el-select__caret el-input__icon el-icon-arrow-up"></i>
            </span>
        </span>
    </div>
    <div class="el-select-dropdown el-popper" style="display: none;">
        <div class="el-scrollbar" style="">
            <div class="el-select-dropdown__wrap el-scrollbar__wrap el-scrollbar__wrap--hidden-default">
                <ul class="el-scrollbar__view el-select-dropdown__list">
                    <li class="el-select-dropdown__item"><span>Option1</span></li>
                    <li class="el-select-dropdown__item selected"><span>Option2</span></li>
                    <li class="el-select-dropdown__item"><span>Option3</span></li>
                    <li class="el-select-dropdown__item"><span>Option4</span></li>
                    <li class="el-select-dropdown__item"><span>Option5</span></li>
                </ul>
            </div>
            <div class="el-scrollbar__bar is-horizontal">
                <div class="el-scrollbar__thumb" style="transform: translateX(0%); webkit-transform: translateX(0%);">
                </div>
            </div>
            <div class="el-scrollbar__bar is-vertical">
                <div class="el-scrollbar__thumb" style="transform: translateY(0%); webkit-transform: translateY(0%);">
                </div>
            </div>
        </div>
    </div>
</div>

0

There are 0 answers