Get Acquainted with the User Interface for the InterSystems VS Code Extensions

When you install the InterSystems ObjectScript Extension Pack for Visual Studio Code (VS Code), it adds additional capability to the VS Code user interface to support development in ObjectScript. This page summarizes those added capabilities.

For more information about the features of VS Code’s standard UI, refer to the section User InterfaceOpens in a new tab in the VS Code documentation.

Explorer View Context Menu Enhancements

The Explorer view is a standard VS Code view which allows you to view and organize directories and files within your workspaces. Access the Explorer view by selecting the Explorer button File explorer icon from the Activity Bar.

The InterSystems extension pack adds the following items to context menus in this view:

Add Server Namespace to Workspace... in the context menu of folders
Import and Compile in the context menu of folders and files when you are connected to an InterSystems server
Import Without Compilation in context menu of folders and files when you are connected to an InterSystems server

InterSystems View Container

The InterSystems extension pack provides most of the capabilities necessary to support development in ObjectScript within three views:

the InterSystems Servers view, which you can use to manage connections to your InterSystems servers and add server-side directories to your workspace
the ObjectScript Explorer view, which you can use to explore files on a connected InterSystems server.
the InterSystems Projects Explorer view, which you can use to create, manage, and explore projects. For more information on using this view, see Work with Projects.

All three of these views are available within the InterSystems view container. To access the InterSystems view container, select the InterSystems button generated description: objectscript button in the Activity bar.

When there is no workspace or folder open in the Explorer, only the InterSystems Servers view is available. Connect to an InterSystems server or open a resource within the Explorer to display the ObjectScript Explorer and InterSystems Projects Explorer.

Note:

Views within the InterSystems view container can be dragged to a different view container. This means, for example, that you could move the InterSystems Servers view into VS Code’s main Explorer view container.

When a VS Code container has only a single view in it, the view header merges with the container header, with the two names separated by a colon.

InterSystems Servers

This view shows server resources in a tree format, as illustrated in the following screenshot:

This view groups servers into a variety of folders: servers currently in use, user-defined favorites, and servers which have been recently used. Within the view, you can perform operations on the servers. When you move the cursor over a server listing, command buttons appear which let you mark the server as a favorite, open the server’s Management Portal in a VS Code tab in the built-in Simple Browser, or open its Management Portal in an external browser, as illustrated below

popout icon with open mp in external browser tooltip

Viewing and Editing Source Code on the Server

To view and edit source code on a server, expand the target server in the tree view, then expand its Namespaces folder. Hover over the target namespace to reveal its command buttons, as illustrated in the following image:

Select the edit (pencil) button to add an isfs://server:namespace/ folder to your VS Code workspace which corresponds with that namespace.
Select the view (eye) button to add an isfs-readonly://server:namespace/ folder to your VS Code workspace which corresponds with that namespace.
Hold the Alt or Option key while selecting the edit or view button to add a folder that also gives you access to server-side web application files (such as .csp files).

If you want to add a folder that shows only a single project’s contents, expand the target namespace and the Projects folder to reveal the projects in the target namespace. Hover over the target project to reveal its command buttons, as illustrated in the following image:

Select the edit (pencil) button to add an isfs://server:namespace/?project=projectName folder to your VS Code workspace.
Select the view (eye) button to add an isfs-readonly://server:namespace/?project=projectName folder to your VS Code workspace.

Once you have added a server-side namespace to the workspace, VS Code opens the Explorer view showing the added namespace. In the following image, the workspace includes the Sample and User packages in the src folder on the client, and the Sample and User packages in the USER namespace on the server, with read-only access:

Sample workspace with server-side content

To learn more about using isfs and isfs-readonly folders, see Server-Side Editing.

Important:

If you are already doing client-side editing of your code (for example, to manage it with Git) be sure you understand the consequences of also doing server-side editing using isfs. If in doubt, limit yourself to isfs-readonly by only using the eye icon.

Adding a Server

You can use the plus sign (+) in the title bar of the server resource explorer pane to add a server as described in the section Configure a Server.

Server Context Menu

Servers listed in the InterSystems Server view provide a context menu which includes options to refresh the server, edit the settings.json specification for the server, and set the color of the icon for the server in the tree view, as illustrated in the following image:

Import Server Connections

On Windows, the Server Manager can create connection entries for all connections you previously defined with the original Windows app called InterSystems Server Manager. This action is available by selecting Import Servers from Windows Registry from the ... (ellipsis) menu in the title bar of the server resource explorer pane, as illustrated in the following image:

Notes About the VS Code Simple Browser

Only one Simple Browser tab can be open at a time, so launching a second server’s Management Portal replaces the previous one.

If the server version is InterSystems IRIS 2020.1.1 or later you need to change a setting on the suite of web applications that implement Management Portal. The Simple Browser is not permitted to store the Portal’s session management cookies, so the Management Portal must be willing to fall back to using the CSPCHD query parameter mechanism.

To do so:

In Management Portal, select System Administration > Security > Applications > Web Applications.
Enter /csp/sys in the filter field to find the web applications which have paths beginning with /csp/sys.
For each application:
1. Select the link in the Name column to edit the application definition.
2. In the section labeled Session Settings, change the value of Use Cooke for Session from Always to Autodetect.
3. Select Save to save the change.

This change should not affect the use of session cookies on ordinary browsers.

ObjectScript Explorer

When a VS Code workspace is not connected to an InterSystems IRIS server, the ObjectScript Explorer provides a button that lets you select a server and namespace. Once the workspace is connected to an InterSystems server, the ObjectScript Explorer shows files on the server, grouped by type of file.

If the workspace is configured for server-side editing, the ObjectScript Explorer is not available. In this configuration, the Explorer view lists files on the server, not on the local machine, making the ObjectScript Explorer view irrelevant.

The ObjectScript Explorer provides the following items:

Compile — Compiles files on the server
Delete — Deletes files from the server
Export — Exports files to the workspace on the client
Server Command Menu... — Allows you to select a command from menus which are configured on the server.
Server Source Control... — Allows you to select a command from menus which are configured on the server.

The InterSystems IRIS documentation section Extending StudioOpens in a new tab describes how to configure menus for source code control and other purposes. Entries from menus named %SourceMenu and %SourceContext appear in the Server Source Control menu provided the source control class does not disable the entry. For example, the source control class may disable checkout if the file is already checked out.

Server Connection Status Bar

The connection status of the current server can be seen in the VS Code status barOpens in a new tab. If the server connection is active, the connected server and namespace will be shown in the status bar. If the server connection info is defined in the intersystems.servers settings object, the name of the server and namespace appears:

Otherwise, the host, port, and namespace appear:

Hover over the status bar item to see more detailed connection information, like a full connection URL and the username of the connection. Click on the status bar item to open the Server Actions menu. You can add custom entries to this menu.

If the server connection is inactive, the status bar displays the connection info or the word ObjectScript will be shown, along with an error or warning icon:

Hover over the status bar item to see more detailed error information. Click on the status bar item to open a menu that will help you activate your connection.