未验证 提交 e9549273 编写于 作者: J Joe Haddad 提交者: GitHub

[Fast Refresh] Separate LogBox Tests (#12564)

上级 d6b61d30
......@@ -4,7 +4,7 @@ import { sandbox } from './helpers'
jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000 * 60 * 5
test('basic: can edit a component without losing state', async () => {
test('can edit a component without losing state', async () => {
const [session, cleanup] = await sandbox()
await session.patch(
......@@ -59,62 +59,6 @@ test('basic: can edit a component without losing state', async () => {
await cleanup()
})
test('can recover from a syntax error without losing state', async () => {
const [session, cleanup] = await sandbox()
await session.patch(
'index.js',
`
import { useCallback, useState } from 'react'
export default function Index() {
const [count, setCount] = useState(0)
const increment = useCallback(() => setCount(c => c + 1), [setCount])
return (
<main>
<p>{count}</p>
<button onClick={increment}>Increment</button>
</main>
)
}
`
)
await session.evaluate(() => document.querySelector('button').click())
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('1')
await session.patch('index.js', `export default () => <div/`)
expect(await session.hasRedbox(true)).toBe(true)
expect(await session.getRedboxSource()).toMatch('SyntaxError')
await session.patch(
'index.js',
`
import { useCallback, useState } from 'react'
export default function Index() {
const [count, setCount] = useState(0)
const increment = useCallback(() => setCount(c => c + 1), [setCount])
return (
<main>
<p>Count: {count}</p>
<button onClick={increment}>Increment</button>
</main>
)
}
`
)
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('Count: 1')
await cleanup()
})
test('cyclic dependencies', async () => {
const [session, cleanup] = await sandbox()
......@@ -273,152 +217,3 @@ test('cyclic dependencies', async () => {
await cleanup()
})
test('logbox: can recover from a event handler error', async () => {
const [session, cleanup] = await sandbox()
await session.patch(
'index.js',
`
import { useCallback, useState } from 'react'
export default function Index() {
const [count, setCount] = useState(0)
const increment = useCallback(() => {
setCount(c => c + 1)
throw new Error('oops')
}, [setCount])
return (
<main>
<p>{count}</p>
<button onClick={increment}>Increment</button>
</main>
)
}
`
)
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('0')
await session.evaluate(() => document.querySelector('button').click())
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('1')
expect(await session.hasRedbox(true)).toBe(true)
expect(await session.getRedboxSource()).toMatchInlineSnapshot(`
"index.js (8:16) @ eval
6 | const increment = useCallback(() => {
7 | setCount(c => c + 1)
> 8 | throw new Error('oops')
| ^
9 | }, [setCount])
10 | return (
11 | <main>"
`)
await session.patch(
'index.js',
`
import { useCallback, useState } from 'react'
export default function Index() {
const [count, setCount] = useState(0)
const increment = useCallback(() => setCount(c => c + 1), [setCount])
return (
<main>
<p>Count: {count}</p>
<button onClick={increment}>Increment</button>
</main>
)
}
`
)
expect(await session.hasRedbox()).toBe(false)
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('Count: 1')
await session.evaluate(() => document.querySelector('button').click())
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('Count: 2')
expect(await session.hasRedbox()).toBe(false)
await cleanup()
})
test('logbox: can recover from a component error', async () => {
const [session, cleanup] = await sandbox()
await session.write(
'child.js',
`
export default function Child() {
return <p>Hello</p>;
}
`
)
await session.patch(
'index.js',
`
import Child from './child'
export default function Index() {
return (
<main>
<Child />
</main>
)
}
`
)
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('Hello')
await session.patch(
'child.js',
`
// hello
export default function Child() {
throw new Error('oops')
}
`
)
expect(await session.hasRedbox(true)).toBe(true)
expect(await session.getRedboxSource()).toMatchInlineSnapshot(`
"child.js (4:14) @ Child
2 | // hello
3 | export default function Child() {
> 4 | throw new Error('oops')
| ^
5 | }
6 | "
`)
const didNotReload = await session.patch(
'child.js',
`
export default function Child() {
return <p>Hello</p>;
}
`
)
expect(didNotReload).toBe(true)
expect(await session.hasRedbox()).toBe(false)
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('Hello')
await cleanup()
})
/* global jasmine */
/* eslint-env jest */
import { sandbox } from './helpers'
jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000 * 60 * 5
test('logbox: can recover from a syntax error without losing state', async () => {
const [session, cleanup] = await sandbox()
await session.patch(
'index.js',
`
import { useCallback, useState } from 'react'
export default function Index() {
const [count, setCount] = useState(0)
const increment = useCallback(() => setCount(c => c + 1), [setCount])
return (
<main>
<p>{count}</p>
<button onClick={increment}>Increment</button>
</main>
)
}
`
)
await session.evaluate(() => document.querySelector('button').click())
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('1')
await session.patch('index.js', `export default () => <div/`)
expect(await session.hasRedbox(true)).toBe(true)
expect(await session.getRedboxSource()).toMatch('SyntaxError')
await session.patch(
'index.js',
`
import { useCallback, useState } from 'react'
export default function Index() {
const [count, setCount] = useState(0)
const increment = useCallback(() => setCount(c => c + 1), [setCount])
return (
<main>
<p>Count: {count}</p>
<button onClick={increment}>Increment</button>
</main>
)
}
`
)
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('Count: 1')
expect(await session.hasRedbox()).toBe(false)
await cleanup()
})
test('logbox: can recover from a event handler error', async () => {
const [session, cleanup] = await sandbox()
await session.patch(
'index.js',
`
import { useCallback, useState } from 'react'
export default function Index() {
const [count, setCount] = useState(0)
const increment = useCallback(() => {
setCount(c => c + 1)
throw new Error('oops')
}, [setCount])
return (
<main>
<p>{count}</p>
<button onClick={increment}>Increment</button>
</main>
)
}
`
)
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('0')
await session.evaluate(() => document.querySelector('button').click())
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('1')
expect(await session.hasRedbox(true)).toBe(true)
expect(await session.getRedboxSource()).toMatchInlineSnapshot(`
"index.js (8:16) @ eval
6 | const increment = useCallback(() => {
7 | setCount(c => c + 1)
> 8 | throw new Error('oops')
| ^
9 | }, [setCount])
10 | return (
11 | <main>"
`)
await session.patch(
'index.js',
`
import { useCallback, useState } from 'react'
export default function Index() {
const [count, setCount] = useState(0)
const increment = useCallback(() => setCount(c => c + 1), [setCount])
return (
<main>
<p>Count: {count}</p>
<button onClick={increment}>Increment</button>
</main>
)
}
`
)
expect(await session.hasRedbox()).toBe(false)
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('Count: 1')
await session.evaluate(() => document.querySelector('button').click())
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('Count: 2')
expect(await session.hasRedbox()).toBe(false)
await cleanup()
})
test('logbox: can recover from a component error', async () => {
const [session, cleanup] = await sandbox()
await session.write(
'child.js',
`
export default function Child() {
return <p>Hello</p>;
}
`
)
await session.patch(
'index.js',
`
import Child from './child'
export default function Index() {
return (
<main>
<Child />
</main>
)
}
`
)
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('Hello')
await session.patch(
'child.js',
`
// hello
export default function Child() {
throw new Error('oops')
}
`
)
expect(await session.hasRedbox(true)).toBe(true)
expect(await session.getRedboxSource()).toMatchInlineSnapshot(`
"child.js (4:14) @ Child
2 | // hello
3 | export default function Child() {
> 4 | throw new Error('oops')
| ^
5 | }
6 | "
`)
const didNotReload = await session.patch(
'child.js',
`
export default function Child() {
return <p>Hello</p>;
}
`
)
expect(didNotReload).toBe(true)
expect(await session.hasRedbox()).toBe(false)
expect(
await session.evaluate(() => document.querySelector('p').textContent)
).toBe('Hello')
await cleanup()
})
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册