mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
fix(AddressEdit): should expose setAreaCode method
This commit is contained in:
chenjiahan
parent
dc93ef3f20
commit
6a184f8e93
@ -294,6 +294,7 @@ export default createComponent({
|
|||||||
|
|
||||||
useExpose({
|
useExpose({
|
||||||
getArea,
|
getArea,
|
||||||
|
setAreaCode,
|
||||||
setAddressDetail,
|
setAddressDetail,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@ -1,297 +0,0 @@
|
|||||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
||||||
|
|
||||||
exports[`create a AddressEdit 1`] = `
|
|
||||||
<div class="van-address-edit">
|
|
||||||
<div class="van-address-edit__fields">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>姓名</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" placeholder="收货人姓名" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>电话</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="tel" placeholder="收货人手机号" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>地区</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" readonly="readonly" placeholder="选择省 / 市 / 区" class="van-field__control">
|
|
||||||
<div class="van-field__right-icon"><i class="van-icon van-icon-arrow">
|
|
||||||
<!----></i></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-address-edit-detail">
|
|
||||||
<div class="van-cell__value van-cell__value--alone">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>详细地址</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><textarea rows="1" placeholder="街道门牌、楼层房间号等信息" class="van-field__control"></textarea></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!---->
|
|
||||||
<div class="van-address-edit__buttons"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round">
|
|
||||||
<div class="van-button__content"><span class="van-button__text">保存</span></div>
|
|
||||||
</button></div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`create a AddressEdit with props 1`] = `
|
|
||||||
<div class="van-address-edit">
|
|
||||||
<div class="van-address-edit__fields">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>姓名</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" placeholder="收货人姓名" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>电话</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="tel" placeholder="收货人手机号" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>地区</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" readonly="readonly" placeholder="选择省 / 市 / 区" class="van-field__control">
|
|
||||||
<div class="van-field__right-icon"><i class="van-icon van-icon-arrow">
|
|
||||||
<!----></i></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-address-edit-detail">
|
|
||||||
<div class="van-cell__value van-cell__value--alone">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>详细地址</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><textarea rows="1" placeholder="街道门牌、楼层房间号等信息" class="van-field__control"></textarea></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>邮政编码</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="tel" placeholder="邮政编码" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-cell--center van-address-edit__default">
|
|
||||||
<div class="van-cell__title"><span>设为默认收货地址</span></div>
|
|
||||||
<div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 24px;">
|
|
||||||
<div class="van-switch__node"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-address-edit__buttons"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round">
|
|
||||||
<div class="van-button__content"><span class="van-button__text">保存</span></div>
|
|
||||||
</button></div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`set-default 1`] = `
|
|
||||||
<div class="van-address-edit">
|
|
||||||
<div class="van-address-edit__fields">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>姓名</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" placeholder="收货人姓名" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>电话</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="tel" placeholder="收货人手机号" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>地区</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" readonly="readonly" placeholder="选择省 / 市 / 区" class="van-field__control">
|
|
||||||
<div class="van-field__right-icon"><i class="van-icon van-icon-arrow">
|
|
||||||
<!----></i></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-address-edit-detail">
|
|
||||||
<div class="van-cell__value van-cell__value--alone">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>详细地址</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><textarea rows="1" placeholder="街道门牌、楼层房间号等信息" class="van-field__control"></textarea></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>邮政编码</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="tel" placeholder="邮政编码" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-cell--center van-address-edit__default">
|
|
||||||
<div class="van-cell__title"><span>设为默认收货地址</span></div>
|
|
||||||
<div role="switch" aria-checked="false" class="van-switch" style="font-size: 24px;">
|
|
||||||
<div class="van-switch__node"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-address-edit__buttons"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round">
|
|
||||||
<div class="van-button__content"><span class="van-button__text">保存</span></div>
|
|
||||||
</button></div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`show area component 1`] = `
|
|
||||||
<div class="van-address-edit">
|
|
||||||
<div class="van-address-edit__fields">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>姓名</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" placeholder="收货人姓名" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>电话</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="tel" placeholder="收货人手机号" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>地区</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" readonly="readonly" placeholder="选择省 / 市 / 区" class="van-field__control">
|
|
||||||
<div class="van-field__right-icon"><i class="van-icon van-icon-arrow">
|
|
||||||
<!----></i></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-address-edit-detail">
|
|
||||||
<div class="van-cell__value van-cell__value--alone">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>详细地址</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><textarea rows="1" placeholder="街道门牌、楼层房间号等信息" class="van-field__control" style="height: auto;"></textarea></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>邮政编码</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="tel" placeholder="邮政编码" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-cell--center van-address-edit__default">
|
|
||||||
<div class="van-cell__title"><span>设为默认收货地址</span></div>
|
|
||||||
<div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 24px;">
|
|
||||||
<div class="van-switch__node"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-address-edit__buttons"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round">
|
|
||||||
<div class="van-button__content"><span class="van-button__text">保存</span></div>
|
|
||||||
</button></div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`show area component 2`] = `
|
|
||||||
<div class="van-address-edit">
|
|
||||||
<div class="van-address-edit__fields">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>姓名</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" placeholder="收货人姓名" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>电话</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="tel" placeholder="收货人手机号" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>地区</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" readonly="readonly" placeholder="选择省 / 市 / 区" class="van-field__control">
|
|
||||||
<div class="van-field__right-icon"><i class="van-icon van-icon-arrow">
|
|
||||||
<!----></i></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-address-edit-detail">
|
|
||||||
<div class="van-cell__value van-cell__value--alone">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>详细地址</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><textarea rows="1" placeholder="街道门牌、楼层房间号等信息" class="van-field__control" style="height: auto;"></textarea></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>邮政编码</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="tel" placeholder="邮政编码" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-cell--center van-address-edit__default">
|
|
||||||
<div class="van-cell__title"><span>设为默认收货地址</span></div>
|
|
||||||
<div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 24px;">
|
|
||||||
<div class="van-switch__node"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-address-edit__buttons"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round">
|
|
||||||
<div class="van-button__content"><span class="van-button__text">保存</span></div>
|
|
||||||
</button></div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
|
|
||||||
exports[`valid area placeholder confirm 1`] = `
|
|
||||||
<div class="van-address-edit">
|
|
||||||
<div class="van-address-edit__fields">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>姓名</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" placeholder="收货人姓名" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>电话</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="tel" placeholder="收货人手机号" class="van-field__control"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>地区</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><input type="text" readonly="readonly" placeholder="选择省 / 市 / 区" class="van-field__control">
|
|
||||||
<div class="van-field__right-icon"><i class="van-icon van-icon-arrow">
|
|
||||||
<!----></i></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="van-cell van-address-edit-detail">
|
|
||||||
<div class="van-cell__value van-cell__value--alone">
|
|
||||||
<div class="van-cell van-field">
|
|
||||||
<div class="van-cell__title van-field__label"><span>详细地址</span></div>
|
|
||||||
<div class="van-cell__value van-field__value">
|
|
||||||
<div class="van-field__body"><textarea rows="1" placeholder="街道门牌、楼层房间号等信息" class="van-field__control" style="height: auto;"></textarea></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!---->
|
|
||||||
<div class="van-address-edit__buttons"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round">
|
|
||||||
<div class="van-button__content"><span class="van-button__text">保存</span></div>
|
|
||||||
</button></div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
211
src/address-edit/test/__snapshots__/index.spec.js.snap
Normal file
211
src/address-edit/test/__snapshots__/index.spec.js.snap
Normal file
@ -0,0 +1,211 @@
|
|||||||
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
|
exports[`should allow to custom validator with validator prop 1`] = `
|
||||||
|
<div class="van-field__error-message">
|
||||||
|
foo name
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`should render AddressEdit correctly 1`] = `
|
||||||
|
<div class="van-address-edit">
|
||||||
|
<div class="van-address-edit__fields">
|
||||||
|
<div class="van-cell van-field">
|
||||||
|
<div class="van-cell__title van-field__label">
|
||||||
|
<span>
|
||||||
|
姓名
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell__value van-field__value">
|
||||||
|
<div class="van-field__body">
|
||||||
|
<input type="text"
|
||||||
|
class="van-field__control"
|
||||||
|
placeholder="收货人姓名"
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell van-field">
|
||||||
|
<div class="van-cell__title van-field__label">
|
||||||
|
<span>
|
||||||
|
电话
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell__value van-field__value">
|
||||||
|
<div class="van-field__body">
|
||||||
|
<input type="tel"
|
||||||
|
class="van-field__control"
|
||||||
|
placeholder="收货人手机号"
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell van-cell--clickable van-field"
|
||||||
|
role="button"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div class="van-cell__title van-field__label">
|
||||||
|
<span>
|
||||||
|
地区
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell__value van-field__value">
|
||||||
|
<div class="van-field__body">
|
||||||
|
<input type="text"
|
||||||
|
class="van-field__control"
|
||||||
|
readonly
|
||||||
|
placeholder="选择省 / 市 / 区"
|
||||||
|
>
|
||||||
|
<div class="van-field__right-icon">
|
||||||
|
<i class="van-badge__wrapper van-icon van-icon-arrow">
|
||||||
|
</i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell van-field van-address-edit-detail">
|
||||||
|
<div class="van-cell__title van-field__label">
|
||||||
|
<span>
|
||||||
|
详细地址
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell__value van-field__value">
|
||||||
|
<div class="van-field__body">
|
||||||
|
<textarea rows="1"
|
||||||
|
class="van-field__control"
|
||||||
|
placeholder="街道门牌、楼层房间号等信息"
|
||||||
|
>
|
||||||
|
</textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="van-address-edit__buttons">
|
||||||
|
<button type="button"
|
||||||
|
class="van-button van-button--danger van-button--normal van-button--block van-button--round"
|
||||||
|
>
|
||||||
|
<div class="van-button__content">
|
||||||
|
<span class="van-button__text">
|
||||||
|
保存
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`should render AddressEdit with props correctly 1`] = `
|
||||||
|
<div class="van-address-edit">
|
||||||
|
<div class="van-address-edit__fields">
|
||||||
|
<div class="van-cell van-field">
|
||||||
|
<div class="van-cell__title van-field__label">
|
||||||
|
<span>
|
||||||
|
姓名
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell__value van-field__value">
|
||||||
|
<div class="van-field__body">
|
||||||
|
<input type="text"
|
||||||
|
class="van-field__control"
|
||||||
|
placeholder="收货人姓名"
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell van-field">
|
||||||
|
<div class="van-cell__title van-field__label">
|
||||||
|
<span>
|
||||||
|
电话
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell__value van-field__value">
|
||||||
|
<div class="van-field__body">
|
||||||
|
<input type="tel"
|
||||||
|
class="van-field__control"
|
||||||
|
placeholder="收货人手机号"
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell van-cell--clickable van-field"
|
||||||
|
role="button"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div class="van-cell__title van-field__label">
|
||||||
|
<span>
|
||||||
|
地区
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell__value van-field__value">
|
||||||
|
<div class="van-field__body">
|
||||||
|
<input type="text"
|
||||||
|
class="van-field__control"
|
||||||
|
readonly
|
||||||
|
placeholder="选择省 / 市 / 区"
|
||||||
|
>
|
||||||
|
<div class="van-field__right-icon">
|
||||||
|
<i class="van-badge__wrapper van-icon van-icon-arrow">
|
||||||
|
</i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell van-field van-address-edit-detail">
|
||||||
|
<div class="van-cell__title van-field__label">
|
||||||
|
<span>
|
||||||
|
详细地址
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell__value van-field__value">
|
||||||
|
<div class="van-field__body">
|
||||||
|
<textarea rows="1"
|
||||||
|
class="van-field__control"
|
||||||
|
placeholder="街道门牌、楼层房间号等信息"
|
||||||
|
>
|
||||||
|
</textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell van-field">
|
||||||
|
<div class="van-cell__title van-field__label">
|
||||||
|
<span>
|
||||||
|
邮政编码
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell__value van-field__value">
|
||||||
|
<div class="van-field__body">
|
||||||
|
<input type="tel"
|
||||||
|
class="van-field__control"
|
||||||
|
placeholder="邮政编码"
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="van-cell van-cell--center van-address-edit__default">
|
||||||
|
<div class="van-cell__title">
|
||||||
|
<span>
|
||||||
|
设为默认收货地址
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div role="switch"
|
||||||
|
class="van-switch van-switch--on"
|
||||||
|
style="font-size: 24px;"
|
||||||
|
aria-checked="true"
|
||||||
|
>
|
||||||
|
<div class="van-switch__node">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="van-address-edit__buttons">
|
||||||
|
<button type="button"
|
||||||
|
class="van-button van-button--danger van-button--normal van-button--block van-button--round"
|
||||||
|
>
|
||||||
|
<div class="van-button__content">
|
||||||
|
<span class="van-button__text">
|
||||||
|
保存
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
@ -1,322 +0,0 @@
|
|||||||
import AddressEdit from '..';
|
|
||||||
import areaList from '../../area/demo/area-simple';
|
|
||||||
import { mount, later, trigger } from '../../../test';
|
|
||||||
|
|
||||||
const addressInfo = {
|
|
||||||
name: '测试',
|
|
||||||
tel: '13000000000',
|
|
||||||
province: '北京市',
|
|
||||||
city: '北京市',
|
|
||||||
county: '朝阳区',
|
|
||||||
addressDetail: '详细地址',
|
|
||||||
areaCode: '110101',
|
|
||||||
postalCode: '10000',
|
|
||||||
isDefault: true,
|
|
||||||
};
|
|
||||||
|
|
||||||
const createComponent = () => {
|
|
||||||
const wrapper = mount(AddressEdit, {
|
|
||||||
props: {
|
|
||||||
areaList,
|
|
||||||
addressInfo,
|
|
||||||
showPostal: true,
|
|
||||||
showSetDefault: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const button = wrapper.find('.van-button');
|
|
||||||
const field = wrapper.findAll('.van-field__control');
|
|
||||||
const { errorInfo, data } = wrapper.vm;
|
|
||||||
return {
|
|
||||||
vm: wrapper.vm,
|
|
||||||
data,
|
|
||||||
field,
|
|
||||||
button,
|
|
||||||
wrapper,
|
|
||||||
errorInfo,
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
test('create a AddressEdit', () => {
|
|
||||||
expect(mount(AddressEdit)).toMatchSnapshot();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('create a AddressEdit with props', () => {
|
|
||||||
const wrapper = mount(AddressEdit, {
|
|
||||||
props: {
|
|
||||||
areaList,
|
|
||||||
addressInfo,
|
|
||||||
showPostal: true,
|
|
||||||
showSetDefault: true,
|
|
||||||
showSearchResult: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(wrapper.html()).toMatchSnapshot();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('valid area placeholder confirm', async () => {
|
|
||||||
const wrapper = mount(AddressEdit, {
|
|
||||||
props: {
|
|
||||||
areaList,
|
|
||||||
areaColumnsPlaceholder: ['请选择', '请选择', '请选择'],
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const { data } = wrapper.vm;
|
|
||||||
|
|
||||||
wrapper.find('.van-picker__confirm').trigger('click');
|
|
||||||
|
|
||||||
expect(data.areaCode).toBe('');
|
|
||||||
await later(50);
|
|
||||||
expect(wrapper.html()).toMatchSnapshot();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('show area component', async () => {
|
|
||||||
const { wrapper } = createComponent();
|
|
||||||
|
|
||||||
const field = wrapper.findAll('.van-field')[2];
|
|
||||||
field.trigger('click');
|
|
||||||
|
|
||||||
await later(50);
|
|
||||||
expect(wrapper.html()).toMatchSnapshot();
|
|
||||||
|
|
||||||
wrapper.find('.van-picker__cancel').trigger('click');
|
|
||||||
|
|
||||||
await later(50);
|
|
||||||
expect(wrapper.html()).toMatchSnapshot();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('set-default', () => {
|
|
||||||
const { wrapper } = createComponent();
|
|
||||||
wrapper.find('.van-switch').trigger('click');
|
|
||||||
|
|
||||||
expect(wrapper.html()).toMatchSnapshot();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('validator props', async () => {
|
|
||||||
const wrapper = mount(AddressEdit, {
|
|
||||||
props: {
|
|
||||||
areaList,
|
|
||||||
validator(key, value) {
|
|
||||||
return `${key}${value}`;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const { errorInfo, data } = wrapper.vm;
|
|
||||||
data.name = '';
|
|
||||||
const button = wrapper.find('.van-button');
|
|
||||||
button.trigger('click');
|
|
||||||
|
|
||||||
expect(errorInfo.name).toBeTruthy();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('valid name', () => {
|
|
||||||
const { data, field, button, errorInfo } = createComponent();
|
|
||||||
|
|
||||||
// name empty
|
|
||||||
data.name = '';
|
|
||||||
button.trigger('click');
|
|
||||||
expect(errorInfo.name).toBeTruthy();
|
|
||||||
field[0].trigger('focus');
|
|
||||||
expect(errorInfo.name).toBeFalsy();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('valid tel', () => {
|
|
||||||
const { data, field, button, errorInfo } = createComponent();
|
|
||||||
data.tel = '';
|
|
||||||
button.trigger('click');
|
|
||||||
expect(errorInfo.tel).toBeTruthy();
|
|
||||||
field[1].trigger('focus');
|
|
||||||
expect(errorInfo.tel).toBeFalsy();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('valid areaCode', () => {
|
|
||||||
const { data, button, errorInfo } = createComponent();
|
|
||||||
// areaCode empty
|
|
||||||
data.areaCode = '';
|
|
||||||
button.trigger('click');
|
|
||||||
expect(errorInfo.areaCode).toBeTruthy();
|
|
||||||
|
|
||||||
// areaCode invalid
|
|
||||||
data.areaCode = '-1';
|
|
||||||
button.trigger('click');
|
|
||||||
expect(errorInfo.areaCode).toBeTruthy();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('valid addressDetail', () => {
|
|
||||||
const { data, field, button, errorInfo } = createComponent();
|
|
||||||
data.addressDetail = '';
|
|
||||||
button.trigger('click');
|
|
||||||
expect(errorInfo.addressDetail).toBeTruthy();
|
|
||||||
field[3].trigger('focus');
|
|
||||||
expect(errorInfo.addressDetail).toBeFalsy();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('valid postal code', () => {
|
|
||||||
const { vm, data, field, button, errorInfo } = createComponent();
|
|
||||||
|
|
||||||
// postalCode invalid
|
|
||||||
data.postalCode = '123';
|
|
||||||
button.trigger('click');
|
|
||||||
expect(errorInfo.postalCode).toBeTruthy();
|
|
||||||
field[4].trigger('focus');
|
|
||||||
expect(errorInfo.postalCode).toBeFalsy();
|
|
||||||
|
|
||||||
// valid result
|
|
||||||
data.postalCode = '123456';
|
|
||||||
button.trigger('click');
|
|
||||||
|
|
||||||
// not show postalCode
|
|
||||||
data.postalCode = '156';
|
|
||||||
vm.showPostal = false;
|
|
||||||
button.trigger('click');
|
|
||||||
expect(errorInfo.postalCode).toBeFalsy();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('on change detail', () => {
|
|
||||||
const wrapper = mount(AddressEdit);
|
|
||||||
const field = wrapper.findAll('.van-field__control')[3];
|
|
||||||
|
|
||||||
field.element.value = '123';
|
|
||||||
field.trigger('input');
|
|
||||||
expect(wrapper.emitted('change-detail')[0][0]).toEqual('123');
|
|
||||||
});
|
|
||||||
|
|
||||||
test('watch address info', () => {
|
|
||||||
const wrapper = mount(AddressEdit);
|
|
||||||
wrapper.setProps({ addressInfo: { name: '123' } });
|
|
||||||
expect(wrapper.vm.data.name).toEqual('123');
|
|
||||||
});
|
|
||||||
|
|
||||||
test('set/get area code', async () => {
|
|
||||||
const wrapper = mount(AddressEdit, {
|
|
||||||
props: { areaList },
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(wrapper.vm.getArea()).toEqual([
|
|
||||||
{ code: '110000', name: '北京市' },
|
|
||||||
{ code: '110100', name: '北京市' },
|
|
||||||
{ code: '110101', name: '东城区' },
|
|
||||||
]);
|
|
||||||
|
|
||||||
wrapper.vm.setAreaCode('110102');
|
|
||||||
|
|
||||||
await later(50);
|
|
||||||
expect(wrapper.vm.data.areaCode).toEqual('110102');
|
|
||||||
expect(wrapper.vm.getArea()).toEqual([
|
|
||||||
{ code: '110000', name: '北京市' },
|
|
||||||
{ code: '110100', name: '北京市' },
|
|
||||||
{ code: '110102', name: '西城区' },
|
|
||||||
]);
|
|
||||||
|
|
||||||
wrapper.vm.$refs = [];
|
|
||||||
wrapper.vm.setAreaCode('110102');
|
|
||||||
expect(wrapper.vm.getArea()).toEqual([]);
|
|
||||||
});
|
|
||||||
|
|
||||||
test('watch area code', async () => {
|
|
||||||
const wrapper = mount(AddressEdit, {
|
|
||||||
props: {
|
|
||||||
areaList: {},
|
|
||||||
addressInfo: {
|
|
||||||
areaCode: '110101',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
expect(wrapper.vm.data.city).toEqual('');
|
|
||||||
wrapper.vm.areaList = areaList;
|
|
||||||
|
|
||||||
await later(50);
|
|
||||||
expect(wrapper.vm.data.city).toEqual('北京市');
|
|
||||||
});
|
|
||||||
|
|
||||||
test('show search result', async () => {
|
|
||||||
const wrapper = mount(AddressEdit, {
|
|
||||||
props: {
|
|
||||||
showSearchResult: true,
|
|
||||||
searchResult: [
|
|
||||||
{ name: 'name1', address: 'address1' },
|
|
||||||
{ name: 'name2' },
|
|
||||||
{ address: 'address2' },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const field = wrapper.findAll('.van-field__control')[3];
|
|
||||||
const input = field.element;
|
|
||||||
field.trigger('focus');
|
|
||||||
|
|
||||||
const items = wrapper.findAll('.van-icon-location-o');
|
|
||||||
items[0].element.parentNode.click();
|
|
||||||
expect(input.value).toEqual('address1 name1');
|
|
||||||
items[1].element.parentNode.click();
|
|
||||||
expect(input.value).toEqual('name2');
|
|
||||||
items[2].element.parentNode.click();
|
|
||||||
expect(input.value).toEqual('address2');
|
|
||||||
|
|
||||||
field.trigger('blur');
|
|
||||||
await later(150);
|
|
||||||
expect(wrapper.vm.detailFocused).toBeFalsy();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('delete address', async () => {
|
|
||||||
const wrapper = mount(AddressEdit, {
|
|
||||||
attachToDocument: true,
|
|
||||||
props: {
|
|
||||||
showDelete: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const deleteButton = wrapper.findAll('.van-button')[1];
|
|
||||||
deleteButton.trigger('click');
|
|
||||||
|
|
||||||
await later();
|
|
||||||
document.querySelector('.van-dialog__cancel').click();
|
|
||||||
deleteButton.trigger('click');
|
|
||||||
document.querySelector('.van-dialog__confirm').click();
|
|
||||||
|
|
||||||
await later();
|
|
||||||
expect(wrapper.emitted('delete')).toBeTruthy();
|
|
||||||
expect(wrapper.emitted('cancel-delete')).toBeTruthy();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('setAddressDetail method', () => {
|
|
||||||
const { vm, data } = createComponent();
|
|
||||||
vm.setAddressDetail('test');
|
|
||||||
expect(data.addressDetail).toEqual('test');
|
|
||||||
});
|
|
||||||
|
|
||||||
test('select area', () => {
|
|
||||||
const { wrapper, data } = createComponent();
|
|
||||||
wrapper.find('.van-picker__confirm').trigger('click');
|
|
||||||
expect(data.areaCode).toEqual('110101');
|
|
||||||
});
|
|
||||||
|
|
||||||
test('click-area event', () => {
|
|
||||||
const wrapper = mount(AddressEdit, {
|
|
||||||
props: {
|
|
||||||
disableArea: true,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const field = wrapper.findAll('.van-field')[2];
|
|
||||||
field.trigger('click');
|
|
||||||
expect(wrapper.emitted('click-area')[0]).toBeTruthy();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('tel-maxlength prop', () => {
|
|
||||||
const wrapper = mount(AddressEdit, {
|
|
||||||
props: {
|
|
||||||
telMaxlength: 4,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const telInput = wrapper.find('input[type="tel"]');
|
|
||||||
telInput.element.value = '123456';
|
|
||||||
trigger(telInput, 'input');
|
|
||||||
|
|
||||||
expect(telInput.element.value).toEqual('1234');
|
|
||||||
});
|
|
||||||
278
src/address-edit/test/index.spec.js
Normal file
278
src/address-edit/test/index.spec.js
Normal file
@ -0,0 +1,278 @@
|
|||||||
|
import AddressEdit from '..';
|
||||||
|
import areaList from '../../area/demo/area-simple';
|
||||||
|
import { mount, later, trigger } from '../../../test';
|
||||||
|
|
||||||
|
const addressInfo = {
|
||||||
|
name: '测试',
|
||||||
|
tel: '13000000000',
|
||||||
|
province: '北京市',
|
||||||
|
city: '北京市',
|
||||||
|
county: '朝阳区',
|
||||||
|
addressDetail: 'address detail',
|
||||||
|
areaCode: '110101',
|
||||||
|
postalCode: '10000',
|
||||||
|
isDefault: true,
|
||||||
|
};
|
||||||
|
|
||||||
|
const createComponent = () => {
|
||||||
|
const wrapper = mount(AddressEdit, {
|
||||||
|
props: {
|
||||||
|
areaList,
|
||||||
|
addressInfo,
|
||||||
|
showPostal: true,
|
||||||
|
showSetDefault: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const button = wrapper.find('.van-button');
|
||||||
|
const field = wrapper.findAll('.van-field__control');
|
||||||
|
return {
|
||||||
|
vm: wrapper.vm,
|
||||||
|
field,
|
||||||
|
button,
|
||||||
|
wrapper,
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
test('should render AddressEdit correctly', () => {
|
||||||
|
expect(mount(AddressEdit).html()).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should render AddressEdit with props correctly', () => {
|
||||||
|
const wrapper = mount(AddressEdit, {
|
||||||
|
props: {
|
||||||
|
areaList,
|
||||||
|
addressInfo,
|
||||||
|
showPostal: true,
|
||||||
|
showSetDefault: true,
|
||||||
|
showSearchResult: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(wrapper.html()).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
|
||||||
|
// test('set-default', () => {
|
||||||
|
// const { wrapper } = createComponent();
|
||||||
|
// wrapper.find('.van-switch').trigger('click');
|
||||||
|
|
||||||
|
// expect(wrapper.html()).toMatchSnapshot();
|
||||||
|
// });
|
||||||
|
|
||||||
|
test('should allow to custom validator with validator prop', async () => {
|
||||||
|
const wrapper = mount(AddressEdit, {
|
||||||
|
props: {
|
||||||
|
areaList,
|
||||||
|
validator: (key, value) => `foo ${key}${value}`,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const button = wrapper.find('.van-button');
|
||||||
|
await button.trigger('click');
|
||||||
|
expect(wrapper.find('.van-field__error-message').html()).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
|
||||||
|
// test('should valid name', () => {
|
||||||
|
// const { data, field, button, errorInfo } = createComponent();
|
||||||
|
|
||||||
|
// // name empty
|
||||||
|
// data.name = '';
|
||||||
|
// button.trigger('click');
|
||||||
|
// expect(errorInfo.name).toBeTruthy();
|
||||||
|
// field[0].trigger('focus');
|
||||||
|
// expect(errorInfo.name).toBeFalsy();
|
||||||
|
// });
|
||||||
|
|
||||||
|
// test('valid tel', () => {
|
||||||
|
// const { data, field, button, errorInfo } = createComponent();
|
||||||
|
// data.tel = '';
|
||||||
|
// button.trigger('click');
|
||||||
|
// expect(errorInfo.tel).toBeTruthy();
|
||||||
|
// field[1].trigger('focus');
|
||||||
|
// expect(errorInfo.tel).toBeFalsy();
|
||||||
|
// });
|
||||||
|
|
||||||
|
// test('valid areaCode', () => {
|
||||||
|
// const { data, button, errorInfo } = createComponent();
|
||||||
|
// // areaCode empty
|
||||||
|
// data.areaCode = '';
|
||||||
|
// button.trigger('click');
|
||||||
|
// expect(errorInfo.areaCode).toBeTruthy();
|
||||||
|
|
||||||
|
// // areaCode invalid
|
||||||
|
// data.areaCode = '-1';
|
||||||
|
// button.trigger('click');
|
||||||
|
// expect(errorInfo.areaCode).toBeTruthy();
|
||||||
|
// });
|
||||||
|
|
||||||
|
// test('valid addressDetail', () => {
|
||||||
|
// const { data, field, button, errorInfo } = createComponent();
|
||||||
|
// data.addressDetail = '';
|
||||||
|
// button.trigger('click');
|
||||||
|
// expect(errorInfo.addressDetail).toBeTruthy();
|
||||||
|
// field[3].trigger('focus');
|
||||||
|
// expect(errorInfo.addressDetail).toBeFalsy();
|
||||||
|
// });
|
||||||
|
|
||||||
|
// test('valid postal code', () => {
|
||||||
|
// const { vm, data, field, button, errorInfo } = createComponent();
|
||||||
|
|
||||||
|
// // postalCode invalid
|
||||||
|
// data.postalCode = '123';
|
||||||
|
// button.trigger('click');
|
||||||
|
// expect(errorInfo.postalCode).toBeTruthy();
|
||||||
|
// field[4].trigger('focus');
|
||||||
|
// expect(errorInfo.postalCode).toBeFalsy();
|
||||||
|
|
||||||
|
// // valid result
|
||||||
|
// data.postalCode = '123456';
|
||||||
|
// button.trigger('click');
|
||||||
|
|
||||||
|
// // not show postalCode
|
||||||
|
// data.postalCode = '156';
|
||||||
|
// vm.showPostal = false;
|
||||||
|
// button.trigger('click');
|
||||||
|
// expect(errorInfo.postalCode).toBeFalsy();
|
||||||
|
// });
|
||||||
|
|
||||||
|
// test('on change detail', () => {
|
||||||
|
// const wrapper = mount(AddressEdit);
|
||||||
|
// const field = wrapper.findAll('.van-field__control')[3];
|
||||||
|
|
||||||
|
// field.element.value = '123';
|
||||||
|
// field.trigger('input');
|
||||||
|
// expect(wrapper.emitted('change-detail')[0][0]).toEqual('123');
|
||||||
|
// });
|
||||||
|
|
||||||
|
// test('watch address info', () => {
|
||||||
|
// const wrapper = mount(AddressEdit);
|
||||||
|
// wrapper.setProps({ addressInfo: { name: '123' } });
|
||||||
|
// expect(wrapper.vm.data.name).toEqual('123');
|
||||||
|
// });
|
||||||
|
|
||||||
|
test('set/get area code', async () => {
|
||||||
|
const wrapper = mount(AddressEdit, {
|
||||||
|
props: { areaList },
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(wrapper.vm.getArea()).toEqual([
|
||||||
|
{ code: '110000', name: '北京市' },
|
||||||
|
{ code: '110100', name: '北京市' },
|
||||||
|
{ code: '110101', name: '东城区' },
|
||||||
|
]);
|
||||||
|
|
||||||
|
wrapper.vm.setAreaCode('110102');
|
||||||
|
|
||||||
|
await later(50);
|
||||||
|
expect(wrapper.vm.data.areaCode).toEqual('110102');
|
||||||
|
expect(wrapper.vm.getArea()).toEqual([
|
||||||
|
{ code: '110000', name: '北京市' },
|
||||||
|
{ code: '110100', name: '北京市' },
|
||||||
|
{ code: '110102', name: '西城区' },
|
||||||
|
]);
|
||||||
|
|
||||||
|
wrapper.vm.$refs = [];
|
||||||
|
wrapper.vm.setAreaCode('110102');
|
||||||
|
expect(wrapper.vm.getArea()).toEqual([]);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should show search result after focusing to address detail', async () => {
|
||||||
|
const wrapper = mount(AddressEdit, {
|
||||||
|
props: {
|
||||||
|
showSearchResult: true,
|
||||||
|
searchResult: [
|
||||||
|
{ name: 'name1', address: 'address1' },
|
||||||
|
{ name: 'name2' },
|
||||||
|
{ address: 'address2' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const field = wrapper.findAll('.van-field__control')[3];
|
||||||
|
const input = field.element;
|
||||||
|
await field.trigger('focus');
|
||||||
|
|
||||||
|
const items = wrapper.findAll('.van-icon-location-o');
|
||||||
|
items[0].element.parentNode.click();
|
||||||
|
await later();
|
||||||
|
expect(input.value).toEqual('address1 name1');
|
||||||
|
|
||||||
|
items[1].element.parentNode.click();
|
||||||
|
await later();
|
||||||
|
expect(input.value).toEqual('name2');
|
||||||
|
|
||||||
|
items[2].element.parentNode.click();
|
||||||
|
await later();
|
||||||
|
expect(input.value).toEqual('address2');
|
||||||
|
|
||||||
|
await field.trigger('blur');
|
||||||
|
await later(150);
|
||||||
|
expect(wrapper.vm.detailFocused).toBeFalsy();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should emit delete event after clicking the delete button', async () => {
|
||||||
|
const wrapper = mount(AddressEdit, {
|
||||||
|
props: {
|
||||||
|
showDelete: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const deleteButton = wrapper.findAll('.van-button')[1];
|
||||||
|
deleteButton.trigger('click');
|
||||||
|
await later();
|
||||||
|
document.querySelector('.van-dialog__confirm').click();
|
||||||
|
await later();
|
||||||
|
expect(wrapper.emitted('delete')).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should emit cancel-delete event after canceling deletion', async () => {
|
||||||
|
const wrapper = mount(AddressEdit, {
|
||||||
|
props: {
|
||||||
|
showDelete: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const deleteButton = wrapper.findAll('.van-button')[1];
|
||||||
|
deleteButton.trigger('click');
|
||||||
|
await later();
|
||||||
|
document.querySelector('.van-dialog__cancel').click();
|
||||||
|
await later();
|
||||||
|
expect(wrapper.emitted('cancel-delete')).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should update address detail after calling the setAddressDetail method', async () => {
|
||||||
|
const { vm, wrapper } = createComponent();
|
||||||
|
const textarea = wrapper.find('.van-address-edit-detail').find('textarea');
|
||||||
|
|
||||||
|
expect(textarea.element.value).toEqual('address detail');
|
||||||
|
|
||||||
|
vm.setAddressDetail('test');
|
||||||
|
await later();
|
||||||
|
expect(textarea.element.value).toEqual('test');
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should emit click-area event after clicking the area field', () => {
|
||||||
|
const wrapper = mount(AddressEdit, {
|
||||||
|
props: {
|
||||||
|
disableArea: true,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const field = wrapper.findAll('.van-field')[2];
|
||||||
|
field.trigger('click');
|
||||||
|
expect(wrapper.emitted('click-area')[0]).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('should limit tel maxlength when using tel-maxlength prop', () => {
|
||||||
|
const wrapper = mount(AddressEdit, {
|
||||||
|
props: {
|
||||||
|
telMaxlength: 4,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const telInput = wrapper.find('input[type="tel"]');
|
||||||
|
telInput.element.value = '123456';
|
||||||
|
trigger(telInput, 'input');
|
||||||
|
|
||||||
|
expect(telInput.element.value).toEqual('1234');
|
||||||
|
});
|
||||||
Loading…
x
Reference in New Issue
Block a user