TL;DR：执行顺序
- 顶层和describe() 块中的所有内容（其中describe() 块基本上是IIFE）
-
之前所有（）
- 顶级
- 第一级描述()
- 第N级describe()
-
在每个()之前
- 顶级
- 第一级描述()
- 第N级describe()
- 测试()
-
每个之后（）
- 第N级describe()
- 第一级描述()
- 顶级
-
毕竟（）
- 第N级describe()
- 第一级描述()
- 顶级
免责声明
我假设您对笑话和单元测试有基本的了解。我不会解释钩子的含义。这更像是备忘单/参考类型的帖子。
有规则
乍一看，笑话似乎有神奇的作用。什么时候执行什么？但如果你想一想，它就会显而易见不那么令人困惑。
也许这些简单的“规则”有帮助：
- 每个文件都是独立执行的：您在 A.test.js 中所做的任何操作都不会影响 B.test.js。 （除非你开始访问外部资源）
-
describe() 回调会立即执行。
- 钩子（beforeAll/afterAll、beforeEach/afterEach）从外部作用域（顶级/模块）到内部作用域（描述）执行。
基本示例
console.log("./<start>");
beforeAll(() => {
console.log("./beforeAll");
})
beforeEach(() => {
console.log("./beforeEach");
})
afterAll(() => {
console.log("./afterAll");
})
afterEach(() => {
console.log("./afterEach");
})
describe("foo", () => {
console.log("./describe(foo)/<start>");
beforeAll(() => {
console.log("./describe(foo)/beforeAll");
})
beforeEach(() => {
console.log("./describe(foo)/beforeEach");
})
afterAll(() => {
console.log("./describe(foo)/afterAll");
})
afterEach(() => {
console.log("./describe(foo)/afterEach");
})
test("testFoo", () => {
console.log("./describe(foo)/test(testFoo)");
})
console.log("./describe(foo)/<end>");
})
describe("bar", () => {
console.log("./describe(bar)/<start>");
beforeAll(() => {
console.log("./describe(bar)/beforeAll");
})
beforeEach(() => {
console.log("./describe(bar)/beforeEach");
})
afterAll(() => {
console.log("./describe(bar)/afterAll");
})
afterEach(() => {
console.log("./describe(bar)/afterEach");
})
test("testBar", () => {
console.log("./describe(bar)/test(testBar)");
})
test("testOtherBar", () => {
console.log("./describe(bar)/test(testOtherBar)");
})
console.log("./describe(bar)/<end>");
})
console.log("./<end>");
登录后复制
这是结果（在我删除其他输出后）：
./<start>
./describe(foo)/<start>
./describe(foo)/<end>
./describe(bar)/<start>
./describe(bar)/<end>
./<end>
./beforeAll
./describe(foo)/beforeAll
./beforeEach
./describe(foo)/beforeEach
./describe(foo)/test(testFoo)
./describe(foo)/afterEach
./afterEach
./describe(foo)/afterAll
./describe(bar)/beforeAll
./beforeEach
./describe(bar)/beforeEach
./describe(bar)/test(testBar)
./describe(bar)/afterEach
./afterEach
./beforeEach
./describe(bar)/beforeEach
./describe(bar)/test(testOtherBar)
./describe(bar)/afterEach
./afterEach
./describe(bar)/afterAll
./afterAll
登录后复制
会发生什么？
顶层和描述回调中的所有内容都会立即执行：
./<start>
./describe(foo)/<start>
./describe(foo)/<end>
./describe(bar)/<start>
./describe(bar)/<end>
./<end>
[...]
登录后复制
顶层的 beforeAll 和 afterAll 是所有测试的“支撑”。每个只执行一次。
[...]
./beforeAll
[...]
./afterAll
登录后复制
./describe(*)/beforeAll 和 ./describe(*)/afterAll 是 that 描述回调中所有测试的大括号。每个只执行一次。
[...]
./describe(foo)/beforeAll
[...]
./describe(foo)/afterAll
./describe(bar)/beforeAll
[...]
./describe(bar)/afterAll
[...]
登录后复制
beforeEach 和 afterEach 是每个测试周围的大括号。最顶层是外层大括号。描述级别是内部大括号。
[...]
./beforeEach
./describe(*)/beforeEach
[...]
./describe(*)/afterEach
./afterEach
[...]
登录后复制
高级版
这是一个带有嵌套描述块的高级示例。它生成 XMLish 结果来强调执行步骤的分层性质。
console.log("<top-level>");
beforeAll(() => {
console.log("<all>");
})
beforeEach(() => {
console.log("<each>");
})
afterAll(() => {
console.log("</all>");
})
afterEach(() => {
console.log("</each>");
})
describe("foo", () => {
console.log("<describe id=\"foo\">");
beforeAll(() => {
console.log("<all in=\"foo\">");
})
beforeEach(() => {
console.log("<each in=\"foo\">");
})
afterAll(() => {
console.log("</all> <!-- in=\"foo\" -->");
})
afterEach(() => {
console.log("</each> <!-- in=\"foo\" -->");
})
test("testFoo", () => {
console.log("<test in=\"foo\" id=\"testFoo\" />");
})
console.log("</describe> <!-- id=\"foo\" -->");
})
describe("bar", () => {
describe("barinner", () => {
console.log("<describe id=\"barinner\">");
beforeAll(() => {
console.log("<all in=\"barinner\">");
})
beforeEach(() => {
console.log("<each in=\"barinner\">");
})
afterAll(() => {
console.log("</all> <!-- in=\"barinner\" -->");
})
afterEach(() => {
console.log("</each> <!-- in=\"barinner\" -->");
})
test("testBarInner", () => {
console.log("<test in=\"barinner\" id=\"testBarInner\" />");
})
console.log("</describe> <!-- id=\"barinner\" -->");
})
console.log("<describe id=\"bar\">");
beforeAll(() => {
console.log("<all in=\"bar\">");
})
beforeEach(() => {
console.log("<each in=\"bar\">");
})
afterAll(() => {
console.log("</all> <!-- in=\"bar\" -->");
})
afterEach(() => {
console.log("</each> <!-- in=\"bar\" -->");
})
test("testBar", () => {
console.log("<test in=\"bar\" id=\"testBar\" />");
})
test("testOtherBar", () => {
console.log("<test in=\"bar\" id=\"testOtherBar\" />");
})
console.log("</describe> <!-- id=\"bar\" -->");
})
console.log("</top-level>");
登录后复制
这是经过一些清理和格式化后的输出：
<top-level>
<describe id="foo">
</describe> <!-- id="foo" -->
<describe id="barinner">
</describe> <!-- id="barinner" -->
<describe id="bar">
</describe> <!-- id="bar" -->
</top-level>
<all>
<all in="foo">
<each>
<each in="foo">
<test in="foo" id="testFoo" />
</each> <!-- in="foo" -->
</each>
</all> <!-- in="foo" -->
<all in="bar">
<all in="barinner">
<each>
<each in="bar">
<each in="barinner">
<test in="barinner" id="testBarInner" />
</each> <!-- in="barinner" -->
</each> <!-- in="bar" -->
</each>
</all> <!-- in="barinner" -->
<each>
<each in="bar">
<test in="bar" id="testBar" />
</each> <!-- in="bar" -->
</each>
<each>
<each in="bar">
<test in="bar" id="otherBar" />
</each> <!-- in="bar" -->
</each>
</all> <!-- in="bar" -->
</all>
登录后复制
这就是关于执行顺序的全部信息。
以上是笑话回顾：什么时候运行？的详细内容。更多信息请关注PHP中文网其他相关文章！
