test(optimizer): add cjs browser field bare import test

[sapphi-red]

Description

This PR adds a failing test for #4798, #7301, #7576.

These issues are caused by the same reason.
I investigated this but I could not come up with a good solution.

Additional context

This bug is caused by this line. idToPkgMap.get(importer) is undefined through it should have PackageData.

vite/packages/vite/src/node/plugins/resolve.ts

Lines 941 to 942 in 5d6ea8e

	const pkg = importer && idToPkgMap.get(importer)
	if (pkg && isObject(pkg.data.browser)) {

This tryResolveBrowserMapping is called from here.

vite/packages/vite/src/node/plugins/resolve.ts

Line 272 in 5d6ea8e

(res = tryResolveBrowserMapping(id, importer, options, false))

I will try to describe why this is happening only when resolver is used with optimizer.

• bare imports goes through vite's resolver.

  vite/packages/vite/src/node/optimizer/esbuildDepPlugin.ts

  Lines 107 to 149 in 5d6ea8e

  	build.onResolve(
  	{ filter: /^[\w@][^:]/ },
  	async ({ path: id, importer, kind }) => {
  	if (moduleListContains(config.optimizeDeps?.exclude, id)) {
  	return {
  	path: id,
  	external: true
  	}
  	}
  	// ensure esbuild uses our resolved entries
  	let entry: { path: string; namespace: string } | undefined
  	// if this is an entry, return entry namespace resolve result
  	if (!importer) {
  	if ((entry = resolveEntry(id))) return entry
  	// check if this is aliased to an entry - also return entry namespace
  	const aliased = await _resolve(id, undefined, true)
  	if (aliased && (entry = resolveEntry(aliased))) {
  	return entry
  	}
  	}
  	// use vite's own resolver
  	const resolved = await resolve(id, importer, kind)
  	if (resolved) {
  	if (resolved.startsWith(browserExternalId)) {
  	return {
  	path: id,
  	namespace: 'browser-external'
  	}
  	}
  	if (isExternalUrl(resolved)) {
  	return {
  	path: resolved,
  	external: true
  	}
  	}
  	return {
  	path: path.resolve(resolved)
  	}
  	}
  	}
  	)

• non-bare imports does not go through vite's resolver and handled by esbuild's resolver
• when all imports goes through vite's resolver idToPkgMap is constructed correctly.

This (sapphi-red@4d7a716) is the solution I came up with but I think this solution has many problems.

1. It might occur infinite loop. I have set pluginData to check whether it is already called but I feel it would not work if there is other plugins.

   • There is currently no attempt made to detect infinite path resolution loops. Calling resolve from within onResolve with the same parameters is almost certainly a bad idea.
     https://esbuild.github.io/plugins/#resolve

2. Other plugins' onResolve runs two times. For example, if there is a onResolve which adds @, the id foo will become foo@@.

---

What is the purpose of this pull request?

• Bug fix
• New Feature
• Documentation update
• Other

Before submitting the PR, please make sure you do the following

• Read the Contributing Guidelines.
• Read the Pull Request Guidelines and follow the Commit Convention.
• Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
• Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
• Ideally, include relevant tests that fail without this PR but pass with it.

[netlify]

✅ Deploy Preview for vite-docs-main ready!

Name	Link
🔨 Latest commit	0814af9
🔍 Latest deploy log	https://app.netlify.com/sites/vite-docs-main/deploys/62b2b29b53b498000865bec0
😎 Deploy Preview	https://deploy-preview-7599--vite-docs-main.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 settings.