How to handle Svelte Context inside test

[LeakStephane]

Hi,

I'm currently refactoring a svelte codebase going from @testing-library/svelte to vitest-browser-svelte

This repository and documentation, has helped me a lot so far (👍 Component testing is super fast now). But i still wonder how to handle svelte context inside +page/+layout

The code i need to refactor :

 import { render, screen, waitFor } from '@testing-library/svelte'
//...

const API_BASE_URL = 'http://fake.com/api';

// Mock window.location
const mockLocation = {
	href: 'http://localhost:3000/',
};
Object.defineProperty(window, 'location', {
	value: mockLocation,
	writable: true,
});

const renderWithContext = (contextData: { apiClient: ApiClient; callback: Snippet }) => {
	const context = new Map();
	context.set('apiClient', contextData.apiClient);
	context.set('authUserState', {
		user: {
			firstname: 'John',
		},
	});
	return render(Layout, {
		props: {
			children: contextData.callback,
		},
		context,
	});
};

We are are defining context has a Map() and used to use the render function from '@testing-library/svelte'

Some usage

	it('Should render a loading', async () => {
		mock.onGet().withDelayInMs(100).reply(200, {
			email: 'john.doe@gmail.com',
			firstname: 'john',
			lastname: 'doe',
			id: '0',
		});

		 renderWithContext({ apiClient, callback: vi.fn() as Snippet });
		 await waitFor(async () => {
		 	expect(screen.getByTestId('loading')).toBeTruthy();
		 });
	});

Could you provide an exemple of doing testing with svelte:context inside the documentation ?
Do you have some pattern, or best pratices to shares for that use case ?
@spences10