fix(browser): exports of context in package.json

[IdanGoor]

Description

I tried to run vitest in browser mode, but it failed for the error The requested module '@vitest/browser/context' does not provide an export named 'page'. Then I noticed that in the package.json we're exporting the wrong (empty) file.

Please don't delete this checklist! Before submitting the PR, please make sure you do the following:

• It's really useful if your PR references an issue where it is discussed ahead of time. If the feature is substantial or introduces breaking changes without a discussion, PR might be closed.
• Ideally, include a test that fails without this PR but passes with it.
• Please, don't make changes to pnpm-lock.yaml unless you introduce a new test example.

Tests

• Run the tests with pnpm test:ci.

Documentation

• If you introduce new functionality, document it. You can run documentation with pnpm run docs command.

Changesets

• Changes in changelog are generated from PR name. Please, make sure that it explains your changes in an understandable manner. Please, prefix changeset messages with feat:, fix:, perf:, docs:, or chore:.

[netlify]

✅ Deploy Preview for vitest-dev ready!

Built without sensitive environment variables

Name	Link
🔨 Latest commit	0808e99
🔍 Latest deploy log	https://app.netlify.com/sites/vitest-dev/deploys/66e74ae81598ae0008989a7d
😎 Deploy Preview	https://deploy-preview-6514--vitest-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[AriPerkkio]

Then I noticed that in the package.json we're exporting the wrong (empty) file.

And it should:

vitest/packages/browser/context.js

Lines 1 to 2 in 699055e

	// empty file to not break bundling
	// Vitest resolves "@vitest/browser/context" as a virtual module instead

Importing @vitest/browser/context does more than just importing dist/context.js:

vitest/packages/browser/src/node/plugins/pluginContext.ts

Lines 31 to 90 in 699055e

	return {
	name: 'vitest:browser:virtual-module:context',
	enforce: 'pre',
	resolveId(id) {
	if (id === ID_CONTEXT) {
	return VIRTUAL_ID_CONTEXT
	}
	},
	load(id) {
	if (id === VIRTUAL_ID_CONTEXT) {
	return generateContextFile.call(this, server)
	}
	},
	}
	}
	async function generateContextFile(
	this: PluginContext,
	server: BrowserServer,
	) {
	const commands = Object.keys(server.project.config.browser.commands ?? {})
	const filepathCode
	= '__vitest_worker__.filepath || __vitest_worker__.current?.file?.filepath || undefined'
	const provider = server.provider
	const commandsCode = commands
	.filter(command => !command.startsWith('__vitest'))
	.map((command) => {
	return ` ["${command}"]: (...args) => rpc().triggerCommand(contextId, "${command}", filepath(), args),`
	})
	.join('\n')
	const userEventNonProviderImport = await getUserEventImport(
	provider,
	this.resolve.bind(this),
	)
	const distContextPath = slash(`/@fs/${resolve(__dirname, 'context.js')}`)
	return `
	import { page, createUserEvent, cdp } from '${distContextPath}'
	${userEventNonProviderImport}
	const filepath = () => ${filepathCode}
	const rpc = () => __vitest_worker__.rpc
	const contextId = __vitest_browser_runner__.contextId
	export const server = {
	platform: ${JSON.stringify(process.platform)},
	version: ${JSON.stringify(process.version)},
	provider: ${JSON.stringify(provider.name)},
	browser: ${JSON.stringify(server.project.config.browser.name)},
	commands: {
	${commandsCode}
	},
	config: __vitest_browser_runner__.config,
	}
	export const commands = server.commands
	export const userEvent = createUserEvent(_userEventSetup)
	export { page, cdp }
	`
	}

[sheremet-va]

context is a virtual file, we put an empty file to not break static analysers

you cannot import it outside of Vitest Browser Mode

[sheremet-va]

but we should probably throw our own error there