useTestHooksOnTop

JavaScript (and super languages)

Summary

Diagnostic Category: lint/nursery/useTestHooksOnTop
This rule doesn’t have a fix.
The default severity of this rule is warning.
This rule belongs to the following domains:
- test
Sources:
- Same as jest/prefer-hooks-on-top
- Same as vitest/prefer-hooks-on-top
- Same as playwright/prefer-hooks-on-top

How to configure

1
{
2
  "linter": {
3
    "rules": {
4
      "nursery": {
5
        "useTestHooksOnTop": "error"
6
      }
7
    }
8
  }
9
}

Description

Enforce that lifecycle hooks appear before any test cases in the same block.

Placing beforeEach, beforeAll, afterEach, and afterAll hooks after test cases (it, test) makes the setup and teardown harder to spot at a glance and can be a source of confusion for readers of the test suite.

Examples

Invalid

1
describe('foo', () => {
2
  it('does something', () => {});
3
  beforeEach(() => {});
4
});

code-block.js:3:3 lint/nursery/useTestHooksOnTop ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ⚠ Lifecycle hook beforeEach appears after a test case.
  
    1 │ describe(‘foo’, () => {
    2 │   it(‘does something’, () => {});
  > 3 │   beforeEach(() => {});
      │   ^^^^^^^^^^^^^^^^^^^^
    4 │ });
    5 │ 
  
  ℹ Placing the hook after this test case makes it harder to spot the setup and teardown for these tests at a glance.
  
    1 │ describe(‘foo’, () => {
  > 2 │   it(‘does something’, () => {});
      │   ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    3 │   beforeEach(() => {});
    4 │ });
  
  ℹ Move the hook above all test cases in the same block for better readability.
  
  ℹ This rule belongs to the nursery group, which means it is not yet stable and may change in the future. Visit https://biomejs.dev/linter/#nursery for more information.

Valid

1
describe('foo', () => {
2
  beforeEach(() => {});
3
  it('does something', () => {});
4
});