A Che-Theia plug-in is an extension of the development environment isolated from the IDE. Plug-ins can be packaged as files or containers to provide their own dependencies.

Extending Che-Theia using plug-ins can enable the following capabilities:

  • Language support: Extend the supported languages by relying on the Language Server Protocol.

  • Debuggers: Extend debugging capabilities with the Debug Adapter Protocol.

  • Development Tools: Integrate your favorite linters, and as testing and performance tools.

  • Menus, panels, and commands: Add your own items to the IDE components.

  • Themes: Build custom themes, extend the UI, or customize icon themes.

  • Snippets, formatters, and syntax highlighting: Enhance comfort of use with supported programming languages.

  • Keybindings: Add new keymaps and popular keybindings to make the environment feel natural.

Features and benefits of Che-Theia plug-ins

Features Description Benefits

Fast Loading

Plug-ins are loaded at runtime and are already compiled. IDE is loading the plug-in code.

Avoid any compilation time. Avoid post-installation steps.

Secure Loading

Plug-ins are loaded separately from the IDE. The IDE stays always in an usable state.

Plug-ins do not break the whole IDE if it has bugs. Handle network issue.

Tooling Dependencies

Dependencies for the plug-in are packaged with the plug-in in its own container.

No-installation for tools. Dependencies running into container.

Code isolation

Guarantee that plug-ins cannot block the main functions of the IDE like opening a file or typing

Plug-ins are running into separate threads. Avoid dependencies mismatch.

VS Code Extension Compatibility

Extend the capabilities of the IDE with existing VS Code Extensions.

Target multiple platform. Allow easy discovery of Visual Studio Code Extension with required installation.

Che-Theia plug-in concept in detail

Eclipse Che provides a default web IDE for workspaces: Che-Theia. It is based on Eclipse Theia. It is a slightly different version than the plain Eclipse Theia one because there are functionalities that have been added based on the nature of the Eclipse Che workspaces. This version of Eclipse Theia for Che is called Che-Theia.

You can extend the IDE provided with Eclipse Che by building a Che-Theia plug-in. Che-Theia plug-ins are compatible with any other Eclipse Theia-based IDE.

Client-side and server-side Che-Theia plug-ins

The Che-Theia editor plug-ins let you add languages, debuggers, and tools to your installation to support your development workflow. Plug-ins run when the editor completes loading. If a Che-Theia plug-in fails, the main Che-Theia editor continues to work.

Che-Theia plug-ins run either on the client side or on the server side. This is a scheme of the client and server-side plug-in concept:

client server side plug ins
Figure 1. Client and server-side Che-Theia plug-ins

The same Che-Theia plug-in API is exposed to plug-ins running on the client side (Web Worker) or the server side (Node.js).

Che-Theia plug-in APIs

For the purpose of providing tool isolation and easy extensibility in Eclipse Che, the Che-Theia IDE has a set of plug-in APIs. The APIs are compatible with Visual Studio Code extension APIs. In most cases, Che-Theia can run VS Code extensions as its own plug-ins.

When developing a plug-in that depends on or interacts with components of Che workspaces (containers, preferences, factories), use the Che APIs embedded in Che-Theia.

Che-Theia plug-in capabilities

Che-Theia plug-ins have the following capabilities:

Plug-in Description Repository

Che Extended Tasks

Handles the Che commands and provides the ability to start those into a specific container of the workspace.

Che Extended Terminal

Allows to provide terminal for any of the containers of the workspace.

Che Factory

Handles the Eclipse Che Factories

Che Container

Provides a container view that shows all the containers that are running in the workspace and allows to interact with them.

Containers plugins

Dashboard

Integrates the IDE with the Dashboard and facilitate the navigation.

Che APIs

Extends the IDE APIs to allow interacting with Che-specific components (workspaces, preferences).

VS Code extensions and Eclipse Theia plug-ins

A Che-Theia plug-in can be based on a VS Code extension or an Eclipse Theia plug-in.

A Visual Studio Code extension

To repackage a VS Code extension as a Che-Theia plug-in with its own set of dependencies, package the dependencies into a container. This ensures that Eclipse Che users do not need to install the dependencies when using the extension. See Using a Visual Studio Code extension in Che.

An Eclipse Theia plug-in

You can build a Che-Theia plug-in by implementing an Eclipse Theia plug-in and packaging it to Eclipse Che.

Che-Theia plug-in metadata

Che-Theia plug-in metadata is information about individual plug-ins for the plug-in registry.

meta.yaml

The Che-Theia plug-in metadata is defined in a meta.yaml file for the specific plug-in.

Interface for a Che-Theia plug-in metadata object
{
    id: string;
    version: string;
    type: string;
    name: string;
        title: string;
    description: string;
    url: string;
}

The most important part of the object is the url, which defines the location of plug-in configuration. Typically, it is a tar archive with the plug-in meta.yaml file.

When adding a VS Code extension from the oficial marketplace using its ID, the url field should be replaced with an attributes section that would contain extension and container-image fields:

Interface for a VS Code plug-in metadata object
{
    id: string;
    version: string;
    type: string;
    name: string;
        title: string;
    description: string;
    Attributes: {
       extension: string;      (1)
       containerImage: string; (2)
    }
}
1 VS Code extension ID with a vscode:extension/ prefix
2 Points to the container image in which the extension runs. Use images based on eclipse/che-theia-endpoint-runtime to be able to host VS Code extensions or Che-Theia plug-ins.

che-plugin.yaml

The most detailed information about a plug-in is in the che-plugin.yaml file. For example:

che-plugin.yaml file for the che-editor-theia plug-in
version: 1.0.0
type: Che Editor
name: theia-ide
id: org.eclipse.che.editor.theia
title: Eclipse Theia for Eclipse Che
description: Eclipse Theia
icon: https://pbs.twimg.com/profile_images/929088242456190976/xjkS2L-0_400x400.jpg
endpoints:
 -  name: "theia"
    public: true
    targetPort: 3100
    attributes:
      protocol: http
      type: ide
      secure: true
      cookiesAuthEnabled: true
      discoverable: false
 -  name: "theia-dev"
    public: true
    targetPort: 3130
    attributes:
      protocol: http
      type: ide-dev
      discoverable: false
containers:
 - name: theia-ide
   image: eclipse/che-theia:0.3.18-nightly
   env:
       - name: THEIA_PLUGINS
         value: local-dir:///plugins
       - name: HOSTED_PLUGIN_HOSTNAME
         value: 0.0.0.0
       - name: HOSTED_PLUGIN_PORT
         value: 3130
   volumes:
       - mountPath: "/plugins"
         name: plugins
       - mountPath: "/projects"
         name: projects
   ports:
       - exposedPort: 3100
       - exposedPort: 3130
   memory-limit: "1536M"
   memoryLimit: "1536M"
che-plugin.yaml file for the che-machine-exec plug-in
endpoints:
 -  name: "che-machine-exec"
    public: true
    targetPort: 4444
    attributes:
      protocol: ws
      type: terminal
      discoverable: false
containers:
 - name: che-machine-exec
   image: eclipse/che-machine-exec
   ports:
     - exposedPort: 4444
editors:
   - id: org.eclipse.che.editor.theia

Che-Theia plug-in lifecycle

When a user is starting a workspace, the following procedure is followed:

  1. Che master checks for plug-ins to start from the workspace definition.

  2. Plug-in metadata is retrieved, and the type of each plug-in is recognized.

  3. A broker is selected according to the plug-in type.

  4. The broker processes the installation and deployment of the plug-in (the installation process is different for each broker).

There are different types of plug-ins. A broker ensures all installation requirements are met for a plug-in to deploy correctly.
che theia plug in lifecycle
Figure 2. Che-Theia plug-in lifecycle

Before a Che workspace is launched, Che master starts containers for the workspace:

  1. The Che-Theia plug-in broker extracts the plug-in (from the .theia file) to get the sidecar containers that the plug-in needs.

  2. The broker sends the appropriate container informations to Che master.

  3. The broker copies the Che-Theia plug-in to a volume to have it available for the Che-Theia editor container.

  4. Che workspace master then starts all the containers of the workspace.

  5. Che-Theia is started in its own container and checks the correct folder to load the plug-ins.

Che-Theia plug-in lifecycle:

  1. When a user is opening a browser tab or window with Che-Theia, Che-Theia starts a new plug-in session (browser or remote TODO: 'what is remote in this context?'). Every Che-Theia plug-in is notified that a new session has been started (the start() function of the plug-in triggered).

  2. A Che-Theia plug-in session is running and interacting with the Che-Theia backend and frontend.

  3. When the user is closing the browser tab or there is a timeout, every plug-in is notified (the stop() function of the plug-in triggered).

Embedded and remote Che-Theia plug-ins

Developer workspaces in Eclipse Che provide all dependencies needed to work on a project. The application includes the dependencies needed by all the tools and plug-ins used.

There are two different ways a Che-Theia plug-in can run. This is based on the dependencies that are needed for the plug-in: embedded (or local) and remote.

Embedded (or local) plug-ins

The plug-in does not have specific dependencies - it only uses a Node.js runtime, and it runs in the same container as the IDE. The plug-in is injected into the IDE.

Examples:

  • Code linting

  • New set of commands

  • New UI components

To include a Che-Theia plug-in as embedded, define a URL to the plug-in binary (the .theia archive) in the meta.yaml file. In the case of a VS Code extension, provide the extension ID from the Visual Studio Code marketplace (see Using a Visual Studio Code extension in Che).

When starting a workspace, Che downloads and unpacks the plug-in binaries and includes them in the Che-Theia editor container. The Che-Theia editor initializes the plug-ins when it starts.

local che theia plug in
Figure 3. Local Che-Theia plug-in

Remote plug-ins

The plug-in relies on dependencies or it has a backend. It runs in its own sidecar container, and all dependencies are packaged in the container.

A remote Che-Theia plug-in consist of two parts:

  • Che-Theia plug-in or VS Code extension binaries. The definition in the meta.yaml file is the same as for embedded plug-ins.

  • Container image definition, for example, eclipse/che-theia-dev:nightly. From this image, Che creates a separate container inside a workspace.

Examples:

  • Java Language Server

  • Python Language Server

When starting a workspace, Che creates a container from the plug-in image, downloads and unpacks the plug-in binaries, and includes them in the created container. The Che-Theia editor connects to the remote plug-ins when it starts.

remote che theia plug in
Figure 4. Remote Che-Theia plug-in

Comparison matrix

When a Che-Theia plug-in (or a VS Code extension) does not need extra dependencies inside its container, it is an embedded plug-in. A container with extra dependencies that includes a plug-in is a remote plug-in.

Table 1. Che-Theia plug-in comparison matrix: embedded vs remote
  Configure RAM per plug-in Environment dependencies Create separated container

Remote

TRUE

Plug-in uses dependencies defined in the remote container.

TRUE

Embedded

FALSE (users can configure RAM for the whole editor container, but not per plug-in)

Plug-in uses dependencies from the editor container; if container does not include these dependencies, the plug-in fails or does not function as expected.

FALSE

Depending on your use case and the capabilities provided by your plug-in, select one of the described running modes.

Tags: