Repository navigation
Add scopes for function and variable references #149
Description
From Gregory (@chmln) on April 15, 2016 20:18
- VSCode Version: 1.0.0-insider
- OS Version: Windows 10
Steps to Reproduce:
- Open any js file with abundant variables and functions
- Compare with any other popular editor e.g. sublime, atom, brackets, etc
VS Code is a fantastic editor. However, for an editor that accentuates support for JavaScript, the syntax highlighting is less than sub-par.
To illustrate, here's VS Code and Sublime using the same color scheme:
The color scheme isn't at fault since the default (dark+) theme is not much better
Here's the code in screenshot:
init = function () {
navigationCurrentMonth.className = 'flatpickr-current-month';
calendarContainer.className = 'flatpickr-calendar';
calendar.className = "flatpickr-days";
instanceConfig = instanceConfig || {};
self.config = {};
self.element = element;
for (var config in self.defaultConfig)
self.config[config] =
instanceConfig[config] ||
self.element.dataset&&self.element.dataset[config.toLowerCase()] ||
self.element.getAttribute("data-"+config)||
self.defaultConfig[config];
self.input = (self.config.wrap) ? element.querySelector("[data-input]") : element;
if(self.config.defaultDate){
self.config.defaultDate = uDate(self.config.defaultDate);
}
if ( self.input.value || self.config.defaultDate )
self.selectedDateObj = uDate(self.config.defaultDate||self.input.value);
self.config.minDate =
uDate(self.config.minDate === "today" ? new Date() : self.config.minDate, true);
self.config.maxDate = uDate(self.config.maxDate, true);
self.jumpToDate(self.selectedDateObj||self.config.minDate||currentDate);
wrap();
buildCalendar();
bind();
if (!self.config.noCalendar)
updateValue();
};Significant and absolutely necessary enhancements can be brought in by highlighting:
- Variables
- Function names
- Methods
Copied from original issue: microsoft/vscode#5361
Reacted by Glen, Gudjon, Alexey Svetliakov, shakvaal, Adam Reis, Alex, Daniel Imms, Wade Anderson, lovefurniture and Shane Yu
Activity
aeschli commentedon Apr 21, 2016
The build-in default themes do - by design- not highlight variable, method and function references.
The dark/light theme colorize however declarations.
Gregory (@chmln) Which custom theme do you use?
aeschli commentedon Apr 21, 2016
From Gregory (@chmln) on April 20, 2016 21:12
One Dark
I have tried all the popular color themes, and not a single one has colored variables, methods, etc.
Logically, that can be explained by two scenarios:
aeschli commentedon Apr 21, 2016
From Gregory (@chmln) on April 20, 2016 21:12
aeschli commentedon Apr 21, 2016
From Daniel Imms (@Tyriar) on April 20, 2016 21:51
The root issue here is that https://github.com/Microsoft/TypeScript-TmLanguage does not scope variables and method calls.
aeschli commentedon Apr 21, 2016
From Gregory (@chmln) on April 20, 2016 22:2
That explains it.
I see issues like #72 so I surely can't be the first one to notice those shortcomings.
aeschli commentedon Apr 21, 2016
Looking at Atom JS grammar it seems they use the
support.functionscope for function references.For variable references it's
variables.other.object.We would still need a scope that stands for just the variable declaration.
Moving this to the TM/JS grammar team for consideration. I personally think we should stick to what we have.
gaui commentedon May 15, 2016
👍 I was shocked to see how poor JavaScript syntax highlighting is compared to Sublime and Atom. Hope this gets taken care of.
[-]JavaScript syntax highlighting[/-][+]Add scopes for function and variable references[/+]adamreisnz commentedon Jun 22, 2016
It was indeed rather shocking to see the sub-par syntax highlighting for typescript when compared to javascript.
I might add that syntax highlighting in Atom for TypeScript files is bad too, as the
atom-typescriptpackage uses the grammar files from this repository. As such, comparing.tscode to.jscode results in something like this (ignore the color differences, just see how much more detail there is):TS:
JS:
Over the past few months, syntax highlighting in the
language-javascriptpackage has improved significantly, with good support for ES6 features and much improved highlighting of variables, properties, methods calls, etc.Maybe it's possible to convert/copy some of the improved grammar rules from JS and use them for TS as well?
wclr commentedon Aug 21, 2016
+1
glen-84 commentedon Aug 21, 2016
Renamed in favour of (@whitecolor) Please don't post
+1comments. Use reactions instead.sheetalkamat commentedon Sep 27, 2016
Fixed with #270