New JavaScript Code Extension with Upgraded Editor and Publish Workflow

[TealiumJustin]

In Tealium iQ, the  extension marketplace is like a toolbox filled with every kind of tool you'll ever need for tag management. But there are two particularly useful extensions that happen to account for more than 70% of all deployed extensions: the Set Data Values extension and the JavaScript Code extension.

The JavaScript Code extension is the more advanced of the two, requiring some basic understanding of JavaScript programming, yet is it still used nearly as much as the Set Data Values extensions. That means there's a lot of coding going on in Tealium iQ! So despite its humble feature set -- a simple text area input with line numbers and auto-indenting -- the original JavaScript Code extension has handled a substantial amount of work to date.

We've been hearing, for some time now, about the desired features for this extension--updates that would make it a true code editor and provide an intuitive and safe publish workflow.  The Product Idea for an enhanced code editor received a lot of interest and support since the beginning of the year, so we are excited to announce that a new and improved version of the JavaScript Code extension is being released!

What's New?

The new JavaScript Code extension offers several significant upgrades over the previous one, including:

• Enhanced Editor
• Safe Publish Workflow
• Code Comparison (Diff)

Let's explore these a little more.

Enhanced Editor

The new code editor uses the Ace Editor and includes the following convenient features:

• Syntax Checking
  See errors and warnings as you type with the built-in JavaScript syntax checker.
• Code Folding
  Collapse blocks of code so you can focus on your changes and prevent accidental edits.
• Auto Indent/Outdent
  Enjoy the convenience of automatic indenting and outdenting as you type. Supports Tab and Shift+Tab too!
• Full Screen Mode
  Expand the editor to full-screen mode to get more code on the screen and eliminate distractions.

Publish Workflow

The new extension introduces drafts, in-progress revisions of the code, that can be saved without being released in the next publish. Each extension has its own publish settings allowing you to control exactly what code gets released to each publish environment.

Each instance of the extension can save up to 20 drafts!

Code Comparison (Diff)

Compare any draft of the code with any other draft or to a currently published version. A full screen comparison shows which lines have changes so you can quickly assess how to proceed.

How Does It Work?

The new JavaScript Code extension replaces the current one in the Extension Marketplace. This means the old one will no longer be available to be added to your account, but existing instances will continue to function as expected (you can even duplicate an old one if you really wanted to avoid the new features).

The biggest upgrade in the new extension is the introduction of drafts. Drafts allow you to edit code and save changes without affecting any of the publish environments.

This is achieved by using a simple publish workflow within the extension itself called Queue for Publish. When a draft is ready to be published you click Queue for publish... and select the desired publish locations. This freezes the draft in read-only mode and marks it to be included in the next publish to the chosen locations. 

The end result is that you can now safely publish without worrying that unfinished changes to a JavaScript Code extension will accidentally be released before they are ready.

Important Take-Away
In the new workflow you only edit drafts and drafts are never published unless they are explicitly queued for the next publish.

Additional Resources

• New JavaScript Code Extension