theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(transition): respect rules in *-leave-from transition class (#2597)

Browse Source 
fix #2593
This commit is contained in:
luwuer
2020-12-03 03:41:20 +08:00
committed by GitHub
parent 20a704fc04
commit e2618a632d
3 changed files with 28 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/vue/__tests__/Transition.spec.ts
View File

@@ -1305,9 +1305,10 @@ describe('e2e: Transition', () => {
await classWhenTransitionStart()
await nextFrame()
expect(await html('#container')).toBe(
'<div class="test v-leave-active v-leave-to">one</div>'
'<div class="test v-leave-active v-leave-to" style="">one</div>'
)
await transitionFinish()
await nextFrame()
expect(await html('#container')).toBe(
'<div class="test v-enter-active v-enter-to">two</div>'
)

19
packages/vue/__tests__/TransitionGroup.spec.ts
View File

@@ -8,6 +8,7 @@ describe('e2e: TransitionGroup', () => {
const duration = 50
const buffer = 5
const transitionDisableProp = `style="transition-property: none;"`
const htmlWhenTransitionStart = () =>
page().evaluate(() => {
@@ -106,15 +107,15 @@ describe('e2e: TransitionGroup', () => {
)
expect(await htmlWhenTransitionStart()).toBe(
`<div class="test test-leave-active test-leave-from">a</div>` +
`<div class="test test-leave-active test-leave-from" ${transitionDisableProp}>a</div>` +
`<div class="test">b</div>` +
`<div class="test test-leave-active test-leave-from">c</div>`
`<div class="test test-leave-active test-leave-from" ${transitionDisableProp}>c</div>`
)
await nextFrame()
expect(await html('#container')).toBe(
`<div class="test test-leave-active test-leave-to">a</div>` +
`<div class="test test-leave-active test-leave-to" style="">a</div>` +
`<div class="test">b</div>` +
`<div class="test test-leave-active test-leave-to">c</div>`
`<div class="test test-leave-active test-leave-to" style="">c</div>`
)
await transitionFinish()
expect(await html('#container')).toBe(`<div class="test">b</div>`)
@@ -150,14 +151,14 @@ describe('e2e: TransitionGroup', () => {
)
expect(await htmlWhenTransitionStart()).toBe(
`<div class="test test-leave-active test-leave-from">a</div>` +
`<div class="test test-leave-active test-leave-from" ${transitionDisableProp}>a</div>` +
`<div class="test">b</div>` +
`<div class="test">c</div>` +
`<div class="test test-enter-active test-enter-from">d</div>`
)
await nextFrame()
expect(await html('#container')).toBe(
`<div class="test test-leave-active test-leave-to">a</div>` +
`<div class="test test-leave-active test-leave-to" style="">a</div>` +
`<div class="test">b</div>` +
`<div class="test">c</div>` +
`<div class="test test-enter-active test-enter-to">d</div>`
@@ -278,7 +279,7 @@ describe('e2e: TransitionGroup', () => {
`<div class="test group-enter-active group-enter-from">d</div>` +
`<div class="test">b</div>` +
`<div class="test group-move" style="">a</div>` +
`<div class="test group-leave-active group-leave-from group-move" style="">c</div>`
`<div class="test group-leave-active group-leave-from group-move" ${transitionDisableProp}>c</div>`
)
await nextFrame()
expect(await html('#container')).toBe(
@@ -461,7 +462,7 @@ describe('e2e: TransitionGroup', () => {
// enter + leave
expect(await htmlWhenTransitionStart()).toBe(
`<div class="test test-leave-active test-leave-from">a</div>` +
`<div class="test test-leave-active test-leave-from" ${transitionDisableProp}>a</div>` +
`<div class="test">b</div>` +
`<div class="test">c</div>` +
`<div class="test test-enter-active test-enter-from">d</div>`
@@ -474,7 +475,7 @@ describe('e2e: TransitionGroup', () => {
expect(afterEnterSpy).not.toBeCalled()
await nextFrame()
expect(await html('#container')).toBe(
`<div class="test test-leave-active test-leave-to">a</div>` +
`<div class="test test-leave-active test-leave-to" style="">a</div>` +
`<div class="test">b</div>` +
`<div class="test">c</div>` +
`<div class="test test-enter-active test-enter-to">d</div>`