Can't make the mock working with vitest and react testing library

[ilgianfra]

Hello,

I have a project with vitest and react testing library.

My vite.config.ts is

  test: {
    environment: 'jsdom',
    setupFiles: ['./src/testUtils/vitest.setup.ts'],
    globals: true,
    coverage: {
      enabled: true,
      reportsDirectory: 'coverage',
      reporter: ['json', 'lcov', 'text', 'html'],
      include: ['src/**/*.{jsx,ts,tsx}'],
      exclude: [
        'src/**/*.test.{js,jsx,ts,tsx}',
        'src/**/__tests__/**',
        'src/testUtils/**',
        'src/**/*mock*.{js,jsx,ts,tsx}',
      ],
      provider: 'v8'
    },
    include: ['src/**/__tests__/**/*.[t]s?(x)', 'src/**/?(*.)+(spec|test).[t]s?(x)'],
  },

I have set globals: true, so it should mean that I don't need to impor anything in my setup file

import 'jest-styled-components';
import '@testing-library/react/dont-cleanup-after-each';
import { cleanup } from '@testing-library/react';
import '@testing-library/jest-dom';

Object.defineProperty(window, 'matchMedia', {
  writable: true,
  value: vi.fn().mockImplementation((query) => ({
    matches: false,
    media: query,
    onchange: null,
    addListener: vi.fn(), // deprecated
    removeListener: vi.fn(), // deprecated
    addEventListener: vi.fn(),
    removeEventListener: vi.fn(),
    dispatchEvent: vi.fn(),
  })),
});

// runs a cleanup after each test case (e.g. clearing jsdom)
afterEach(() => {
  cleanup();
});

But when I run a test my inView is always false

I tried to add the manual config
import { resetIntersectionMocking, setupIntersectionMocking } from 'react-intersection-observer/test-utils';

Or adding in the test mockAllIsIntersecting(true);
But nothing worked.

My version is :
"react-intersection-observer": "^9.13.0",
"vitest": "^2.0.5"

Thanks