What is it ?

Headless Browser Integration refers to running the browser in a "headless" mode, meaning it operates without a graphical user interface (GUI). This allows automated browsing, testing, and rendering of web pages in the background. In Tiki, integrating Headless Browser enables advanced scripting and automation capabilities, such as generating screenshots, running tests, or processing web content programmatically.

Tiki supports two methods for headless browser integration:

1. CasperJS Integration (legacy method)
2. Direct Chrome Integration (modern alternative)

Below, each method is explained with its setup process and requirements.

CasperJS in Tiki enhances its functionality by providing a robust, scriptable browser engine. A navigation scripting and testing utility, acts as the bridge to enable this feature, making it accessible within Tiki’s ecosystem.

How It Works?

CasperJS leverages a headless browser engine to execute scripts and interact with web pages. In Tiki, this integration is configured through a plugin and package installation. Once enabled, Tiki can use CasperJS to perform tasks like automated page rendering or testing without requiring a visible browser window. The feature is controlled via Tiki’s settings, where administrators can activate and configure it.

Requirements

• Required:
  • Administrative access to Tiki.
  • Package: jerome-breton/casperjs-installer (installs CasperJS and its dependencies).
• Optional:
  • For PDF printing, install mpdf/mpdf.
  • If using Tiki Diagram, ensure tikiwiki/diagram is installed and configured.

Click to expand

Setup Process

1. Enable the CasperJS Plugin

• Navigate to: Settings > General Settings > Editing and Plugins > PluginTab
• Locate the CasperJS Plugin and enable it.

2. Install the CasperJS Package

• Go to: Settings > Advanced > Packages
• Search for and install the package jerome-breton/casperjs-installer.
• Note: This installs the necessary CasperJS files and dependencies.

Headless Chrome Integration involves running Google Chrome in a headless mode (without a graphical user interface) and programmatically controlling it. This setup is often used for tasks such as automation, web scraping, testing, and performance monitoring.

New to Tiki29 and will be backported to Tiki28 and Tiki27 as well.

How It Works?

Headless Chrome is a version of the Chrome browser that operates without displaying a user interface. It behaves the same way as Chrome with a GUI, except it doesn't render any visual content to the screen. This makes it lightweight, faster, and more resource-efficient for automated tasks.

Requirements

• Required:
  • Administrative access to Tiki.
  • Chrome installed on the server (required to utilize Headless Chrome functionality).
• Optional:
  • For PDF printing, install Mpdf on the server.
  • If using Tiki Diagram, ensure it is installed and configured.

Setup Process

Choose the Headless Browser Integration Type

• Access: Settings > General Settings > Headless Browser Integration
• Find the "Headless Browser Integration Type" (headlessbrowser_integration_type).
• Select "Direct Chrome Integration" as type.
• Note:
  • This configures Tiki to use Headless Chrome Integration as the headless browser engine.
  • Headless Chrome Integration requires Chrome Binary Path to work. This is automatically detected if not defined.

Click to expand

• Enable Image Export Preference:
  • Navigate to: Settings > File Galleries > Editing and Plugins > Settings for Diagrams
  • Locate the preference fgal_use_casperjs_to_export_images and enable it.
  • Note: Originally designed for CasperJS, this setting now also supports Headless Chrome for exporting images from file galleries.

Click to expand

Test the integration by performing a supported task in Tiki, such as:

• Generating a page screenshot.
• Exporting images from a file gallery (requires fgal_use_casperjs_to_export_images enabled).
• Downloading a PDF (requires Mpdf).
• Rendering a Tiki Diagram (if installed).

Successful execution confirms that the integration is working.

Tiki supports Headless Browser Integration via:

• CasperJS for legacy automation (requires jerome-breton/casperjs-installer).
• Direct Chrome Integration for modern tasks (requires Chrome).

The shared setting fgal_use_casperjs_to_export_images enables image exports for both methods. Optional packages like Mpdf and Tiki Diagram extend functionality.