Skip to content

jest/prefer-hooks-on-top Style

What it does

While hooks can be setup anywhere in a test file, they are always called in a specific order, which means it can be confusing if they're intermixed with test cases.

Why is this bad?

When hooks are mixed with test cases, it becomes harder to understand the test setup and execution order. This can lead to confusion about which hooks apply to which tests and when they run. Grouping hooks at the top of each describe block makes the test structure clearer and more maintainable.

Examples

Examples of incorrect code for this rule:

javascript
describe("foo", () => {
  beforeEach(() => {
    seedMyDatabase();
  });

  it("accepts this input", () => {
    // ...
  });

  beforeAll(() => {
    createMyDatabase();
  });

  it("returns that value", () => {
    // ...
  });

  describe("when the database has specific values", () => {
    const specificValue = "...";
    beforeEach(() => {
      seedMyDatabase(specificValue);
    });

    it("accepts that input", () => {
      // ...
    });

    it("throws an error", () => {
      // ...
    });

    afterEach(() => {
      clearLogger();
    });

    beforeEach(() => {
      mockLogger();
    });

    it("logs a message", () => {
      // ...
    });
  });

  afterAll(() => {
    removeMyDatabase();
  });
});

Examples of correct code for this rule:

javascript
describe("foo", () => {
  beforeAll(() => {
    createMyDatabase();
  });

  beforeEach(() => {
    seedMyDatabase();
  });

  afterAll(() => {
    clearMyDatabase();
  });

  it("accepts this input", () => {
    // ...
  });

  it("returns that value", () => {
    // ...
  });

  describe("when the database has specific values", () => {
    const specificValue = "...";

    beforeEach(() => {
      seedMyDatabase(specificValue);
    });

    beforeEach(() => {
      mockLogger();
    });

    afterEach(() => {
      clearLogger();
    });

    it("accepts that input", () => {
      // ...
    });

    it("throws an error", () => {
      // ...
    });

    it("logs a message", () => {
      // ...
    });
  });
});

How to use

To enable this rule in the CLI or using the config file, you can use:

bash
oxlint --deny jest/prefer-hooks-on-top --jest-plugin
json
{
  "plugins": ["jest"],
  "rules": {
    "jest/prefer-hooks-on-top": "error"
  }
}

References

Released under the MIT License.