Récapitulatif de la plaisanterie : qu'est-ce qui s'exécute quand ?

TL;DR : ordre d'exécution

1. Tout ce qui se trouve au niveau supérieur et dans les blocs décrire() (où les blocs décrire() sont essentiellement des IIFE)
2. avantTout()
   1. haut niveau
   2. 1er niveau décrire()
   3. Nième niveau décrire()
3. avantChaque()
   1. haut niveau
   2. 1er niveau décrire()
   3. Nième niveau décrire()
4. test()
5. aprèsChaque()
   1. Nième niveau décrire()
   2. 1er niveau décrire()
   3. haut niveau
6. après tout()
   1. Nième niveau décrire()
   2. 1er niveau décrire()
   3. haut niveau

Clause de non-responsabilité

Je suppose que vous avez une compréhension de base de la plaisanterie et des tests unitaires. Je n'expliquerai pas la signification des crochets. Il s’agit plutôt d’un article de type aide-mémoire/référence.

Il y a des règles

Au début, la plaisanterie semble faire les choses comme par magie. Qu'est-ce qui est exécuté quand ? Mais si vous y réfléchissez une minute, cela devient évident moins déroutant.

Peut-être que ces « règles » simples peuvent vous aider :

1. Chaque fichier est exécuté indépendamment : rien de ce que vous faites dans A.test.js n'affecte B.test.js. (sauf si vous commencez à accéder à des ressources externes)
2. Les rappels décrire() sont exécutés immédiatement.
3. les hooks (beforeAll/afterAll, beforeEach/afterEach) sont exécutés de la portée externe (niveau supérieur/module) à la portée interne (décrire).

Exemple de base

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>");

Voici le résultat (après avoir supprimé les autres sorties) :

./<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

Ce qui se produit?

Tout ce qui se trouve au niveau supérieur et dans les rappels de description est exécuté immédiatement :

./<start>
./describe(foo)/<start>
./describe(foo)/<end>
./describe(bar)/<start>
./describe(bar)/<end>
./<end>
[...]

beforeAll et afterAll au niveau supérieur constituent une "accolade" autour de tous les tests. Chacun n'a été exécuté qu'une seule fois.

[...]

./beforeAll

[...]

./afterAll

./describe(*)/beforeAll et ./describe(*)/afterAll sont une accolade autour de tous les tests dans qui décrivent le rappel. Chacun n'a été exécuté qu'une seule fois.

[...]

./describe(foo)/beforeAll
[...]
./describe(foo)/afterAll

./describe(bar)/beforeAll
[...]
./describe(bar)/afterAll

[...]

beforeEach et afterEach sont des accolades autour de chaque test. Le niveau supérieur est le corset extérieur. Le niveau de description est l'orthèse intérieure.

[...]
./beforeEach
./describe(*)/beforeEach
[...]
./describe(*)/afterEach
./afterEach
[...]

Version avancée

Il s'agit d'un exemple avancé avec un bloc de description imbriqué. Il produit des résultats XML pour souligner la nature hiérarchique des étapes d'exécution.

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>");

Voici le résultat après quelques nettoyages et formatages :

<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>

C'est tout ce qu'il y a à savoir sur l'ordre d'exécution.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!