Introducing React ReExt – Sencha Ext JS Components in React! LEARN MORE

Sencha Eclipse Plugin 2.0 New and Noteworthy

February 26, 2013 122 Views
Show

Guest Blog Post

### Intro ###

Sencha Eclipse Plugin 2.0Sencha Eclipse Plugin is a full code assist, searching and validation plugin for the popular Eclipse IDE. With the plugin, you’re able to get code assist for standard Sencha Touch 2.1 and Ext JS 4.0.7, 4.1.x types, as well as Ext Classes that you define as a part of your project.

With Sencha Eclipse Plugin 2.0, the following stories were worked on:

* VJET move to the Eclipse Foundation.
* Enhance Sencha Eclipse Plugin understanding of the Ext JS class system by supporting overrides.
* Improve type validation.
* Addition of a JavaScript formatter.
* Improve searching and discoverability.
* Bug fixes found in support requests and reported on VJET OSS site.

###VJET move to the Eclipse Foundation ###

Sencha Eclipse Plugin 2.0 is based on [Eclipse VJET project](http://eclipse.org/vjet). Previous versions of 1.x were based on VJET @ [ebayopensource.org](http://ebayopensource.org).

Due to moving VJET to eclipse.org, the packages had to change from org.ebayopensource to org.eclipse, so there is a little bit of work you have to do when upgrading from SEP 1.x to SEP 2.x. When upgrading from SEP 1.x, you must migrate your projects. See this [wiki](http://wiki.eclipse.org/VJET/Migrating_from_EbayOpenSource_VJET) for more information.

###Ext Class System Improvements###

In the SEP 1.x, we started training VJET about the Ext Class system patterns which are from the Ext JS 4.x and Touch 2.x series. In this release, we added override support and improved JSDuck comments support.

In this release, Ext.override and Ext.define with an override preprocessor is now supported using the VJET project bootstrap. Below is a demo:

* Override existing types using Ext.override or Ext.define with override preprocessor.

####Demo of Using Override with SEP####

All the code for this demo is located on [github](https://github.com/senchaeclipse/OverrideDemo).

There have also been improvements in SEP’s understanding of JSDuck comments.

* Improvement @property has been updated for supporting JSDuck 4. @property can be used to declare a property with zero arguments to extended arguments. [https://github.com/senchalabs/jsduck/wiki/@property](https://github.com/senchalabs/jsduck/wiki/@property).

All the code for this demo is located on [github](https://github.com/senchaeclipse/JsDuckDemo).

* Updates to all type libraries to support config properties as members of class. Multiple documentation issues fixed.

### Validation Improvements ###

VJET OSS has approximately 105 type checking validation rules in addition to JS syntax error checking which can be found while typing or during incremental building. This can be leveraged for type checking of properties, config properties, arguments to a method callback, arguments with different type definitions, just to name a few.

With the type checking in Sencha Eclipse plugin, you can find issues with applications quickly as well as find issues with JSDuck type comments when they don’t match usage. While developing Sencha Eclipse Plugin, we found issues with JSDuck type comments and fixed those in Ext JS and Sencha Touch which helped improve documentation on [docs.sencha.com](http://docs.sencha.com).

Here are some of the type validation improvements in 2.0:

  1. Automatic Validation of dependencies — if you change one JS file and this file has dependencies on save, the dependant files are validated. For example, if you change A, and B depends on A, B will be automatically revalidated without any user action.
  2. Disabled validation warnings about property hiding —Ext.define(“MyApp.design.MyStore”, {
    extend: ‘Ext.data.TreeStore’,
    fields: [‘bla’, ‘text’, ‘id’, ‘leaf’] //Warning: “Property fields hides property of its parent type Ext.data.TreeStore”
    });
  3. Disabled Validation warning about overriding method mismatch when you don’t have a JSDuck comment.
  4. Validation errors will show for unknown types for extend, requires, mixins, uses. If you enter a type which is not defined:Ext.define(‘MyClass’, {
    extend: ‘FooBar’ /// you will get error here : “FooBar cannot be resolved”
    })
  5. Improvements to headless validation tool to support validation of Ext JS applications using VJETV.

### New JavaScript formatter ###

Support for JavaScript formatter and different formatting styles. Use Control + Shift + F to format your code. There are multiple profiles available for the code style your team uses for authoring JS code. (This is a core VJET JS feature). This feature was adapted from the Eclipse project JSDT’s formatter. This is a core VJET feature, so you can use it with or without Sencha Eclipse Plugin.

### Searching and discoverability improvements ###

Searching for type names used in uses, requires, extends, mixins, override to support hover documentation and support for F3/Go to declaration.

### Support Requests ###

1. Fixed space in path issues where no code assist/validation/searching/runtime would work.
2. Fixed issue where developers were using Eclipse Helios without service pack.
3. Performance enhancements to VJET to help with memory consumption.