The HTML Component relies on the use of a div or iframe tag (depending on your need) to display HTML content in your Flex application. The div or iframe is created dynamically and the HTML is rendered over the Flex application by the browser. This is all that the HTML Component is doing. Take a look at the JavaScript on the page as you can reproduce this without the HTML Component. To do this some browsers must be in what is called windowed mode. Note also that there are two different element types used, div and iframe, and a bug may be related to one and not the other.
Internet Explorer 6 and 7 displays the Flash Player and HTML content as expected. Firefox has a few issues and Safari on the Mac has a few issues that can limit the functionality of the Flex application.
This page is here for describe and post steps to reproduce these issues. Please post here and send a message to Adobe through their wish list and submit a bug report to the browser manufacturer (not sure of the right to links for Firefox or Safari).
Example Comment Post:
————————————–
Subject: Cursor disappears in Flex TextInput fields
Description: The cursor does not appear in native textfields in the Flash Player when displaying a div or iframe over the flash player plug in.
Steps to Reproduce: Visit this page. It is dynamically creating a div positioned over the Flash Player. Place the cursor in the First Name textfield. Try typing.
Element over Flash: div and iframe
Browser: Firefox 2+, Win XP
I am surprised! Sometime in the last couple of months the bug noted above was fixed! :) This is no longer an issue. Not sure if it was a fix in Flash Player or in Firefox.
[...] Note: There are some issues in some browsers (mostly minor that you may never run into). These are not the fault of the HTML Component but of I believe they exist because the integration of the Flash Player plug-in in some browsers (*cough cough firefox, safari*) have never been stress tested like this before. You can email Adobe and the browser manufacturer to get these fixed. If you find any bugs please write down the steps to reproduce them, if possible using the examples above and mention them here (at this page) and to Adobe and the browser manufacturer. Deal? [...]
Subject: iframe moves out of position
Description: When I scroll the whole page down my iframe moves up
Steps to Reproduce: I have the component in a TabNavigator and when I scroll down my page the html component goes up if I scroll to the top of my page the component moves back to where it should be.
Element over Flash: iframe
Browser: Firefox 2+ and IE6 Win XP
@Tom – I believe this is a bug with the component. :P I think I know what the problem is as I have solved it already when the HTML Component parent is the Application. I will see if I can apply the fix and get an update out.
Subject: HTML Component does not lose focus when trying to type on other Flex components.
Description: Cannot type into a Flex TextInput control once you begin typing on a web page hosted by the HTML Component.
Steps to Reproduce:
1) Add a TextInput control & HTML component onto a Flex 2 application. Set the HTML component source to “yahoo.com” (“http://www.search.yahoo.com”) and run the app.
2) Type anything in the Yahoo text input area – then stop.
3) Click on the TextInput Flex control. Try typing. Although the Flex TextInput has the focus, characters are still being inserted into the Yahoo text input area over the HTML Component.
4) This seems to happen to any website.
ElementType: div and iframe
Browser: Firefox 2+, IE7, Win XP
Subject:
HTML component couldn’t display (or probably render will be the right word) webpage consistently.
Platform spec:
Mac OS X Tiger
Safari v 2.0.4 (419.3)
Shockwave Flash (9.0 r28)
Shockwave Flash (8.0 r22)
Since the HTML component is not working for local html, I have it to point to a remote URL. In this test, I use http://www.google.com
The result:
The webpage will be displayed just for a second and then went away. All I have is just a blank screen. When I highlight the component panel, I will be able to see all elements (i.e. Google Logo, text box input, text, etc).
They will disappear again when I have my mouse focus on the text box input.
Subject:
Compiling issues
Description:
Whenever i try to compile it with this component it says “Error: unable to load SWC HTMLComponent.swc : Multiple Pointsâ€
@Tom – should be fixed in the latest release http://www.judahfrangipane.com/blog/?p=132
@Alex – I think this was resolved by a Flash Player point upgrade. LMK
@Handitan – This is a known issue with Safari and the Flash Player. This has been fixed in the current version of webkit (which is the engine Safari uses).
@Dustin – Are you using the latest Flex SDK 2.0.1 Hotfix 2? How are you importing the component? Test the component by itself and make sure you have followed all the steps to install it in the quickstart guide.