Isolation in browser tests doesn't seem to be working

[finleyjb]

I'm testing some vanilla code that creates DOM elements, but it looks like the isolation isn't working. The following tests fail:

describe('Test', () => {
  test('create', () => {
    document.body.appendChild(document.createElement('p'));
  });

  test('assert', () => {
    expect(document.querySelector('p')).toBeNullable();
  });
});

Is there a way to fix this?

[hi-ogawa]

This is expected. Vitest default isolation is by test file and not each test case.

The quick gotcha is to reset html by beforeEach:

beforeEach(() => {
  document.body.innerHTML = '';
})

[finleyjb]

Makes perfect sense now that you mention it. It would have saved some trouble if this were documented somewhere.

[hi-ogawa]

We do have automatic cleanup when using vitest-browser-react/vue/etc. integration, so it might be indeed confusing for vanilla case. Doc feedback is welcome if you have suggestions.