Production: ReferenceError: Cannot access '…' before initialization in BaseTooltipPluginView (circular import via extensions/index)

[baribadamshin]

Description

In a production bundle (e.g. Next.js next build + client navigation), loading the WYSIWYG editor can throw:
ReferenceError: Cannot access '' before initialization at Module.BaseTooltipPluginView (…)

Dev mode may work; the failure shows up after minification/chunk ordering changes module evaluation order.

Root cause (analysis)

build/*/plugins/BaseTooltip/index.js imports getReactRendererFromState from ../../extensions/index.js (barrel).

While extensions/index.js is still evaluating, it pulls the YFM tree, which loads e.g. YfmNoteTooltipPlugin, which imports BaseTooltipPluginView from plugins/BaseTooltip/index.js again — a circular dependency. Depending on bundler order, the binding for getReactRendererFromState can still be in the TDZ when BaseTooltip runs, causing the error above.

Other parts of the package already import getReactRendererFromState directly from extensions/behavior/ReactRenderer/index.js, which avoids the cycle.

Suggested fix

In plugins/BaseTooltip (source), change the import from:

• ../../extensions / ../../extensions/index.js

to:

• ../../extensions/behavior/ReactRenderer (or the correct relative path to ReactRenderer from BaseTooltip)

Apply to both ESM and CJS build outputs if they are generated separately.

Environment

• @gravity-ui/markdown-editor: 15.32.0
• Bundler: Next.js production client chunks (Webpack/Turbopack)

Reproduction

1. Use an app that lazy-loads or routes to a view with the markdown editor (WYSIWYG) using the default/YFM-related extensions.
2. Run production build (next build) and production server (next start).
3. Navigate to the view — runtime error in console; React error boundary may catch it.

Workaround (downstream)

We patched the published build/esm and build/cjs plugins/BaseTooltip/index.js locally via patch-package to import from ../../extensions/behavior/ReactRenderer/index.js instead of the barrel. That removes the cycle and fixes the crash.

Happy to open a PR if you agree with this direction.

[makhnatkin]

Happy to open a PR if you agree with this direction.

Hi, @baribadamshin,

thanks for the report. This is one of 47 circular dependencies that have accumulated in the codebase.

We analysed all 47 and grouped them into 6 categories by root cause. This particular issue falls into Category A — "ancestor barrel import": a deeply nested module (BaseTooltip/index.tsx) imports a symbol not from the file that defines it, but through the shared ../../extensions/index.ts barrel. When that barrel initialises, it pulls the entire extension graph — including BaseTooltip itself — closing the cycle. In a CJS bundle this causes a TDZ crash: the module receives undefined instead of the actual function.

We propose a PR that fixes all 7 instances of this category:

File	Before	After
plugins/BaseTooltip/index.tsx	../../extensions	../../extensions/behavior/ReactRenderer
Emoji/EmojiSuggest/EmojiHandler.ts	../../../behavior	../../../behavior/ReactRenderer
GPT/gptExtension/view.tsx	../../../behavior	../../../behavior/ReactRenderer
Link/paste-plugin.ts	./index	./LinkSpecs
Link/plugins/LinkTooltipPlugin/index.tsx	../../../index	../../LinkSpecs + ../../utils
YfmTabs/plugins.ts	../../ barrel	3 direct imports
markup/commands/inline.ts	../codemirror	../codemirror/directive-facet