SymbolInformation containerName use for outline view hierarchy

Question

I have a custom language I am trying to get the code outline to work for. I have had some success generating symbols for my language and getting the functions to list on outline view. Now I am trying to get items like variables to show up under the function in outline view. I currently have a flat outline view but my symbols seems to contain the correct containerName value.

Here is the code I currently have in extension.ts:

'use strict';
import * as vscode from 'vscode';

export function activate(context: vscode.ExtensionContext) {
    context.subscriptions.push(vscode.languages.registerDocumentSymbolProvider(
        {language: "as"}, new FooDocumentSymbolProvider()
    ));
}

class FooDocumentSymbolProvider implements vscode.DocumentSymbolProvider {
    public provideDocumentSymbols(document: vscode.TextDocument,token: vscode.CancellationToken): Thenable<vscode.SymbolInformation[]> {
        return new Promise((resolve, reject) => {
            var symbols = [];
            var sym = "";
            for (var i = 0; i < document.lineCount; i++) {
                var line = document.lineAt(i);
                if (line.text.startsWith(".PROGRAM")) {
                    var sym = "";
                    symbols.push({
                        name: line.text.substr(9).trimRight(),
                        kind: vscode.SymbolKind.Function,
                        containerName: sym,
                        location: new vscode.Location(document.uri, line.range)
                    })
                    sym = line.text.substr(9).trimRight();
                }
                if (line.text.includes("CALL") && !(line.text.startsWith(".*"))) {
                    symbols.push({
                        name: line.text.substr(0).trimLeft(),
                        kind: vscode.SymbolKind.Module,
                        containerName: sym,
                        location: new vscode.Location(document.uri, line.range)
                    })
                }
            }
            resolve(symbols);
        });
    }
}

UPDATE #2:

public provideDocumentSymbols(document: vscode.TextDocument,token: vscode.CancellationToken): Thenable<vscode.DocumentSymbol[]> {
        return new Promise((resolve, reject) => {
            var symbols = [];
            var sym = "";
            for (var i = 0; i < document.lineCount; i++) {
                var line = document.lineAt(i);
                if (line.text.startsWith(".PROGRAM")) {
                    var sym = "";
                    var childrens = [];
                    symbols.push({
                        name: line.text.substr(9).trimRight(),
                        kind: vscode.SymbolKind.Function,
                        children: [],
                        range: line.range,
                        detail: "",
                        selectionRange: line.range
                        //location: new vscode.Location(document.uri, line.range)
                    })
                    sym = line.text.substr(9).trimRight();
                }
                if (line.text.includes("CALL") && !(line.text.startsWith(".*"))) {
                    symbols.push({
                        name: line.text.substr(0).trimLeft(),
                        kind: vscode.SymbolKind.Module,
                        children: [],
                        range: line.range,
                        detail: "",
                        selectionRange: line.range
                        //location: new vscode.Location(document.uri, line.range)
                    })
                }
            }
            resolve(symbols);
        });
    }
}

Answer 1

containerName is actually not what's responsible for the hierarchy. It's merely some additional "detail" that's displayed in greyed-out font after the symbol.

The trick is to not use SymbolInformation at all, but the more recent DocumentSymbol API (document symbol providers didn't used to support hierarchies, it was only added in 1.25). Each DocumentSymbol can have an array of children, so the hierarchy can be represented quite naturally as a tree.