HTML component blinking cursor and combobox problems

Question

Hi there.
I have a problem using a website displayed with the HTML component in a spark window. In any textfield in this homepage there is no blinking cursor displayed which is not really a problem but is still pretty confusing to the users. Another issue comes up with the comboboxes where the possible choices cannot be clicked with the mouse. Choosing an entry with the keyboard is possible though.
To reproduce this issue, add a html component in a spark window and load for example http://www.ard.de. The cursor is blinking in the search textfield in the top left. After clicking on the combobox on the left side - where i can't choose an entry with the mouse - the cursor in the textfield is no longer displayed.
Is this a known issue?
Best regards

Answer 1

Hi,
I've looked at your example and found the following 2 issues:
1. The cursor not appearing was actually a focus issue and you can fix it by adding an event listener on "windowActivate" in which to re-set the focus to the _htmlWindow. See the code below for more details on "onActivate()"
2. The issue with the dropdown is actually a bug (internal bug id #2721855) and it has been fixed in the next version of AIR which will be released towards the end of this year.
<?xml version="1.0" encoding="utf-8"?>
<s:Window xmlns:fx="http://ns.adobe.com/mxml/2009"
            xmlns:s="library://ns.adobe.com/flex/spark"
            xmlns:mx="library://ns.adobe.com/flex/mx"
            windowDeactivate="onDeactivate()"
            windowActivate="onActivate()"
            alwaysInFront="true"
            showStatusBar="false"
            title="WebKit Browser"
            creationComplete="onCreationComplete()">
     <fx:Declarations>
          <!-- Place non-visual elements (e.g., services, value objects) here -->
     </fx:Declarations>
     <fx:Script>
          <![CDATA[
               import flash.profiler.showRedrawRegions;
               import mx.controls.Alert;
               import mx.managers.CursorManager;
               import mx.managers.HistoryManager;
               [Bindable]
               private var _location:String;
               private function onCreationComplete():void {
                    nativeWindow.x = Capabilities.screenResolutionX * 0.1;
                    nativeWindow.y = Capabilities.screenResolutionY * 0.1;
                    nativeWindow.width = Capabilities.screenResolutionX * 0.8;
                    nativeWindow.height = Capabilities.screenResolutionY * 0.8;
                        // call this function on "windowActivate" in order to re-set the focus on your html element
               private function onActivate():void {
                    _htmlWindow.setFocus();
               private function onDeactivate():void {
                    try {
                         if (nativeWindow)
                              nativeWindow.activate();
                    } catch (e:Error) { // nativeWindow Object not yet available
               public function set location(value:String):void {
                    _location = value;
                    showStatusBar = false;
                    status = "Lade " + value + "...";
                    CursorManager.setBusyCursor();
               public function get location():String {
                    return _location;
               private function onHTMLComplete():void {
                    CursorManager.removeBusyCursor();
                    showStatusBar = false;
               private function uncaughtScriptExecution(e:HTMLUncaughtScriptExceptionEvent):void {
                    CursorManager.removeBusyCursor();
                    Alert.show("Scriptfehler: " + e.exceptionValue, "Error", Alert.OK);
          ]]>
     </fx:Script>
     <mx:HTML id="_htmlWindow"
                width="100%"
                height="100%"
                runtimeApplicationDomain="{ApplicationDomain.currentDomain}"
                complete="onHTMLComplete()"
                location="{_location}"
                uncaughtScriptException="uncaughtScriptExecution(event)">
     </mx:HTML>
</s:Window>
Regards,
Catalin