What is causing this issue: "Timeout of 10000ms exceeded. For async tests and hooks, ensure "done()" is called;."

Question

In the VueJs web application, we have written more than 500 unit test-cases(in all modules) using vue-test-utils and mocha-webpack, using nyc for coverage reports. Consider each module in one directory. When I run test-cases for a particular module, report gets generated successfully with test-case results(pass or fail). But running all test-cases in one go(by setting the path in package.json), all test-cases doesn't execute and throws following error:

Timeout of 100000ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.

I have seen similar questions that suggest using async await in code or increasing the timeout to resolve this, but why test-cases get executes when I run for a particular module and throws above error when I run for the whole project.

I have tried setting --timeout 100000 in package.json and it helped for large number of test-cases, but while running all(more than 500) unit test-cases again It throws the same error. I think this has to do with the number of test-cases.

What is causing this issue and How to resolve this so all test-cases runs successfully.?

Edit If any code in unit-tests is causing this timeout issue, How to detect which testcase is causing this issue, because It seems not possible to detect the source of issue by looking at logs in command prompt. Any pointers would be helpful.

Answer 1

After so many resolutions tried, came to a conclusion, that resolved above issue:

1. When we run test-cases, and there are dependency related warnings then It slows down test-cases and gives timeout issue. The resolution is to remove these warnings by mocking actions, mutations, getters and stubbing child components.
2. Adding NODE_OPTIONS: 'node --max_old_space_size=16384' in the configuration file will increase the NodeJS memory.This has improved performance of unit-tests.
3. Instead of using beforeEach, use before and after methods for mounting the components in wrapper. Also use destroy in after method to destroy the wrapper as follows:

let wrapper;

before(() => {
  wrapper = mount('component_name', {
    ...
  })
});

after(() => {
  wrapper.destroy();
});