The number of language tooling enhancements added to Orion for the 8.0 release is so large we had to break it up into two parts. The first part explained the introduction of hovers. Try out all of these new features right now at orionhub.org
JS Validation
There are plenty of bug fixes and several new rules added to our JavaScript validator in 8.0. ESLint, which runs our validation rules, was updated to version 0.8.2.
- Assignments in conditional expressions:
- Reserved words used as property keys:
- Constant as conditional expression:
- Trailing commas in object expressions
- Discouraged console use in browser code
- Multiple spaces in regular expressions
- Discouraged __iterator__ property use
Remember that you can configure the severity for each rule on the JavaScript settings page, or modify the severity for a specific file by adding an ESLint comment to your file.
Another cool new feature in Orion is the Show Problems action. Available by right clicking on a file or folder in the navigation pane > Show Problems… This will run the validator on all of the selected content, displaying the entire list of of issues. The list can be filtered by text or source file and clicking on any problem will take you directly to the annotation.
CSS Validation
Potential problems in your CSS files are found using CSSLint 0.10.0. You can now configure the severity of each problem on the CSS settings page.
You can also configure the severity of problems in each file by adding a csslint embedded ruleset. There is also now content assist proposals to help you set the severity for specific rules.
Quickfixes
When hovering over problem annotations in the editor you may see links to resolve the issue. This is the new quickfix feature. Quickfixes provide one click solutions to fix problems in your code.
There is no service API to provide quickfixes. Currently you must provide commands with a scopeID of ‘orion.edit.quickfix’. The commands will be rendered as links under problem annotations. In 9.0 we are looking into making quickfixes be contributed through a separate API.
The JavaScript tooling and CSS tooling both provide quickfixes for some problem types and we plan to continue adding more throughout the next release.
File Navigation
Quickly searching and navigating between source files is one of the major benefits of coding in an IDE over a simple text editor. Finding the file referenced in a Node.js or AMD Module dependency can be time consuming. Orion 8.0 has a number of improvements to make this much easier.
In JavaScript, under the tools menu, you can use the Open Declaration command to jump to the function declaration for your selection (don’t forget that hovering will show you the formatted JSDoc for the function). The keybinding for this is F3.
We also provide a hover that will link to absolute and workspace relative paths, allowing one click access to your dependencies.
This feature extends to the CSS and HTML tooling as well allowing you to swiftly move between associated files.
If the tooling isn’t sure which file you are referring to, a list of potential files is displayed.
HTML with embedded scripts and styles
The quality tooling available when editing JavaScript and CSS files is also available in the HTML editor. When there are embedded scripts and CSS styling in an HTML file content assist, validation, hovers, quickfixes and file navigation are all available. All of the embedded content is handled as a single unit like the browser will, so you can use tools like Jump to Declaration even if the script is split up in the HTML source.