JCEF Preview

JCEF preview allows the most advanced rich preview of AsciiDoc content.

Update to IntelliJ 2020.3+ for the best experience, as this fixes some limitations of earlier versions.

Why to use the JCEF preview

The JCEF preview provides better HTML preview and additional features like scroll-to-view and opening links in the browser. As the preview is based on an up-to-date Google Chrome rendering engine, it offers in-par rendering compared to modern browsers. This includes rendering of fonts and SVGs.

How to enable the JCEF preview

Once JCEF is available, the user can change the preview to JCEF in the plugin’s settings via File  Settings…​  Languages & Frameworks  AsciiDoc  Preview Browser.

Security options

If the user changes the Safe mode in the plugin’s settings from UNSAFE to any other mode, the preview in JCEF and JavaFX mode will restrict all content to the local project and will prohibit loading of external content using a content security policy (CSP). Starting with plugin version 0.36.6, all untrusted projects will default to the SECURE mode. The IDE shows a “Safe mode, limited functionality” notification once the user opens an AsciiDoc file.

Activate the dev tools for the JCEF preview to debug issues where the preview doesn’t show content due to CSP.

Limitations of the JCEF preview

The following paragraphs describe problems where either a workaround is available or a fix is the latest version of IntelliJ or the AsciiDoc plugin.

Preview not showing on RDP (workaround available)

When using RDP to access the IDE, a user might not see the preview, and it appears as a blank space. This might be due to issue IDEA-299007. The root is that hardware acceleration is not available for the preview.

As a workaround, set the registry option ide.browser.jcef.gpu.disable to true.

The registry is available via menu Help  Find action…​, then enter “Registry” to search the action, then choose “Registry…​”. In the dialog that opens, start typing the registry key given above to restrict the list. Check the checkbox on the right to enable this property. Press Close to close the dialog. Restart the IDE to apply the setting.

Benefits of the JCEF preview

JCEF preview is an embedded Chrome browser. This opens a fully equipped Chrome developer tools window that allows users to inspect the HTML created in the preview and to view the JavaScript console of the preview.

In IntelliJ 2021.3.1+, closing the DevTools will also close the IDE. This is tracked in upstream issue IDEA-286008. This seems to be fixed in 2024.1.+.

Possible Workarounds:

  • Enable “Confirm before existing the IDE” in the IDE’s settings. Once the DevTools have been closed for an editor, the editor needs to be closed and re-opened before DevTools can be opened again.

  • Turn off registry option ide.browser.jcef.asciidocView.osr.enabled.

    With OSR turned off, the IDE doesn’t close any more on closing the DevTools.

    Once OSR is turned off, unpinned tool windows can no longer show above the preview (see IDEA-252845).
For the AsciiDoc plugin 0.37.55+

Use the menu item Help  Find Action…​ and choose “Open Devtools Window for the current AsciiDoc Preview”.

Users can define their own shortcut in the Keymap settings entry for this action.

For IntelliJ 2022.3 and later

Set the registry key ide.browser.jcef.contextMenu.devTools.enabled to true and set ide.browser.jcef.asciidocView.osr.enabled to false to enable this feature.

Once OSR is turned off, unpinned tool windows can no longer show above the preview (see IDEA-252845).

The registry is available via menu Help  Find action…​, then enter “Registry” to search the action, then choose “Registry…​”. In the dialog that opens, start typing the registry key given above to restrict the list. Check the checkbox on the right to enable this property. Press Close to close the dialog.

The DevTools are available for all newly opened editors. Right-click on the preview and use “Open DevTools”. For editors already open, close and re-open them to see the DevTools. No IDE restart is required.

For IntelliJ 2021.3 and later

Set the registry key ide.browser.jcef.contextMenu.devTools.enabled to true to enable this feature.

The registry is available via menu Help  Find action…​, then enter “Registry” to search the action, then choose “Registry…​”. In the dialog that opens, start typing the registry key given above to restrict the list. Check the checkbox on the right to enable this property. Press Close to close the dialog.

The DevTools are available for all newly opened editors. Right-click on the preview and use “Open DevTools”. For editors already open, close and re-open them to see the DevTools. No IDE restart is required.

For IntelliJ 2021.2 and earlier

Enabling the internal mode for the IDE. This will enable DevTools after a restart. It will also enable additional internal menus of the IDE.

It will also enable additional diagnostic error messages like “Slow operations are prohibited on EDT” for all installed plugins.

When the JCEF preview is available

JCEF preview is only available from IntelliJ 2020.2+ and plugin version 0.31.x. It requires that the user runs on the pre-packaged JetBrains OpenJDK 11.

Selecting a different JetBrains JDK using the “Choose Runtime” plugin

This is recommended for Android Studio 4.2 and 2020.3+ that doesn’t ship with either JavaFX or JCEF support. Watch this issue in Android Studio’s issue tracker for progress.

JavaFX preview that used to work with Android Studio 4.0 will not work with Android Studio 4.2 as it doesn’t package the necessary classes in the IDE. Therefore, follow these steps to enable JCEF preview for Android Studio.

For Android Studio 2022.2+:

  • Open menu item Help  Find action…​ and search for “Choose Boot Java runtime for the IDE…​”

  • Choose a runtime “17.0.x…​” labeled “JetBrains Runtime with JCEF” and install it. The IDE will restart.

  • Go to the settings of the AsciiDoc plugin and check if the preview is set to “JCEF Browser”. Change it to “JCEF Browser” if this is not the case.

For Android Studio 2021.1+:

  • Open menu item Help  Find action…​ and search for “Choose Boot Java runtime for the IDE…​”

  • Choose a runtime “11.0.x…​” labeled “JetBrains Runtime with JCEF” and install it. The IDE will restart.

  • Go to the settings of the AsciiDoc plugin and check if the preview is set to “JCEF Browser”. Change it to “JCEF Browser” if this is not the case.

Troubleshooting JCEF

Follow the JetBrains Knowledge Base article on “Reporting JCEF Problems”.