Running SAP Web IDE applications using HAT in Windows

Last month, I wrote a blog on how to run SAP Web IDE projects in Windows platform.  At that moment, Hybrid Application Toolkit (hereinafter, referred to as ‘HAT’) only supported Android and iOS.  Couple of weeks ago, I got an internal email mentioning preliminary support for Windows using HAT.  So here I am – writing another blog on how to run SAP Web IDE projects in Windows platform using HAT.  You will be amazed at how simple the entire process is. 

Download HAT installation files

HAT installation files can be found in this location.   https://store.sap.com/sap/cp/ui/resources/store/html/SolutionDetails.html?pid=0000013586&catID=&pcntry=US&sap-language=EN&_cp_id=id-1457454501039-0.  The current version of HAT is 1.12.5 and it supports Windows.  It is still in beta though.  I am sure it will be in release mode shortly.  There are no companion app for Windows yet.  So when changes are made to the project, the entire project is recompiled on the local machine.  I have tried running it on my Windows 10 laptop and it seems pretty fast.

Installing pre-requisites

• Browse to http://www.visualstudio.com
• Download and run the Community Edition 2015

• Choose the Custom option. Select HTML/JavaScript (Apache Cordova) under Cross Platform Mobile Development

Installing HAT

Microsoft Visual Studio 2015 Community Edition with support for Cross Platform Mobile Development installs almost all of the pre-requisites required by HAT.  There are some environment variables that need to be set. But other than that, you are ready to install HAT on your local machine.

• Download HAT installation files from the following location. https://store.sap.com/sap/cp/ui/resources/store/html/SolutionDetails.html?pid=0000013586&catID=&pcntry=US&sap-language=EN&_cp_id=id-1457454501039-0. Extract the zip file. 
• Run setup.cmd from the command line
• The setup validates installation prerequisites such as Node.js, npm, git, bower etc.  All of this should be installed along with the Visual Studio 2015 Community Edition with support for Cross Platform Mobile Development.

• Select Windows (beta) and click Check All to test if the system is set up correctly.  Note that you might have to set up some of the environment variables.

• Once all the checks are complete, HAT is installed on the local machine

• There is no support for Companion App on Windows yet. So you can skip the Build Hybrid Companion App and exit out of the installation process.

Running SAP Web IDE application on Windows platform

• Execute run.cmd from the HAT installation folder. You will be prompted for the HAT Connector certificate password.

• From SAP Web IDE, select Tools -> Preferences. Click on Tools -> Preferences. Select Hybrid Application Toolkit in the left pane.  Click on Test Connection.  Make sure that HAT in your local system is able to connect to the SAP Web IDE system.

• Create SAP UI5 Mobile application in SAP Web IDE using the templates
• Under Device Configuration page, provide basic information for the application

• Select Windows as your platform.  Also select the appropriate Kapsel plugins required for your application.  Right click the application and select run on Windows Local

Exploring application files

• Selecting Windows Local will run the application on your Windows laptop.  Files are sent down to your laptop, the application is compiled and the application is run automatically. 

• The files are stored under %userprofile%\SAPHybrid folder – if you are interested in exploring the file structure sent down to the laptop. 

• Note that there is a copy of the SAP UI5 resources (sapui5-mobile.zip) that is sent down to your local machine.  The SAP UI5 resources are included in your application project.
• Open your application project folder.  Browse to hybrid\platforms\windows folder.  The Visual Studio solution (CordovaApp.sln) for the application can be found here.  

As mentioned earlier, the support for running SAP Web IDE application using HAT in Windows is still in beta.  I will update this blog later once it is in release mode.