Client-side Extensions Developer

Client-side Extensions Developer

Last updatedSep 4, 2020

Rate this page:

Discovering extension points

This is a continuation of the work started in 1. Creating an extension.

In this introduction guide, you will learn how to:

  • Reveal all the extension points in a page.
  • Discover all the possible types of extensions you can render in an extension point.
  • Check all the attributes and values you can use to influence how the product renders your extensions.

Revealing extension points on the page

Client-side Extensions (CSE) comes with some developer tools baked in to help you reveal all extensions points on the page.

To activate it, you need to go to a page that you know is using CSE and set the query parameter ?clientside-extensions in the URL.

  1. Navigate to the PR you created for testing CSE (e.g: http://localhost:7990/bitbucket/projects/PROJECT_1/repos/rep_1/pull-requests/1/)
  2. Add this query parameter to the URL: ?clientside-extensions.

You should see a glowing blue circle icon in the places where extension points are available.

Pull Request screenshot with discovery extension points revealed

Exploring extension points information

After revealing the available extension points in a page, you can click on any of the glowing icons to discover all the relevant information of a particular extension point:

  1. Click the glowing icon in the overview actions section of the PR page.

You should be able to see:

  • The name of the extension point.
  • The type of extensions you can create for that extension point.
  • The attributes that are supported, and how they affect the way the product will render your extension.
  • The shape of the context object your extension will receive from the product.

In the next section, you will learn all about Context.

Pull Request screenshot with extension point information dialog

Recap and next steps

Now you know:

  • How to reveal extension points in a page.
  • How to discover all extension types, supported attributes, and context provided for your extension point.

Next, you’re going to learn how to interact with products using the extensions API

Rate this page: