From 0f606b62822a5eb1707977a51819e3d9e5ebf561 Mon Sep 17 00:00:00 2001
From: Chet Joswig <cjoswig@yahoo.com>
Date: Fri, 8 Nov 2024 16:05:38 -0800
Subject: [PATCH] Show variables and globals in form view (#1536)

* support for seqN variables in form view

* scope vml variables and parameters pulled in

* return globals even if parse tree is unavailable

* pull isVariable check into reactive block

* reuse isDefined function

* toggle between literal and reference option

* change term reference to symbol

* readability of enable repeat args check

* don't use symbol for boolean test

* pr feedback reactive statement not triggered

* pr feedback - combine template literals where possible

* pr feedback variable name

* use filterEmpty instead of new duplicate function

* move CSS attribute to parent, playwrigth selector update

* ensure functions called in reactive statements only depend on parameters

* remove extraneous optional chain

* more descriptive test names

* pr feedback, delete useQuotes option and format in ArgEditor
---
 e2e-tests/fixtures/Sequence.ts                |   2 +-
 .../sequencing/SequenceEditor.svelte          |   7 +-
 .../sequencing/form/ArgEditor.svelte          | 101 +++++++++++++-----
 .../sequencing/form/ArgTitle.svelte           |  88 ++++++++++++---
 .../sequencing/form/EnumEditor.svelte         |  12 +--
 .../sequencing/form/SelectedCommand.svelte    |  66 +++++++++---
 src/utilities/codemirror/commandInfoMapper.ts |  17 ++-
 src/utilities/codemirror/seq-n-tree-utils.ts  |  20 +++-
 src/utilities/codemirror/vml/vmlAdaptation.ts |   8 +-
 .../codemirror/vml/vmlBlockLibrary.ts         |   7 +-
 src/utilities/codemirror/vml/vmlConstants.ts  |   4 +
 src/utilities/codemirror/vml/vmlFormatter.ts  |  10 +-
 .../codemirror/vml/vmlTreeUtils.test.ts       |  64 ++++++++++-
 src/utilities/codemirror/vml/vmlTreeUtils.ts  |  59 +++++++++-
 .../sequence-editor/sequence-linter.ts        |   2 +-
 src/utilities/sequence-editor/tree-utils.ts   |   6 +-
 16 files changed, 384 insertions(+), 89 deletions(-)

diff --git a/e2e-tests/fixtures/Sequence.ts b/e2e-tests/fixtures/Sequence.ts
index 9a01ce501a..55e588b2c8 100644
--- a/e2e-tests/fixtures/Sequence.ts
+++ b/e2e-tests/fixtures/Sequence.ts
@@ -168,7 +168,7 @@ export class Sequence {
     await expect(this.command).toHaveText('C FSW_CMD_0 "ON" false 1');
     await this.page
       .locator('fieldset')
-      .filter({ hasText: 'enum_arg_0 ONOFF' })
+      .filter({ hasText: 'enum_arg_0 Value Type Literal' })
       .getByRole('combobox')
       .selectOption('OFF');
 
diff --git a/src/components/sequencing/SequenceEditor.svelte b/src/components/sequencing/SequenceEditor.svelte
index e7850a9118..33c1d6756d 100644
--- a/src/components/sequencing/SequenceEditor.svelte
+++ b/src/components/sequencing/SequenceEditor.svelte
@@ -6,7 +6,7 @@
   import { lintGutter } from '@codemirror/lint';
   import { Compartment, EditorState } from '@codemirror/state';
   import { type ViewUpdate } from '@codemirror/view';
-  import type { SyntaxNode } from '@lezer/common';
+  import type { SyntaxNode, Tree } from '@lezer/common';
   import type { ChannelDictionary, CommandDictionary, ParameterDictionary } from '@nasa-jpl/aerie-ampcs';
   import ChevronDownIcon from '@nasa-jpl/stellar/icons/chevron_down.svg?component';
   import CollapseIcon from 'bootstrap-icons/icons/arrow-bar-down.svg?component';
@@ -102,6 +102,7 @@
   let menu: Menu;
   let outputFormats: IOutputFormat[];
   let selectedNode: SyntaxNode | null;
+  let currentTree: Tree;
   let commandInfoMapper: CommandInfoMapper = new SeqNCommandInfoMapper();
   let selectedOutputFormat: IOutputFormat | undefined;
   let toggleSeqJsonPreview: boolean = false;
@@ -226,7 +227,7 @@
     }
   }
 
-  $: showOutputs = !isInVmlMode && !!outputFormats.length;
+  $: showOutputs = !isInVmlMode && outputFormats.length > 0;
   $: {
     if (showOutputs) {
       editorHeights = toggleSeqJsonPreview ? '1fr 3px 1fr' : '1.88fr 3px 80px';
@@ -361,6 +362,7 @@
         commandInfoMapper = new SeqNCommandInfoMapper();
       }
       selectedNode = updatedSelectionNode;
+      currentTree = tree;
     }
   }
 
@@ -539,6 +541,7 @@
     {#if !!commandDictionary && !!selectedNode}
       <SelectedCommand
         node={selectedNode}
+        tree={currentTree}
         {channelDictionary}
         {commandDictionary}
         {commandInfoMapper}
diff --git a/src/components/sequencing/form/ArgEditor.svelte b/src/components/sequencing/form/ArgEditor.svelte
index 153c412a7a..638658541b 100644
--- a/src/components/sequencing/form/ArgEditor.svelte
+++ b/src/components/sequencing/form/ArgEditor.svelte
@@ -7,10 +7,12 @@
   import {
     getMissingArgDefs,
     isFswCommandArgumentBoolean,
+    isFswCommandArgumentEnum,
     isFswCommandArgumentRepeat,
     isFswCommandArgumentVarString,
     isNumberArg,
     quoteEscape,
+    unquoteUnescape,
     type ArgTextDef,
   } from './../../../utilities/codemirror/codemirror-utils';
   import AddMissingArgsButton from './AddMissingArgsButton.svelte';
@@ -26,16 +28,38 @@
   export let setInEditor: (token: SyntaxNode, val: string) => void;
   export let addDefaultArgs: (commandNode: SyntaxNode, argDefs: FswCommandArgument[]) => void;
   export let commandInfoMapper: CommandInfoMapper;
+  export let variablesInScope: string[];
+
+  let argDef: FswCommandArgument | undefined = undefined;
+  let enableRepeatAdd: boolean = false;
+  let isSymbol: boolean = false;
+
+  $: argDef = argInfo.argDef;
+
+  $: {
+    isSymbol = commandInfoMapper.isArgumentNodeOfVariableType(argInfo.node ?? null);
+    if (!!argDef && isSymbol) {
+      argDef = {
+        arg_type: 'enum',
+        bit_length: null,
+        default_value: null,
+        description: argDef.description,
+        enum_name: 'variables',
+        name: argDef.name,
+        range: variablesInScope,
+      };
+    }
+  }
 
   $: enableRepeatAdd =
-    argInfo.argDef &&
-    isFswCommandArgumentRepeat(argInfo.argDef) &&
-    argInfo.children &&
-    argInfo.argDef.repeat &&
-    argInfo.children.length < argInfo.argDef.repeat.arguments.length * (argInfo.argDef.repeat.max ?? Infinity);
+    argDef !== undefined &&
+    isFswCommandArgumentRepeat(argDef) &&
+    argInfo.children !== undefined &&
+    argDef.repeat !== null &&
+    argInfo.children.length < argDef.repeat.arguments.length * (argDef.repeat.max ?? Infinity);
 
   function addRepeatTuple() {
-    const repeatArgs = argInfo.argDef && isFswCommandArgumentRepeat(argInfo.argDef) && argInfo.argDef.repeat?.arguments;
+    const repeatArgs = argDef && isFswCommandArgumentRepeat(argDef) && argDef.repeat?.arguments;
     if (argInfo.node && repeatArgs) {
       addDefaultArgs(argInfo.node, repeatArgs);
     }
@@ -43,7 +67,7 @@
 </script>
 
 <fieldset>
-  {#if !argInfo.argDef}
+  {#if !argDef}
     {#if argInfo.text}
       <div class="st-typography-medium" title="Unknown Argument">Unknown Argument</div>
       <ExtraArgumentEditor
@@ -56,16 +80,38 @@
       />
     {/if}
   {:else}
-    <ArgTitle argDef={argInfo.argDef} />
-    {#if argInfo.argDef.arg_type === 'enum' && argInfo.node}
+    {#if argInfo.argDef}
+      <ArgTitle
+        argDef={argInfo.argDef}
+        {commandInfoMapper}
+        argumentValueCategory={isSymbol ? 'Symbol' : 'Literal'}
+        setInEditor={val => {
+          if (argInfo.node) {
+            setInEditor(argInfo.node, val);
+          }
+        }}
+      />
+    {/if}
+    {#if isSymbol && isFswCommandArgumentEnum(argDef)}
+      <div class="st-typography-small-caps">Reference</div>
+      <EnumEditor
+        {argDef}
+        initVal={argInfo.text ?? ''}
+        setInEditor={val => {
+          if (argInfo.node) {
+            setInEditor(argInfo.node, val);
+          }
+        }}
+      />
+    {:else if isFswCommandArgumentEnum(argDef) && argInfo.node}
       {#if commandInfoMapper.nodeTypeEnumCompatible(argInfo.node)}
         <EnumEditor
           {commandDictionary}
-          argDef={argInfo.argDef}
-          initVal={argInfo.text ?? ''}
+          {argDef}
+          initVal={unquoteUnescape(argInfo.text ?? '')}
           setInEditor={val => {
             if (argInfo.node) {
-              setInEditor(argInfo.node, val);
+              setInEditor(argInfo.node, quoteEscape(val));
             }
           }}
         />
@@ -81,19 +127,19 @@
           Convert to enum type
         </button>
       {/if}
-    {:else if isNumberArg(argInfo.argDef) && commandInfoMapper.nodeTypeNumberCompatible(argInfo.node ?? null)}
+    {:else if isNumberArg(argDef) && commandInfoMapper.nodeTypeNumberCompatible(argInfo.node ?? null)}
       <NumEditor
-        argDef={argInfo.argDef}
-        initVal={Number(argInfo.text) ?? argInfo.argDef.default_value ?? 0}
+        {argDef}
+        initVal={Number(argInfo.text) ?? argDef.default_value ?? 0}
         setInEditor={val => {
           if (argInfo.node) {
             setInEditor(argInfo.node, val.toString());
           }
         }}
       />
-    {:else if isFswCommandArgumentVarString(argInfo.argDef)}
+    {:else if isFswCommandArgumentVarString(argDef)}
       <StringEditor
-        argDef={argInfo.argDef}
+        {argDef}
         initVal={argInfo.text ?? ''}
         setInEditor={val => {
           if (argInfo.node) {
@@ -101,9 +147,9 @@
           }
         }}
       />
-    {:else if isFswCommandArgumentBoolean(argInfo.argDef)}
+    {:else if isFswCommandArgumentBoolean(argDef)}
       <BooleanEditor
-        argDef={argInfo.argDef}
+        {argDef}
         initVal={argInfo.text ?? ''}
         setInEditor={val => {
           if (argInfo.node) {
@@ -111,10 +157,17 @@
           }
         }}
       />
-    {:else if isFswCommandArgumentRepeat(argInfo.argDef) && !!argInfo.children}
+    {:else if isFswCommandArgumentRepeat(argDef) && !!argInfo.children}
       {#each argInfo.children as childArgInfo}
         {#if childArgInfo.node}
-          <svelte:self argInfo={childArgInfo} {commandInfoMapper} {commandDictionary} {setInEditor} {addDefaultArgs} />
+          <svelte:self
+            argInfo={childArgInfo}
+            {commandInfoMapper}
+            {commandDictionary}
+            {setInEditor}
+            {addDefaultArgs}
+            {variablesInScope}
+          />
         {/if}
       {/each}
       {#if argInfo.children.find(childArgInfo => !childArgInfo.node)}
@@ -125,15 +178,15 @@
             }
           }}
         />
-      {:else if !!argInfo.argDef.repeat}
+      {:else if !!argDef.repeat}
         <div>
           <button
             class="st-button secondary"
             disabled={!enableRepeatAdd}
             on:click={addRepeatTuple}
-            title={`Add additional set of argument values to ${argInfo.argDef.name} repeat array`}
+            title={`Add additional set of argument values to ${argDef.name} repeat array`}
           >
-            Add {argInfo.argDef.name} tuple
+            Add {argDef.name} tuple
           </button>
         </div>
       {/if}
diff --git a/src/components/sequencing/form/ArgTitle.svelte b/src/components/sequencing/form/ArgTitle.svelte
index 1bf4f41264..8bd3cabf33 100644
--- a/src/components/sequencing/form/ArgTitle.svelte
+++ b/src/components/sequencing/form/ArgTitle.svelte
@@ -3,6 +3,8 @@
 <script lang="ts">
   import type { FswCommandArgument } from '@nasa-jpl/aerie-ampcs';
   import { isArray } from 'lodash-es';
+  import type { CommandInfoMapper } from '../../../utilities/codemirror/commandInfoMapper';
+  import { getTarget } from '../../../utilities/generic';
   import Collapse from '../../Collapse.svelte';
   import {
     isFswCommandArgumentFloat,
@@ -13,10 +15,19 @@
   } from './../../../utilities/codemirror/codemirror-utils';
 
   export let argDef: FswCommandArgument;
+  export let commandInfoMapper: CommandInfoMapper;
+  export let setInEditor: (val: string) => void;
+  export let argumentValueCategory: 'Literal' | 'Symbol';
 
-  $: title = getArgTitle(argDef);
+  let title: string = '';
+  let typeInfo: string = '';
+  let formattedRange: string = '';
 
-  function compactType(argDef: FswCommandArgument) {
+  $: typeInfo = compactType(argDef);
+  $: title = getArgTitle(argDef, typeInfo);
+  $: formattedRange = formatRange(argDef);
+
+  function compactType(argDef: FswCommandArgument): string {
     if (isFswCommandArgumentUnsigned(argDef)) {
       return `U${argDef.bit_length}`;
     } else if (isFswCommandArgumentInteger(argDef)) {
@@ -30,7 +41,14 @@
     return '';
   }
 
-  function getArgTitle(argDef: FswCommandArgument) {
+  function formatRange(argDef: FswCommandArgument): string {
+    if ('range' in argDef && argDef.range !== null && !isArray(argDef.range)) {
+      return `[${argDef.range.min} – ${argDef.range.max}]`;
+    }
+    return '';
+  }
+
+  function getArgTitle(argDef: FswCommandArgument, typeInfo: string): string {
     if (
       isFswCommandArgumentRepeat(argDef) &&
       typeof argDef.repeat?.max === 'number' &&
@@ -39,18 +57,8 @@
       return `${argDef.name} - [${argDef.repeat?.min}, ${argDef.repeat?.max}] sets`;
     }
 
-    let compactTypeInfo = compactType(argDef);
-    if (compactTypeInfo) {
-      compactTypeInfo = ` [${compactTypeInfo}]`;
-    }
-    let base = `${argDef.name}${compactTypeInfo}`;
-    if ('range' in argDef && argDef.range) {
-      if (isArray(argDef.range)) {
-        base += ` [${argDef.range.join(', ')}]`;
-      } else {
-        base += ` [${argDef.range.min} – ${argDef.range.max}]`;
-      }
-    }
+    const bracketedTypeInfo = typeInfo && ` [${typeInfo}]`;
+    const base = `${argDef.name}${bracketedTypeInfo} ${formatRange(argDef)}`;
 
     if ('units' in argDef) {
       return `${base} – (${argDef.units})`;
@@ -58,10 +66,56 @@
 
     return base;
   }
+
+  function onValueTypeChange(event: Event) {
+    const { value } = getTarget(event);
+    if (value === 'Literal') {
+      setInEditor(commandInfoMapper.getDefaultValueForArgumentDef(argDef, {}));
+    } else {
+      setInEditor('VARIABLE_OR_CONSTANT_NAME');
+    }
+  }
 </script>
 
 <Collapse headerHeight={24} padContent={false} {title} defaultExpanded={false}>
-  <div style="padding-bottom: 4px">
-    {argDef.description}
+  <div class="w-100 labeled-values" style="padding-bottom: 4px">
+    {#if formattedRange}
+      <div>Range</div>
+      <div>{formattedRange}</div>
+    {/if}
+
+    {#if typeInfo}
+      <div>Type</div>
+      <div>{typeInfo}</div>
+    {/if}
+
+    {#if argDef.description}
+      <div>Description</div>
+      <div>
+        {argDef.description}
+      </div>
+    {/if}
+
+    <div>Value Type</div>
+
+    <select class="st-select" required bind:value={argumentValueCategory} on:change={onValueTypeChange}>
+      <option value="Literal"> Literal </option>
+      <option value="Symbol"> Symbol </option>
+    </select>
   </div>
 </Collapse>
+
+<style>
+  .labeled-values {
+    align-content: center;
+    align-items: top;
+    column-gap: 3px;
+    display: grid;
+    grid-template-columns: max-content 1fr;
+    row-gap: 2px;
+  }
+
+  .labeled-values > div:nth-child(odd) {
+    font-weight: bold;
+  }
+</style>
diff --git a/src/components/sequencing/form/EnumEditor.svelte b/src/components/sequencing/form/EnumEditor.svelte
index 0557b43b67..fdd6a67aa1 100644
--- a/src/components/sequencing/form/EnumEditor.svelte
+++ b/src/components/sequencing/form/EnumEditor.svelte
@@ -3,14 +3,14 @@
 <script lang="ts">
   import type { CommandDictionary, FswCommandArgumentEnum } from '@nasa-jpl/aerie-ampcs';
   import type { SelectedDropdownOptionValue } from '../../../types/dropdown';
-  import { quoteEscape, unquoteUnescape } from '../../../utilities/codemirror/codemirror-utils';
+  import { quoteEscape } from '../../../utilities/codemirror/codemirror-utils';
   import SearchableDropdown from '../../ui/SearchableDropdown.svelte';
 
   const SEARCH_THRESHOLD = 100;
   const MAX_SEARCH_ITEMS = 1_000;
 
   export let argDef: FswCommandArgumentEnum;
-  export let commandDictionary: CommandDictionary;
+  export let commandDictionary: CommandDictionary | null = null;
   export let initVal: string;
   export let setInEditor: (val: string) => void;
 
@@ -18,12 +18,10 @@
   let isValueInEnum: boolean = false;
   let value: string;
 
-  $: value = unquoteUnescape(initVal);
-  $: enumValues = commandDictionary.enumMap[argDef.enum_name]?.values?.map(v => v.symbol) ?? argDef.range ?? [];
+  $: value = initVal;
+  $: enumValues = commandDictionary?.enumMap[argDef.enum_name]?.values?.map(v => v.symbol) ?? argDef.range ?? [];
   $: isValueInEnum = !!enumValues.find(ev => ev === value);
-  $: {
-    setInEditor(quoteEscape(value));
-  }
+  $: setInEditor(value);
   $: options = enumValues.map(ev => ({
     display: ev,
     value: ev,
diff --git a/src/components/sequencing/form/SelectedCommand.svelte b/src/components/sequencing/form/SelectedCommand.svelte
index 0c1feff70f..2db1f2188d 100644
--- a/src/components/sequencing/form/SelectedCommand.svelte
+++ b/src/components/sequencing/form/SelectedCommand.svelte
@@ -1,7 +1,7 @@
 <svelte:options immutable={true} />
 
 <script lang="ts">
-  import type { SyntaxNode } from '@lezer/common';
+  import type { SyntaxNode, Tree } from '@lezer/common';
   import type {
     ChannelDictionary,
     CommandDictionary,
@@ -14,6 +14,8 @@
   import type { EditorView } from 'codemirror';
   import { debounce } from 'lodash-es';
   import { TOKEN_ERROR } from '../../../constants/seq-n-grammar-constants';
+  import { sequenceAdaptation } from '../../../stores/sequence-adaptation';
+  import type { ISequenceAdaptation } from '../../../types/sequencing';
   import type { CommandInfoMapper } from '../../../utilities/codemirror/commandInfoMapper';
   import { getCustomArgDef } from '../../../utilities/sequence-editor/extension-points';
   import Collapse from '../../Collapse.svelte';
@@ -36,6 +38,7 @@
   export let commandDictionary: CommandDictionary;
   export let parameterDictionaries: ParameterDictionary[];
   export let node: SyntaxNode | null;
+  export let tree: Tree | null;
   export let commandInfoMapper: CommandInfoMapper;
 
   const ID_COMMAND_DETAIL_PANE = 'ID_COMMAND_DETAIL_PANE';
@@ -47,12 +50,15 @@
   let editorArgInfoArray: ArgTextDef[] = [];
   let missingArgDefArray: FswCommandArgument[] = [];
   let timeTagNode: TimeTagInfo = null;
+  let variablesInScope: string[] = [];
 
   $: commandNode = commandInfoMapper.getContainingCommand(node);
   $: commandNameNode = commandInfoMapper.getNameNode(commandNode);
   $: commandName = commandNameNode && editorSequenceView.state.sliceDoc(commandNameNode.from, commandNameNode.to);
   $: commandDef = getCommandDef(commandDictionary, commandName ?? '');
   $: argInfoArray = getArgumentInfo(
+    commandInfoMapper,
+    editorSequenceView,
     commandInfoMapper.getArgumentNodeContainer(commandNode),
     commandDef?.arguments,
     undefined,
@@ -60,20 +66,44 @@
   );
   $: editorArgInfoArray = argInfoArray.filter(argInfo => !!argInfo.node);
   $: missingArgDefArray = getMissingArgDefs(argInfoArray);
-  $: timeTagNode = getTimeTagInfo(commandNode);
+  $: timeTagNode = getTimeTagInfo(editorSequenceView, commandNode);
+  $: variablesInScope = getVariablesInScope(
+    commandInfoMapper,
+    editorSequenceView,
+    $sequenceAdaptation,
+    tree,
+    commandNode?.from,
+  );
+
+  function getVariablesInScope(
+    infoMapper: CommandInfoMapper,
+    seqEditorView: EditorView,
+    adaptation: ISequenceAdaptation,
+    tree: Tree | null,
+    cursorPosition?: number,
+  ): string[] {
+    const globalNames = (adaptation.globals ?? []).map(globalVariable => globalVariable.name);
+    if (tree && cursorPosition !== undefined) {
+      const docText = seqEditorView.state.doc.toString();
+      return [...globalNames, ...infoMapper.getVariables(docText, tree, cursorPosition)];
+    }
+    return globalNames;
+  }
 
-  function getTimeTagInfo(commandNode: SyntaxNode | null): TimeTagInfo {
+  function getTimeTagInfo(seqEditorView: EditorView, commandNode: SyntaxNode | null): TimeTagInfo {
     const node = commandNode?.getChild('TimeTag');
 
     return (
       node && {
         node,
-        text: editorSequenceView.state.sliceDoc(node.from, node.to) ?? '',
+        text: seqEditorView.state.sliceDoc(node.from, node.to) ?? '',
       }
     );
   }
 
   function getArgumentInfo(
+    infoMapper: CommandInfoMapper,
+    seqEditorView: EditorView,
     args: SyntaxNode | null,
     argumentDefs: FswCommandArgument[] | undefined,
     parentArgDef: FswCommandArgumentRepeat | undefined,
@@ -84,7 +114,7 @@
     const parentRepeatLength = parentArgDef?.repeat?.arguments.length;
 
     if (args) {
-      for (const node of commandInfoMapper.getArgumentsFromContainer(args)) {
+      for (const node of infoMapper.getArgumentsFromContainer(args)) {
         if (node.name === TOKEN_ERROR) {
           continue;
         }
@@ -111,9 +141,16 @@
 
         let children: ArgTextDef[] | undefined = undefined;
         if (!!argDef && isFswCommandArgumentRepeat(argDef)) {
-          children = getArgumentInfo(node, argDef.repeat?.arguments, argDef, parameterDictionaries);
+          children = getArgumentInfo(
+            infoMapper,
+            seqEditorView,
+            node,
+            argDef.repeat?.arguments,
+            argDef,
+            parameterDictionaries,
+          );
         }
-        const argValue = editorSequenceView.state.sliceDoc(node.from, node.to);
+        const argValue = seqEditorView.state.sliceDoc(node.from, node.to);
         argArray.push({
           argDef,
           children,
@@ -145,11 +182,11 @@
     return commandDictionary?.fswCommandMap[stemName] ?? null;
   }
 
-  function setInEditor(token: SyntaxNode, val: string) {
+  function setInEditor(seqEditorView: EditorView, token: SyntaxNode, val: string) {
     // checking that we are not in the code mirror editor
     // this breaks cycle of form edits triggering document updates and vice versa
     if (
-      editorSequenceView &&
+      seqEditorView &&
       (hasAncestorWithId(document.activeElement, ID_COMMAND_DETAIL_PANE) ||
         // Searchable Dropdown has pop out that is not a descendent
         document.activeElement?.tagName === 'BODY' ||
@@ -157,10 +194,10 @@
         document.activeElement?.tagName === 'INPUT' ||
         document.activeElement?.tagName === 'SELECT')
     ) {
-      const currentVal = editorSequenceView.state.sliceDoc(token.node.from, token.node.to);
+      const currentVal = seqEditorView.state.sliceDoc(token.node.from, token.node.to);
       if (currentVal !== val) {
-        editorSequenceView.dispatch(
-          editorSequenceView.state.update({
+        seqEditorView.dispatch(
+          seqEditorView.state.update({
             changes: { from: token.node.from, insert: val, to: token.node.to },
             userEvent: 'formView',
           }),
@@ -218,7 +255,8 @@
                 {argInfo}
                 {commandDictionary}
                 {commandInfoMapper}
-                setInEditor={debounce(setInEditor, 250)}
+                {variablesInScope}
+                setInEditor={debounce((token, val) => setInEditor(editorSequenceView, token, val), 250)}
                 addDefaultArgs={(commandNode, missingArgDefArray) =>
                   addDefaultArgs(
                     commandDictionary,
@@ -262,7 +300,7 @@
                 initVal={commandName ?? ''}
                 setInEditor={val => {
                   if (commandNameNode) {
-                    setInEditor(commandNameNode, val);
+                    setInEditor(editorSequenceView, commandNameNode, val);
                   }
                 }}
               />
diff --git a/src/utilities/codemirror/commandInfoMapper.ts b/src/utilities/codemirror/commandInfoMapper.ts
index 12d77eda7b..b04269e0a4 100644
--- a/src/utilities/codemirror/commandInfoMapper.ts
+++ b/src/utilities/codemirror/commandInfoMapper.ts
@@ -1,4 +1,5 @@
-import type { SyntaxNode } from '@lezer/common';
+import type { SyntaxNode, Tree } from '@lezer/common';
+import type { EnumMap, FswCommandArgument } from '@nasa-jpl/aerie-ampcs';
 
 export interface CommandInfoMapper {
   /** format string of multiple arguments */
@@ -16,9 +17,23 @@ export interface CommandInfoMapper {
   /** ascends parse tree to find scope to display in form editor */
   getContainingCommand(node: SyntaxNode | null): SyntaxNode | null;
 
+  getDefaultValueForArgumentDef(argDef: FswCommandArgument, enumMap: EnumMap): string;
+
   /** finds the node in the parse tree containing the name */
   getNameNode(stepNode: SyntaxNode | null): SyntaxNode | null;
 
+  /**
+   * collect variables for populating select box, cursor position is used to limit scope to containing
+   * sequence in multiple sequence per file languages
+   */
+  // Consider filtering by type or allowing adaptation to filter by type
+  // not clear at this point what FSW does in terms of type coercion and
+  // what variable types are used for enums arguments
+  getVariables(docText: string, tree: Tree, cursor: number): string[];
+
+  /** is argument node a variable, false implies literal */
+  isArgumentNodeOfVariableType(argNode: SyntaxNode | null): boolean;
+
   /** checks if select list should be used */
   nodeTypeEnumCompatible(node: SyntaxNode | null): boolean;
 
diff --git a/src/utilities/codemirror/seq-n-tree-utils.ts b/src/utilities/codemirror/seq-n-tree-utils.ts
index bee5284b61..12045baa5a 100644
--- a/src/utilities/codemirror/seq-n-tree-utils.ts
+++ b/src/utilities/codemirror/seq-n-tree-utils.ts
@@ -1,4 +1,5 @@
-import type { SyntaxNode } from '@lezer/common';
+import type { SyntaxNode, Tree } from '@lezer/common';
+import type { EnumMap, FswCommandArgument } from '@nasa-jpl/aerie-ampcs';
 import {
   RULE_ARGS,
   RULE_COMMAND,
@@ -16,6 +17,8 @@ import {
   TOKEN_REQUEST,
   TOKEN_STRING,
 } from '../../constants/seq-n-grammar-constants';
+import { fswCommandArgDefault } from '../sequence-editor/command-dictionary';
+import { validateVariables } from '../sequence-editor/sequence-linter';
 import { getFromAndTo, getNearestAncestorNodeOfType } from '../sequence-editor/tree-utils';
 import type { CommandInfoMapper } from './commandInfoMapper';
 
@@ -85,10 +88,25 @@ export class SeqNCommandInfoMapper implements CommandInfoMapper {
     return getAncestorStepOrRequest(node);
   }
 
+  getDefaultValueForArgumentDef(argDef: FswCommandArgument, enumMap: EnumMap): string {
+    return fswCommandArgDefault(argDef, enumMap);
+  }
+
   getNameNode(stepNode: SyntaxNode | null): SyntaxNode | null {
     return getNameNode(stepNode);
   }
 
+  getVariables(docText: string, tree: Tree): string[] {
+    return [
+      ...validateVariables(tree.topNode.getChildren('LocalDeclaration'), docText, 'LOCALS').variables,
+      ...validateVariables(tree.topNode.getChildren('ParameterDeclaration'), docText, 'INPUT_PARAMS').variables,
+    ].map(v => v.name);
+  }
+
+  isArgumentNodeOfVariableType(argNode: SyntaxNode | null): boolean {
+    return argNode?.name === 'Enum';
+  }
+
   nodeTypeEnumCompatible(node: SyntaxNode | null): boolean {
     return node?.name === TOKEN_STRING;
   }
diff --git a/src/utilities/codemirror/vml/vmlAdaptation.ts b/src/utilities/codemirror/vml/vmlAdaptation.ts
index 8436915b47..cce847c934 100644
--- a/src/utilities/codemirror/vml/vmlAdaptation.ts
+++ b/src/utilities/codemirror/vml/vmlAdaptation.ts
@@ -1,6 +1,6 @@
 import { type CompletionContext, type CompletionResult } from '@codemirror/autocomplete';
 import { syntaxTree } from '@codemirror/language';
-import type { CommandDictionary, FswCommand, FswCommandArgument } from '@nasa-jpl/aerie-ampcs';
+import type { CommandDictionary, EnumMap, FswCommand, FswCommandArgument } from '@nasa-jpl/aerie-ampcs';
 import { getNearestAncestorNodeOfType } from '../../sequence-editor/tree-utils';
 import { RULE_FUNCTION_NAME, RULE_ISSUE, RULE_STATEMENT, TOKEN_STRING_CONST } from './vmlConstants';
 import { getArgumentPosition } from './vmlTreeUtils';
@@ -72,12 +72,12 @@ export function vmlAutoComplete(
 
 function getStemAndDefaultArguments(commandDictionary: CommandDictionary, cmd: FswCommand): string {
   if (cmd.arguments.length) {
-    return `${cmd.stem} ${cmd.arguments.map(argNode => getDefaultArgumentValue(commandDictionary, argNode)).join(',')}`;
+    return `${cmd.stem} ${cmd.arguments.map(argNode => getDefaultArgumentValue(argNode, commandDictionary.enumMap)).join(',')}`;
   }
   return cmd.stem;
 }
 
-function getDefaultArgumentValue(commandDictionary: CommandDictionary, argDef: FswCommandArgument): string {
+export function getDefaultArgumentValue(argDef: FswCommandArgument, enumMap: EnumMap): string {
   switch (argDef.arg_type) {
     case 'boolean':
       return argDef.default_value ?? 'TRUE';
@@ -88,7 +88,7 @@ function getDefaultArgumentValue(commandDictionary: CommandDictionary, argDef: F
       // ignores conversion setting
       return (argDef.default_value ?? argDef.range?.min)?.toString(10) ?? '0';
     case 'enum':
-      return `"${commandDictionary.enumMap[argDef.enum_name]?.values[0]?.symbol ?? ''}"`;
+      return `"${enumMap[argDef.enum_name]?.values[0]?.symbol ?? ''}"`;
     case 'var_string':
       return '""';
   }
diff --git a/src/utilities/codemirror/vml/vmlBlockLibrary.ts b/src/utilities/codemirror/vml/vmlBlockLibrary.ts
index bda41e72e2..7d6e460e91 100644
--- a/src/utilities/codemirror/vml/vmlBlockLibrary.ts
+++ b/src/utilities/codemirror/vml/vmlBlockLibrary.ts
@@ -8,6 +8,7 @@ import type {
   HwCommand,
   NumericRange,
 } from '@nasa-jpl/aerie-ampcs';
+import { filterEmpty } from '../../generic';
 import { VmlLanguage } from './vml';
 import {
   RULE_BLOCK,
@@ -49,7 +50,7 @@ export function vmlBlockLibraryToCommandDictionary(vml: string, id?: string, pat
     ...(parsed.topNode.getChild(RULE_FUNCTIONS)?.getChildren(RULE_FUNCTION) ?? []).map(blockNode =>
       blockToCommandDef(blockNode, vml),
     ),
-  ].filter((maybeCommandDef): maybeCommandDef is FswCommand => !!maybeCommandDef);
+  ].filter(filterEmpty);
 
   const mission_name = '';
   const spacecraft_ids = [0];
@@ -84,7 +85,7 @@ function blockToCommandDef(functionNode: SyntaxNode, vml: string): FswCommand |
   const parameterNodes = commonFunctionNode?.getChild(RULE_PARAMETERS)?.getChildren(RULE_PARAMETER) ?? [];
   const fswArguments: FswCommandArgument[] = parameterNodes
     ?.map(parameterNode => inputToArgument(parameterNode, vml))
-    .filter((maybeArg): maybeArg is FswCommandArgument => !!maybeArg);
+    .filter(filterEmpty);
 
   if (stem) {
     return {
@@ -205,7 +206,7 @@ function parseRange(parameterNode: SyntaxNode | null, vml: string): null | strin
         }
         return null;
       })
-      .filter((maybeRangeValue): maybeRangeValue is number | string | NumericRange => !!maybeRangeValue);
+      .filter(filterEmpty);
 
     // mixed arrays aren't resolved due to undefined meaning
     if (rangeValues.every(rangeValue => typeof rangeValue === 'number')) {
diff --git a/src/utilities/codemirror/vml/vmlConstants.ts b/src/utilities/codemirror/vml/vmlConstants.ts
index b78f1a4c91..f0744cb548 100644
--- a/src/utilities/codemirror/vml/vmlConstants.ts
+++ b/src/utilities/codemirror/vml/vmlConstants.ts
@@ -24,6 +24,9 @@ export const RULE_END_WHILE = 'End_while';
 export const RULE_FOR = 'For_statement';
 export const RULE_END_FOR = 'End_for';
 
+export const RULE_VARIABLE_NAME_CONSTANT = 'Variable_name_constant';
+export const RULE_VARIABLE_DECLARATION_TYPE = 'Variable_declaration_type';
+export const RULE_VARIABLE_DECLARATION_WITH_OPTIONAL_TLM_ID = 'Variable_declaration_with_optional_tlm_id';
 export const RULE_ASSIGNMENT = 'Assignment';
 export const RULE_STATEMENT = 'Statement';
 export const RULE_TIME_TAGGED_STATEMENTS = 'Time_tagged_statements';
@@ -48,6 +51,7 @@ export const RULE_VARIABLE_NAME = 'Variable_name';
 export const RULE_DATA_KIND = 'Data_kind';
 export const RULE_COMMENT = 'Comment';
 export const RULE_INPUT_OUTPUT_PARAMETER = 'Input_output_parameter';
+export const RULE_INPUT_PARAMETER = 'Input_parameter';
 export const RULE_OPTIONAL_DEFAULT_INPUT_VALUE = 'Optional_default_input_value';
 export const RULE_OPTIONAL_VALUE_LIST = 'Optional_value_list';
 export const RULE_INPUT_RANGE = 'Input_Range';
diff --git a/src/utilities/codemirror/vml/vmlFormatter.ts b/src/utilities/codemirror/vml/vmlFormatter.ts
index a8d2f3855f..fd796a719e 100644
--- a/src/utilities/codemirror/vml/vmlFormatter.ts
+++ b/src/utilities/codemirror/vml/vmlFormatter.ts
@@ -2,6 +2,7 @@ import { syntaxTree } from '@codemirror/language';
 import type { ChangeSpec, EditorState } from '@codemirror/state';
 import type { SyntaxNode } from '@lezer/common';
 import { EditorView } from 'codemirror';
+import { filterEmpty } from '../../generic';
 import {
   RULE_ASSIGNMENT,
   RULE_CALL_PARAMETERS,
@@ -142,7 +143,7 @@ export function vmlFormat(view: EditorView): void {
   const docText = state.toText(state.sliceDoc());
 
   const maybeChanges = linesToFormat.flatMap((line: LineOfNodes) => {
-    const firstNode = line.find(maybeNode => !!maybeNode);
+    const firstNode = line.find(filterEmpty);
     if (firstNode === undefined) {
       // unexpected case of no nodes on line
       return [];
@@ -150,7 +151,7 @@ export function vmlFormat(view: EditorView): void {
 
     const commandLine = docText.lineAt(firstNode.from);
 
-    const filteredArray: SyntaxNode[] = line.filter((maybeNode): maybeNode is SyntaxNode => !!maybeNode);
+    const filteredArray: SyntaxNode[] = line.filter(filterEmpty);
     const deletions: ChangeSpec[] = [];
 
     // remove indentation at start of line
@@ -209,10 +210,7 @@ export function vmlFormat(view: EditorView): void {
     return [...deletions, ...insertions];
   });
 
-  const changes = [
-    ...commandIndentChangeMap.values(),
-    ...maybeChanges.filter((maybeChange): maybeChange is ChangeSpec => !!maybeChange),
-  ];
+  const changes = [...commandIndentChangeMap.values(), ...maybeChanges.filter(filterEmpty)];
 
   // Consider delete end of line whitespace
   // Consider alignment of comments
diff --git a/src/utilities/codemirror/vml/vmlTreeUtils.test.ts b/src/utilities/codemirror/vml/vmlTreeUtils.test.ts
index 14d9920fa6..120f4f7c85 100644
--- a/src/utilities/codemirror/vml/vmlTreeUtils.test.ts
+++ b/src/utilities/codemirror/vml/vmlTreeUtils.test.ts
@@ -28,7 +28,7 @@ END_MODULE
     filterNodes(parsed.cursor(), (node: SyntaxNode) => node.name === RULE_TIME_TAGGED_STATEMENT),
   );
 
-  test('time tagged count', () => {
+  test('filterNodes finds time tagged statements', () => {
     expect(timeTaggedNodes.length).toBe(3);
   });
 
@@ -36,12 +36,14 @@ END_MODULE
     [0, 'CMD_001'],
     [1, 'CMD_002'],
     [2, null],
-  ])('command %i name %s', (statementIndex: number, expectedStem: string | null) => {
+  ])('command[%i] has stem %s', (statementIndex: number, expectedStem: string | null) => {
     const nameNode = vmlCommandInfoMapper.getNameNode(timeTaggedNodes[statementIndex]);
     if (expectedStem) {
       expect(nameNode).toBeDefined();
-      expect(nameNode!.name).toBe(RULE_FUNCTION_NAME);
+      expect(nameNode?.name).toBe(RULE_FUNCTION_NAME);
       expect(nodeContents(input, nameNode!)).toBe(expectedStem);
+    } else {
+      expect(nameNode).toBeNull();
     }
   });
 
@@ -49,7 +51,7 @@ END_MODULE
     [0, 2],
     [1, 4],
     [2, 1],
-  ])('command %i argument count %s', (statementIndex: number, argCount: number) => {
+  ])('command[%i] has %s argument(s)', (statementIndex: number, argCount: number) => {
     const argContainer = vmlCommandInfoMapper.getArgumentNodeContainer(timeTaggedNodes[statementIndex]);
     expect(argContainer).toBeDefined();
     expect(argContainer!.name).toBe(RULE_CALL_PARAMETERS);
@@ -63,7 +65,7 @@ END_MODULE
     ['2', 1],
     ['3', 2],
     ['4', 3],
-  ])("argument value '%s' index %i", (argumentValue: string, argIndexInCommand: number) => {
+  ])("argument value '%s' is at index %i of its command", (argumentValue: string, argIndexInCommand: number) => {
     const argValueFilter = (node: SyntaxNode) => nodeContents(input, node) === argumentValue;
     const argNode = filterNodes(parsed.cursor(), argValueFilter).next().value as SyntaxNode;
     expect(argNode).toBeDefined();
@@ -78,4 +80,56 @@ END_MODULE
     const cmdNode = vmlCommandInfoMapper.getContainingCommand(argNode);
     expect(vmlCommandInfoMapper.getArgumentAppendPosition(cmdNode)).toBe(inputPosition);
   });
+
+  test('getVariables returns module variables and sequence/block parameters and variables', () => {
+    const input = `MODULE
+
+VARIABLES
+  DECLARE DOUBLE partial_product := 0.0
+  DECLARE STRING file_base := "d:/cfg/instrument_"
+END_VARIABLES
+
+
+BLOCK special_watch
+INPUT delay_time
+INPUT INT mode := 3 VALUES 1..6, 8..9
+DECLARE INT i := 0
+DECLARE INT value := 0
+DECLARE UINT mask := 0xffff
+DECLARE STRING file_name := ""
+DECLARE STRING str := ""
+FLAGS AUTOEXECUTE AUTOUNLOAD
+BODY
+;initialize variables
+R00:00:01.00 ISSUE CMD_001 "ENUM_B",FALSE_VM_CONST
+R00:00:01.00 ISSUE CMD_002 1,2,3,4
+
+
+;TEST CASE 1
+R00:01:00 CALL pay_spawn "seis_pwr_on_r01_1"
+
+END_BODY
+
+BLOCK another_block
+INPUT cant_see_me
+; these parameters should be unseen as they're out of scope of cursor position in test
+BODY
+END_BODY
+END_MODULE
+    `;
+
+    const moduleVariables = ['partial_product', 'file_base'];
+    const parsed = VmlLanguage.parser.parse(input);
+    const vmlCommandInfoMapper = new VmlCommandInfoMapper();
+    const variableNames = vmlCommandInfoMapper.getVariables(input, parsed, input.indexOf('CMD_002'));
+    expect(variableNames).toEqual([...moduleVariables, 'delay_time', 'mode', 'i', 'value', 'mask', 'file_name', 'str']);
+
+    // 2nd block has different scope
+    const variableNames2 = vmlCommandInfoMapper.getVariables(
+      input,
+      parsed,
+      input.indexOf('another_block') + 'another_block'.length,
+    );
+    expect(variableNames2).toEqual([...moduleVariables, 'cant_see_me']);
+  });
 });
diff --git a/src/utilities/codemirror/vml/vmlTreeUtils.ts b/src/utilities/codemirror/vml/vmlTreeUtils.ts
index 231fdc878f..a3c7cf3f22 100644
--- a/src/utilities/codemirror/vml/vmlTreeUtils.ts
+++ b/src/utilities/codemirror/vml/vmlTreeUtils.ts
@@ -1,15 +1,25 @@
-import type { SyntaxNode } from '@lezer/common';
-import { getChildrenNode, getNearestAncestorNodeOfType } from '../../sequence-editor/tree-utils';
+import type { SyntaxNode, Tree } from '@lezer/common';
+import type { EnumMap, FswCommandArgument } from '@nasa-jpl/aerie-ampcs';
+import { filterEmpty } from '../../generic';
+import { filterNodesToArray, getChildrenNode, getNearestAncestorNodeOfType } from '../../sequence-editor/tree-utils';
 import type { CommandInfoMapper } from '../commandInfoMapper';
+import { getDefaultArgumentValue } from './vmlAdaptation';
 import {
   RULE_CALL_PARAMETER,
   RULE_CALL_PARAMETERS,
+  RULE_COMMON_FUNCTION,
   RULE_CONSTANT,
   RULE_FUNCTION_NAME,
+  RULE_INPUT_OUTPUT_PARAMETER,
+  RULE_INPUT_PARAMETER,
   RULE_ISSUE,
   RULE_SIMPLE_EXPR,
   RULE_STATEMENT,
   RULE_TIME_TAGGED_STATEMENT,
+  RULE_VARIABLE_DECLARATION_TYPE,
+  RULE_VARIABLE_DECLARATION_WITH_OPTIONAL_TLM_ID,
+  RULE_VARIABLE_NAME,
+  RULE_VARIABLE_NAME_CONSTANT,
   TOKEN_COMMA,
   TOKEN_INT_CONST,
   TOKEN_STRING_CONST,
@@ -53,6 +63,10 @@ export class VmlCommandInfoMapper implements CommandInfoMapper {
     return getNearestAncestorNodeOfType(node, [RULE_TIME_TAGGED_STATEMENT]);
   }
 
+  getDefaultValueForArgumentDef(argDef: FswCommandArgument, enumMap: EnumMap): string {
+    return getDefaultArgumentValue(argDef, enumMap);
+  }
+
   getNameNode(statementNode: SyntaxNode | null): SyntaxNode | null {
     const statementSubNode = statementNode?.getChild(RULE_STATEMENT)?.getChild(RULE_ISSUE);
     if (statementSubNode?.name === RULE_ISSUE) {
@@ -62,6 +76,47 @@ export class VmlCommandInfoMapper implements CommandInfoMapper {
     return null;
   }
 
+  getVariables(docText: string, tree: Tree, position: number): string[] {
+    // VML Variable_declaration_with_optional_tlm_id are per module (only 1 module per file)
+    // VML Common_Function may contain Parameters and Variable_declarations
+
+    const moduleVariables = filterNodesToArray(
+      tree.cursor(),
+      node => node.name === RULE_VARIABLE_DECLARATION_WITH_OPTIONAL_TLM_ID,
+    )
+      .map(node =>
+        node
+          .getChild(RULE_VARIABLE_DECLARATION_TYPE)
+          ?.getChild(RULE_VARIABLE_NAME_CONSTANT)
+          ?.getChild(RULE_VARIABLE_NAME),
+      )
+      .filter(filterEmpty)
+      .map(node => docText.slice(node.from, node.to));
+
+    const positionNode = tree.resolveInner(position);
+    const commonFunctionNode = getNearestAncestorNodeOfType(positionNode, [RULE_COMMON_FUNCTION]);
+    if (commonFunctionNode) {
+      const subTreeOffset = commonFunctionNode.from;
+      const commonFunctionParametersAndVariables = filterNodesToArray(commonFunctionNode.toTree().cursor(), node =>
+        [RULE_INPUT_PARAMETER, RULE_INPUT_OUTPUT_PARAMETER, RULE_VARIABLE_NAME_CONSTANT].includes(node.name),
+      )
+        .map(node => node.getChild(RULE_VARIABLE_NAME))
+        .filter(filterEmpty)
+        .map(node => docText.slice(subTreeOffset + node.from, subTreeOffset + node.to));
+      return [...moduleVariables, ...commonFunctionParametersAndVariables];
+    }
+
+    return moduleVariables;
+  }
+
+  isArgumentNodeOfVariableType(argNode: SyntaxNode | null): boolean {
+    if (argNode?.name === RULE_CALL_PARAMETER) {
+      const variableNameNode = argNode.getChild(RULE_SIMPLE_EXPR)?.getChild(RULE_VARIABLE_NAME);
+      return !!variableNameNode && variableNameNode.from === argNode.from && variableNameNode.to === argNode.to;
+    }
+    return false;
+  }
+
   nodeTypeEnumCompatible(node: SyntaxNode | null): boolean {
     return !!node?.getChild(RULE_SIMPLE_EXPR)?.getChild(RULE_CONSTANT)?.getChild(TOKEN_STRING_CONST);
   }
diff --git a/src/utilities/sequence-editor/sequence-linter.ts b/src/utilities/sequence-editor/sequence-linter.ts
index 6f00786a5d..2ccc4952b8 100644
--- a/src/utilities/sequence-editor/sequence-linter.ts
+++ b/src/utilities/sequence-editor/sequence-linter.ts
@@ -305,7 +305,7 @@ function validateCommandTypeMixing(node: SyntaxNode): Diagnostic[] {
   return diagnostics;
 }
 
-function validateVariables(inputParams: SyntaxNode[], text: string, type: 'INPUT_PARAMS' | 'LOCALS' = 'LOCALS') {
+export function validateVariables(inputParams: SyntaxNode[], text: string, type: 'INPUT_PARAMS' | 'LOCALS' = 'LOCALS') {
   const variables: VariableDeclaration[] = [];
   const diagnostics: Diagnostic[] = [];
 
diff --git a/src/utilities/sequence-editor/tree-utils.ts b/src/utilities/sequence-editor/tree-utils.ts
index c933c23870..6f8b58c5f2 100644
--- a/src/utilities/sequence-editor/tree-utils.ts
+++ b/src/utilities/sequence-editor/tree-utils.ts
@@ -77,7 +77,7 @@ export function checkContainment(node: SyntaxNode, typesOfAncestorsAndSelf: (str
   return false;
 }
 
-export function* filterNodes(cursor: TreeCursor, filter?: (name: SyntaxNode) => boolean): Generator<SyntaxNode> {
+export function* filterNodes(cursor: TreeCursor, filter?: (node: SyntaxNode) => boolean): Generator<SyntaxNode> {
   do {
     const { node } = cursor;
     if (!filter || filter(node)) {
@@ -86,6 +86,10 @@ export function* filterNodes(cursor: TreeCursor, filter?: (name: SyntaxNode) =>
   } while (cursor.next());
 }
 
+export function filterNodesToArray(cursor: TreeCursor, filter?: (node: SyntaxNode) => boolean): SyntaxNode[] {
+  return Array.from(filterNodes(cursor, filter));
+}
+
 export function nodeContents(input: string, node: SyntaxNode): string {
   return input.substring(node.from, node.to);
 }