BrighterScript: Enhanced Code Completion For 'extends'

Hey everyone! Today, we're diving into a cool enhancement for BrighterScript, specifically focusing on improving code completion when using the extends keyword. It's all about making your coding experience smoother and more efficient. Let's get started!

The Issue: Rough Code Completion After extends

Currently, the code completion after typing extends in BrighterScript isn't as helpful as it could be. It's a bit rough around the edges, and some of you might have noticed this while working on your Roku projects. Additionally, extends isn't even recognized as its own token, which is a bit odd. This can lead to a less-than-ideal coding experience, especially when you're trying to quickly and accurately specify which class, interface, or component your current element should inherit from.

Why is Code Completion Important?

Code completion is a crucial feature in any modern IDE or code editor. It helps you write code faster, reduces typos, and makes it easier to discover available classes, methods, and properties. A good code completion system understands the context of your code and suggests only relevant options, saving you time and frustration. When code completion works seamlessly, it allows you to focus on the logic and structure of your application rather than memorizing every class name or method signature. For BrighterScript, enhancing code completion for keywords like extends is a significant step towards improving the overall developer experience.

The Goal: Smarter Suggestions

The goal here is to make the code completion after extends smarter. We want the IDE to suggest only the classes, interfaces, or components that are valid options for inheritance. This means:

• When extending a class, only other classes should be suggested.
• When extending an interface, other interfaces and components should be suggested.

This level of specificity will greatly improve the efficiency and accuracy of your coding, preventing errors and speeding up development.

Proposed Solution: Targeted Code Completion

To address this, we need to ensure that the code completion system in BrighterScript can differentiate between classes, interfaces, and components, and suggest options accordingly. Here’s a breakdown of how we can achieve this:

1. Token Recognition: First, extends needs to be recognized as its own token. This will allow the code completion system to better understand the context and trigger suggestions at the appropriate time.
2. Contextual Analysis: The system needs to analyze the code to determine whether we are extending a class or an interface. This can be done by looking at the declaration of the current element (class or interface).
3. Filtering Suggestions: Based on the context, the code completion system should filter the suggestions to show only valid options:
   • If extending a class, show only other classes.
   • If extending an interface, show other interfaces and components.

Test Cases: Ensuring Correct Behavior

To ensure that the improved code completion works as expected, we can use test cases. These tests will simulate different scenarios and verify that the correct suggestions are displayed. Let's look at some examples:

Test Case 1: Extending a Class

Consider the following BrighterScript code:

class Klass1
    end class

class Klass2 extends
    end class

When the cursor is after extends in Klass2, the code completion should only suggest Klass1 (and other classes in the project). It should not suggest interfaces or components.

This test case ensures that the code completion system correctly filters suggestions to show only classes when extending a class. By validating this scenario, we can be confident that the system behaves as expected in a typical class inheritance situation. This helps prevent accidental selection of incorrect types, which can lead to runtime errors or unexpected behavior.

Test Case 2: Extending an Interface

Now, let's look at extending an interface:

interface IFace1
    end interface

interface IFace2 extends
    end interface

In this case, when the cursor is after extends in IFace2, the code completion should suggest IFace1 (and other interfaces) as well as any components defined in the project. For example, if we have a component defined in an XML file like this:

<component name="myNode" extends="Group">
</component>

The code completion should also suggest roSGNodeMyNode because components implicitly define an interface with the prefix roSGNode. This ensures that interfaces can correctly extend other interfaces and incorporate component interfaces, providing a flexible and robust system for defining contracts and behaviors in BrighterScript applications.

Code Examples: Putting it into Practice

Let's dive deeper into some code examples to illustrate how the improved code completion would work in practice. These examples will help you visualize the benefits and understand how the new system enhances the development process.

Extending Classes: A Practical Example

Imagine you're building a game with BrighterScript, and you have a base class called GameObject that defines common properties and methods for all game objects. You might have subclasses like Player, Enemy, and Projectile that inherit from GameObject. With the improved code completion, when you start typing class Player extends, the IDE will immediately suggest GameObject as a possible option.

class GameObject
    public x as integer
    public y as integer

    public function new()
        m.x = 0
        m.y = 0
    end function

    public function move(x as integer, y as integer)
        m.x += x
        m.y += y
    end function
end class

class Player extends 'GameObject' // Code completion suggests GameObject here
    public function new()
        super()
    end function
end class

This makes it incredibly easy to ensure that your classes are correctly inheriting from the intended base classes, reducing the chance of errors and speeding up development. The code completion system acts as a guide, helping you navigate the class hierarchy and maintain a well-structured codebase.

Extending Interfaces: Creating Flexible Components

Interfaces are essential for defining contracts in BrighterScript, allowing you to create flexible and modular components. With the enhanced code completion, extending interfaces becomes even more straightforward. For example, you might define an interface called IDrawable that specifies a draw() method. Then, you can create different components that implement this interface, such as Circle and Square. When defining a new interface that extends IDrawable, the code completion system will suggest IDrawable as a possible option, along with other relevant interfaces and components.

interface IDrawable
    function draw()
end interface

interface IShape extends 'IDrawable' // Code completion suggests IDrawable here
    function getArea() as float
end interface

class Circle implements IShape
    public function draw()
        // Draw circle
    end function

    public function getArea() as float
        // Calculate area
        return 0.0
    end function
end class

This feature ensures that your interfaces are correctly extending the necessary contracts, promoting code reusability and maintainability. By providing accurate suggestions, the code completion system helps you adhere to design principles and create robust applications.

Integrating Components: Seamless Interface Implementation

Components in BrighterScript often need to implement interfaces to interact with other parts of the application. With the improved code completion, integrating components with interfaces becomes a seamless process. For instance, if you have a component defined in an XML file that should implement an interface, the code completion system will suggest the relevant interface when you're defining the component's class.

<component name="MyComponent" extends="Group">
    <interface name="MyInterface"/>
</component>

interface MyInterface
    function doSomething()
end interface

class MyComponentClass implements 'MyInterface' // Code completion suggests MyInterface here
    public function doSomething()
        // Implementation
    end function
end class

This ensures that your components correctly implement the required interfaces, preventing runtime errors and promoting a consistent architecture. The code completion system acts as a guide, helping you create components that seamlessly integrate with the rest of your application.

The Tests

The following tests are designed to verify the improved code completion behavior:

describe('extends', () => {
    it('should show only other classes for a class', () => {
        program.setFile('source/main.bs', `
            class Klass1
            end class

            class Klass2 extends
            end class
        `);

        program.validate();
        //   class Klass2 extends |
        let completions = program.getCompletions('source/main.bs', util.createPosition(4, 37));
        expectCompletionsIncludes(completions, [{
            label: 'Klass1',
            kind: CompletionItemKind.Class
        }]);
        expect(completions.length).to.eql(1);
    });

    it('should show other interfaces and components for an interface', () => {

        program.setFile('components/myNode.xml',
            trim`<component name="myNode" extends="group">
            </component>
        `);

        program.setFile('source/main.bs', `
            interface IFace1
            end interface

            interface IFace2 extends 
            end interface
        `);

        program.validate();
        //   interface IFace2 extends |
        let completions = program.getCompletions('source/main.bs', util.createPosition(4, 42));
        expectCompletionsIncludes(completions, [{
            label: 'IFace1',
            kind: CompletionItemKind.Class
        }]);

        expectCompletionsIncludes(completions, [{
            label: 'roSGNodeMyNode',
            kind: CompletionItemKind.Interface
        }]);
    });
});

These tests cover the two main scenarios: extending a class and extending an interface. They ensure that the code completion system suggests the correct options in each case, providing confidence in the improved functionality.

Conclusion: A Step Towards Better BrighterScripting

Improving code completion for the extends keyword in BrighterScript is a significant step towards enhancing the overall developer experience. By providing smarter suggestions, we can help you write code faster, reduce errors, and create more robust applications. This enhancement will make BrighterScript an even more powerful and enjoyable language to work with. Stay tuned for more updates and improvements as we continue to make BrighterScript the best it can be! Happy coding, guys!