test(Progress): fix snapshot

This commit is contained in:
chenjiahan 2021-08-25 17:38:19 +08:00 committed by neverland
parent cd56b602f1
commit 9f9380df7e
4 changed files with 78 additions and 45 deletions

View File

@ -190,7 +190,7 @@ export default defineComponent({
); );
const months = computed(() => { const months = computed(() => {
const months = []; const months: Date[] = [];
const cursor = new Date(props.minDate); const cursor = new Date(props.minDate);
cursor.setDate(1); cursor.setDate(1);

View File

@ -4,13 +4,13 @@ exports[`should render demo and match snapshot 1`] = `
<div> <div>
<div class="van-progress"> <div class="van-progress">
<span class="van-progress__portion" <span class="van-progress__portion"
style="width: 0px;" style="transform: scaleX(0.5);"
> >
<span style="left: 0px;" </span>
class="van-progress__pivot" <span style="left: 50%; transform: translate(-50%,-50%);"
> class="van-progress__pivot"
50% >
</span> 50%
</span> </span>
</div> </div>
</div> </div>
@ -19,62 +19,95 @@ exports[`should render demo and match snapshot 1`] = `
style="height: 8px;" style="height: 8px;"
> >
<span class="van-progress__portion" <span class="van-progress__portion"
style="width: 0px;" style="transform: scaleX(0.5);"
> >
<span style="left: 0px;" </span>
class="van-progress__pivot" <span style="left: 50%; transform: translate(-50%,-50%);"
> class="van-progress__pivot"
50% >
</span> 50%
</span> </span>
</div> </div>
</div> </div>
<div> <div>
<div class="van-progress"> <div class="van-progress">
<span class="van-progress__portion" <span class="van-progress__portion"
style="background: rgb(202, 202, 202); width: 0px;" style="background: rgb(202, 202, 202); transform: scaleX(0.5);"
> >
<span style="left: 0px; background: rgb(202, 202, 202);" </span>
class="van-progress__pivot" <span style="left: 50%; transform: translate(-50%,-50%); background: rgb(202, 202, 202);"
> class="van-progress__pivot"
50% >
</span> 50%
</span> </span>
</div> </div>
</div> </div>
<div> <div>
<div class="van-progress"> <div class="van-progress">
<span class="van-progress__portion" <span class="van-progress__portion"
style="background: rgb(242, 130, 106); width: 0px;" style="background: rgb(242, 130, 106); transform: scaleX(0.25);"
> >
<span style="left: 0px; background: rgb(242, 130, 106);" </span>
class="van-progress__pivot" <span style="left: 25%; transform: translate(-25%,-50%); background: rgb(242, 130, 106);"
> class="van-progress__pivot"
Orange >
</span> Orange
</span> </span>
</div> </div>
<div class="van-progress"> <div class="van-progress">
<span class="van-progress__portion" <span class="van-progress__portion"
style="background: rgb(238, 10, 36); width: 0px;" style="background: rgb(238, 10, 36); transform: scaleX(0.5);"
> >
<span style="left: 0px; background: rgb(238, 10, 36);" </span>
class="van-progress__pivot" <span style="left: 50%; transform: translate(-50%,-50%); background: rgb(238, 10, 36);"
> class="van-progress__pivot"
Red >
</span> Red
</span> </span>
</div> </div>
<div class="van-progress"> <div class="van-progress">
<span class="van-progress__portion" <span class="van-progress__portion"
style="width: 0px;" style="transform: scaleX(0.75);"
> >
<span style="left: 0px; background: rgb(114, 50, 221);"
class="van-progress__pivot"
>
Purple
</span>
</span> </span>
<span style="left: 75%; transform: translate(-75%,-50%); background: rgb(114, 50, 221);"
class="van-progress__pivot"
>
Purple
</span>
</div>
</div>
<div>
<div class="van-progress">
<span class="van-progress__portion"
style="background: rgb(202, 202, 202); transform: scaleX(0);"
>
</span>
<span style="left: 0%; transform: translate(-0%,-50%); background: rgb(202, 202, 202);"
class="van-progress__pivot"
>
0%
</span>
</div>
<div style="display: flex; justify-content: space-around;">
<button type="button"
class="van-button van-button--default van-button--normal"
>
<div class="van-button__content">
<span class="van-button__text">
decrease
</span>
</div>
</button>
<button type="button"
class="van-button van-button--default van-button--normal"
>
<div class="van-button__content">
<span class="van-button__text">
increase
</span>
</div>
</button>
</div> </div>
</div> </div>
`; `;

View File

@ -3,7 +3,7 @@
exports[`should re-calc width if showing pivot dynamically 1`] = ` exports[`should re-calc width if showing pivot dynamically 1`] = `
<div class="van-progress"> <div class="van-progress">
<span class="van-progress__portion" <span class="van-progress__portion"
style="width: 0px;" style="transform: scaleX(1);"
> >
</span> </span>
</div> </div>
@ -12,13 +12,13 @@ exports[`should re-calc width if showing pivot dynamically 1`] = `
exports[`should re-calc width if showing pivot dynamically 2`] = ` exports[`should re-calc width if showing pivot dynamically 2`] = `
<div class="van-progress"> <div class="van-progress">
<span class="van-progress__portion" <span class="van-progress__portion"
style="width: 0px;" style="transform: scaleX(1);"
> >
<span style="left: 0px;" </span>
class="van-progress__pivot" <span style="left: 100%; transform: translate(-100%,-50%);"
> class="van-progress__pivot"
test >
</span> test
</span> </span>
</div> </div>
`; `;

View File

@ -123,7 +123,7 @@ export default defineComponent({
return slots[status]!({ distance }); return slots[status]!({ distance });
} }
const nodes = []; const nodes: JSX.Element[] = [];
if (TEXT_STATUS.includes(status)) { if (TEXT_STATUS.includes(status)) {
nodes.push(<div class={bem('text')}>{getStatusText()}</div>); nodes.push(<div class={bem('text')}>{getStatusText()}</div>);