Enable JavaScript Debugging on Mac OS Mountain Lion

Hi, everyone:

JavaScript debugging is a critical functionality when skinning the application, as you can interactively test out CSS commands interactively while the application is running in the simulator.  For example, you can enter a new color in a style class in the debugging window in the Safari browser on your Mac, and see the color change in the simulator as soon as you enter it. The entire setup requires using Safari b

Unfortunately, Safari 6 broke compatibility with the JavaScript debugging capabilities.  If you are on Lion or prior Mac OS, you can at least downgrade to 5.x Safari to enable JavaScript debugging.  Safari 5 is not available on Mountain Lion.  If you are using Mountain Lion Mac OS, then you will need the following combination of software to support JavaScript debugging:

  • Xcode 4.5.x

  • iOS Simulator version 5.1

    • There are some known issues with using iOS simulator version 6.0 and therefore not recommended.

    • Please note that the ADF Mobile application will run fine on devices running on iOS 6, as long as it's compiled using the iOS 5.1 SDK.

  • Safari 6

The steps to configure and setup Xcode 4.5 with iOS simulator 5.1 is as follows:

  1.  Install (or upgrade to) Xcode 4.5.x (current version as of Dec 18th, 2012) from Apple AppStore or download directly from developer.apple.com.

  2. After installing, start Xcode

  3. Go to menu item Xcode-preferences

  4. Click on the Download tab.  The Downloads tab loads and show you options to install iOS 5.1 and 5.0 simulators.  Click to install the iOS 5.1 simulator.

  5. After the download/installation is complete, go back to JDeveloper.  Select menu item Tools - Preferences - ADF Mobile - Platforms -iOS.  In the iOS SDK Simulator directory, make sure you select the Simulator version 5.1 that you have just installed.  Please make sure you re-select this path specifically.

  6. Deploy the application to the simulator.  The ADF Mobile app would deployed to the 5.1 simulator, although 6.0 simulator would be started by default.  This is because JDeveloper relies on Apple Script to start the iOS Simulator, and 6.0 simulator is the default.  This means you will not see the app in the 6.0 simulator.

  7. You will need to switch to the 5.1 simulator by going to menu Hardware - Version 5.1.  You will then see your application running in the simulator as expected

Now, to enable JavaScript debugging, you will need to:

  • Set the following properties in cvm.properties file in your ADF Mobile application workspace (under Application Resources Panel in JDeveloper):

# JavaScript debugging settings

javascript.debug.enabled=true

# Specifies the feature that will trigger the activation of the JavaScript debugging

javascript.debug.feature=<feature id>:9999

  • Deploy the application and navigate to the amx page to be inspectedAccess the http://localhost:9999 URL in a Safari browser to view the list of AMX pages in the App.

  • Select the link corresponding to the page displayed in the simulator to inspect the DOM for the page or debug JavaScript.

That's it!  You can then interactive change the style classes in the Safari browser window, and see ADF Mobile App's UI change in real time.

Please let us know if you encounter any issues, and hope this helps to debug some of the skinning challenges you have encountered.

Thanks,

ADF Mobile Team

Comments:

Post a Comment:
  • HTML Syntax: NOT allowed
About

This blog is is dedicated to tips and tricks for developing, integrating, securing, and managing mobile applications using Oracle Mobile Platform. It is created and maintained by the Mobile Suite/Oracle ADF Mobile product development team.

Archive of past entries

Even More Mobile Development Blogs

Oracle A-Team Site - Mobile Related Entries

Code samples from the Community

Fusion Middleware Blogs

Search

Archives
« April 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today