Apache Cordova Newsflash!

Recently there have been some significant updates in Cordova to be aware of if you haven’t seen them already. These are included in the latest Cordova Android, Cordova Tools and Cordova Plugins releases this past week.

Below is a summary of the highlights in case you missed them.

• Android 4.0.0 supports pluggable WebViews (hint: Crosswalk)

  Apache Cordova now supports pluggable WebViews for Android. This news feature allows you to easily use Crosswalk to replace the default WebView. To take advantage of Crosswalk you’ll just need to install the new Crosswalk plugin

  Crosswalk is a modern WebView that can be used instead of the default Android WebView. It provides better support for the latest HTML5 features and allows you to provide a consistent experience across the various versions of Android and different manufacturers.

  Read more in the cordova-android 4.0.0 release news here.

• Cordova Plugins in npm and Renamed

  Cordova plugins are now stored in npm (node package manager) and renamed with id’s of cordova-plugin-*, rather than the form of org.apache.cordova.*. The new id is a bit shorter and easier to remember, which should be helpful. The CLI (version 5.0.0+) will fetch the plugin from either npm or the original Cordova Plugin Registry based on the id you specify when you add your plugin. If you use cordova-plugin-device for instance, the CLI will fetch it from npm, otherwise from the Cordova Plugin Registry when the (org.apache.cordova.device) is used.

  Developers are strongly encouraged to use the new id’s and add any existing or new plugins they’ve created there as well and add the ecosystem:cordova tag to their package.json file. Specific instructions on adding your plugin and details about this change can be found here.

• Whitelist Handling Change

  The whitelist code was moved out of core Cordova and into a new Cordova whitelist plugin. This new whitelist is enhanced to be more secure and configurable, but the legacy whitelist behavior is still available via a separate legacy whitelist plugin but NOT recommended. Content-Security-Policy (CSP) is now supported and is the recommended approach. As a result of the new whitelist handling, you may require some additional configuration settings in the config.xml file as shown below:

      <plugin name="cordova-plugin-whitelist" spec="1" />
      <access origin="*" />
      <allow-intent href="http://*/*" />
      <allow-intent href="https://*/*" />
      <allow-intent href="tel:*" />
      <allow-intent href="sms:*" />
      <allow-intent href="mailto:*" />
      <allow-intent href="geo:*" />
      <platform name="android">
          <allow-intent href="market:*" />
      </platform>
      <platform name="ios">
          <allow-intent href="itms:*" />
          <allow-intent href="itms-apps:*" />
      </platform>
  

  NOTE: When you create a new project based on the default hello world project, your config.xml will already be preconfigured with these settings.
  IMPORTANT: Network requests are blocked by default without cordova-plugin-whitelist, so install this plugin even to allow all requests, and even if you are using CSP.
  

  More details can be found here.

• Saving Plugins and Platforms

  You can save the plugins and platforms used in your project easily now a few different ways using either a save command or --save flag. Using these will cause new tags to be added to your config.xml to save the specific version so it can be auto-configured on another machine. This is super useful when working with a team or moving to another machine since you should never be checking those folders into your source control system. With this change, they are automatically added when the CLI finds them in the config.xml file during the prepare step (automatically done with a build or run) so it saves extra setup time. Note that when you remove a plugin or platform you should also specify the --save to cause it to be removed from the config.xml.
  
  Some examples of the different ways to use the new command or flag are shown below:

  Saving Plugins

  Using --save flag
  
$ cordova plugin add cordova-plugin-device --save
$ cordova plugin remove cordova-plugin-device --save


  This results in the following line being written ore removed from the config.xml:

      <plugin name="cordova-plugin-device" spec="1" />
  

  Using save command
  
$ cordova plugin save


  The above line will save all plugins that have been added to your project at once.

  Note: The plural version also works (ie: $ cordova plugins save)

  Below are some examples and the resulting console output:
  
$ cordova plugin add cordova-plugin-device --save
Fetching plugin "cordova-plugin-device" via npm
npm http GET https://registry.npmjs.org/cordova-plugin-device
npm http 200 https://registry.npmjs.org/cordova-plugin-device
npm http GET https://registry.npmjs.org/cordova-plugin-device/-/cordova-plugin-device-1.0.0.tgz
npm http 200 https://registry.npmjs.org/cordova-plugin-device/-/cordova-plugin-device-1.0.0.tgz
Saved plugin info for "cordova-plugin-device" to config.xml


$ cordova plugin remove cordova-plugin-contacts --save
Uninstalling cordova-plugin-contacts from ios
Removing "cordova-plugin-contacts"
config.xml entry for cordova-plugin-contacts is removed


  Saving Platforms

  Using --save flag
  
$ cordova platform add ios --save
$ cordova platform remove ios --save
$ cordova platform update ios --save


  This results in the following line being added to your config.xml:

      <engine name="ios" spec="3.8.0" />
  

  Using save command
  
$ cordova platform save


  The above line will save all platforms that have been added to your project at once.

  Note: The plural version also works (i.e.:$ cordova platforms save).

  Below are some examples and the resulting console output:

  
$ cordova platform add firefoxos --save

  Adding firefoxos project...
  Project Path platforms/firefoxos
  Package Name io.cordova.hellocordova
  Project Name HelloCordova
  Installing "cordova-plugin-whitelist" for firefoxos
  Installing "org.apache.cordova.console" for firefoxos
  Installing "org.apache.cordova.contacts" for firefoxos
  Installing "org.apache.cordova.device" for firefoxos
  --save flag or autosave detected
  Saving firefoxos@^3.6.3 into config.xml file ...`
  

  Note how it also added any plugins added or found in the config.xml file to the added platform automatically as well.

  
$ cordova platform remove firefoxos --save

  Removing firefoxos from config.xml file ...
  

  Read the official blog post for details and to find out the rest of the changes in the latest release.

• Config.xml <feature> tag now <plugin>

  If you use the <feature> tag to specify custom configuration for a platform or version, you should now use the <plugin> tag. The <feature> tag will still be backwards compatible, but you should be using the <plugin> tag going forward. If you’re unsure of the details of the original <feature> tag, check out an example and more details here.