Allow for empty CSS variable definitions

[rodrigogiraoserrao]

Consider the following CSS snippets:

$x: 
* {
    background: red;
}

$x:
* {
    background: $x;
}

* {
    background: red;
}
$x:

All three should work with the following behaviour:

• an empty variable definition is allowed; and
• setting a style to an empty variable should unset that style.

For example, 2. should unset the background of all widgets.

As of now, 2. and 3. can't be parsed.
2. raises an error regarding an undefined variable and 3. raises an AttributeError inside substitute_references in parse.py.

[rodrigogiraoserrao]

(This issue is reserved for the EuroPython 2023 sprint. If you are not participating in the sprint, please refrain from working on this issue. Thanks!)

This isn't a trivial fix but it also isn't an impossible one.
If you like puzzles, this might be a good one for you!
Fixing this will likely require toying with the CSS parser in src/textual/css/parser.py.

Good luck and have fun!

[zormit]

We'll have a look (@eliasdorneles and I). We're sitting in RB116@EuroPython Sprints.

[rodrigogiraoserrao]

Sure thing. Feel free to join us at 103 if you want.

[eliasdorneles]

I've noticed that this also breaks, with the same error as 2 (undefined variable):

* {
    background: $x;
}

$x: red;

@rodrigogiraoserrao is this expected? do the CSS variables need to be declared before they're used?

[rodrigogiraoserrao]

I'm not sure if we want to have the ability of using a variable before defining it, but it doesn't shock me that you have to define it before using it.
So, I'd say to worry about the other cases first and then this could come after.

What do you think?

[github-actions]

Don't forget to star the repository!

Follow @textualizeio for Textual updates.