alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

[improvement] Collapse: improve accessibility

Browse Source
This commit is contained in:
陈嘉涵
2019-05-24 11:51:54 +08:00
parent fe7c0c38bf
commit 78fa587575
5 changed files with 31 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/collapse/test/__snapshots__/demo.spec.js.snap
+8 -8
View File
@@ -5,7 +5,7 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-collapse van-hairline--top-bottom">
<div class="van-collapse-item">
<div class="van-cell van-cell--clickable van-collapse-item__title van-collapse-item__title--expanded">
<div role="button" tabindex="0" aria-expanded="true" class="van-cell van-cell--clickable van-collapse-item__title van-collapse-item__title--expanded">
<div class="van-cell__title"><span>标题1</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
@@ -14,13 +14,13 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-collapse-item__title">
<div role="button" tabindex="0" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title">
<div class="van-cell__title"><span>标题2</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-collapse-item__title van-collapse-item__title--disabled">
<div role="button" tabindex="-1" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title van-collapse-item__title--disabled">
<div class="van-cell__title"><span>标题3</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
@@ -30,7 +30,7 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-collapse van-hairline--top-bottom">
<div class="van-collapse-item">
<div class="van-cell van-cell--clickable van-collapse-item__title van-collapse-item__title--expanded">
<div role="button" tabindex="0" aria-expanded="true" class="van-cell van-cell--clickable van-collapse-item__title van-collapse-item__title--expanded">
<div class="van-cell__title"><span>标题1</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
@@ -39,13 +39,13 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-collapse-item__title">
<div role="button" tabindex="0" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title">
<div class="van-cell__title"><span>标题2</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-collapse-item__title">
<div role="button" tabindex="0" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title">
<div class="van-cell__title"><span>标题3</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
@@ -55,7 +55,7 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-collapse van-hairline--top-bottom">
<div class="van-collapse-item">
<div class="van-cell van-cell--clickable van-collapse-item__title">
<div role="button" tabindex="0" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title">
<div class="van-cell__title">
<div>标题1<i class="van-icon van-icon-question-o">
<!----></i></div>
@@ -64,7 +64,7 @@ exports[`renders demo correctly 1`] = `
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-collapse-item__title"><i class="van-icon van-icon-shop-o van-cell__left-icon">
<div role="button" tabindex="0" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title"><i class="van-icon van-icon-shop-o van-cell__left-icon">
<!----></i>
<div class="van-cell__title"><span>标题2</span></div>
<div class="van-cell__value"><span>内容</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
packages/collapse/test/__snapshots__/index.spec.js.snap
+6 -6
View File
@@ -3,19 +3,19 @@
exports[`disable border 1`] = `
<div class="van-collapse">
<div class="van-collapse-item">
<div class="van-cell van-cell--clickable van-collapse-item__title">
<div role="button" tabindex="0" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title">
<div class="van-cell__title"><span>a</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-collapse-item__title">
<div role="button" tabindex="0" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title">
<div class="van-cell__title"><span>b</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
</div>
<div class="van-collapse-item van-hairline--top">
<div class="van-cell van-cell--clickable van-collapse-item__title">
<div role="button" tabindex="0" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title">
<div class="van-cell__title"><span>c</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
@@ -26,13 +26,13 @@ exports[`disable border 1`] = `
exports[`lazy render collapse content 1`] = `
<div class="van-collapse van-hairline--top-bottom">
<div class="van-collapse-item" style="padding: 0px;">
<div class="van-cell van-cell--clickable van-collapse-item__title">
<div role="button" tabindex="0" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title">
<div class="van-cell__title"><span>a</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
</div>
<div class="van-collapse-item van-hairline--top" style="padding: 0px;">
<div class="van-cell van-cell--clickable van-collapse-item__title van-collapse-item__title--expanded">
<div role="button" tabindex="0" aria-expanded="true" class="van-cell van-cell--clickable van-collapse-item__title van-collapse-item__title--expanded">
<div class="van-cell__title"><span>b</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
@@ -46,7 +46,7 @@ exports[`lazy render collapse content 1`] = `
exports[`render collapse-item slot 1`] = `
<div class="van-collapse van-hairline--top-bottom">
<div class="van-collapse-item">
<div class="van-cell van-cell--clickable van-collapse-item__title">this is icon<div class="van-cell__title">this is title</div>
<div role="button" tabindex="0" aria-expanded="false" class="van-cell van-cell--clickable van-collapse-item__title">this is icon<div class="van-cell__title">this is title</div>
<div class="van-cell__value">this is value</div>this is right icon
</div>
</div>