Skip to main content
chris.campbell
Community Manager
Community Manager
June 11, 2014
Question

How do you use AIR's WebKit/htmlloader?

  • June 11, 2014
  • 74 replies
  • 41371 views

Hi everyone,

A long standing issue in AIR has been the inclusion of an older version of WebKit.  The request to update this library has come up many times in the forum and is in the top 10 on the community driven Uplist feature page.  As with the recent and ongoing physics discussion, we're not committing to any changes purposed below at this time,  as we're purely in an investigation mode at this time.  We realize that this is an important feature and we need further clarification on what you're looking for.  Please read on for questions from our development team.

We are exploring updating WebKit, but due to our modification of the WebKit source, this will be difficult, and updating WebKit will change the HTML DOM, possibly breaking content authored for our existing DOM.

So we are also exploring leaving HTMLLoader alone, for now, but providing a reasonable alternative.

StageWebView was originally written as a replacement for HTMLLoader on mobile (because we could not use our WebKit on mobile, StageWebView took advantage of the browser provided by the platform).

But it was extended to the desktop as an unsuccessful solution to this problem.

On mobile, content was probably newly written (so it could be tested with StageWebView), and the browsers were similar enough to our WebKit that the DOM impact was minor.

But on the desktop, forcing older content written for our WebKit to run on Internet Explorer 8 (as an example) was a disaster due to the differences in the DOM’s. We resolved this by making HTMLLoader versus StageWebView on the desktop a choice.

Which gets to the questions (for desktop development only).

Which is more attractive, an embedded web browser or using the system browser? Is it valuable to provide both?

For instance, using the native browser can save on code size (perhaps 6 MB), but you must create and test portable HTML, and you face the risk that future updates to the system browser breaks your content.

How much interop do you need between AS and JS?

Hearsay suggests another problem with StageWebView is there is no interop between ActionScript and JavaScript, whereas HTMLLoader had a lot of support.

Would StageWebView be sufficient if it exposed an ExternalInterface, or sandbox bridge, level of functionality? For instance, if AS could register a list of functions which could be called from JS (and vice versa), would that be enough? Or is there something else that HTMLLoader does that is essential?

For instance, one of the ideas being explored is to provide an entirely new class (perhaps as an ANE) which links an unmodified version of the latest WebKit source as a static library. By using unmodified source, we can more readily update to newer versions of WebKit.  As well, if we leave the existing classes unchanged, we don’t risk breaking existing content. But if we use unmodified WebKit source, we may find some of HTMLLoader’s functionality impossible to match, which is why I’m interested in understanding the essential functionality, so we can decide if a sufficient, minimal (so it’s easier to support without customizing Webkit) interface for it.

Thanks,

Chris

This topic has been closed for replies.

74 replies

June 12, 2014

For what little I do with the HTMLLoader object, just being on the latest version of Webkit so I can have HTML5 video and audio would be enough for me. I also heavily use the events that HTMLLoader offers to make state changes to AS UI elements. On the concern of updating the DOM breaking existing content, correct me if Im wrong but it would only have the potential to break in an app if the app was updated/re-published. Hope this was helpful.

Edit: Also, just want to say thank you for considering updates and asking the community what we would like to see.

Known Participant
June 12, 2014

I'm 100% in support of ditching embedded WebKit for the size savings, and adding 2-way communication for AS/JS in StageWebView.

Another option would be to just give us a compiler flag so that we can strip webkit manually when packaging.

Thanks for reaching out Chris! This is long overdue, but awesome that it's finally (maybe) happening.

Inspiring
June 18, 2014

An advantage of the embedded webkit engine is that it allows content to be rendered as a DisplayObject. It could be achieved with StageWebview, but would require more resources.

I guess when compiling IPAs and APKs the embedded engine is already stripped, isn't it? if it isn't, it should.

Harbs.
Legend
June 12, 2014

Pretty much every time I've used HTMLLoader, I've needed to do HTML manipulation using ActionScript. So js to as interop is pretty important to me.

I agree that it makes sense to at least consider chromium and possible CEF. The idea of combining AIR and CEF capabilities sounds like an interesting one to me, although I'm not sure off-hand how I'd use that.

Harbs

Participating Frequently
June 12, 2014

Hi Chris

We currently use the mx:HTML object in our desktop AIR application to load in a variety of web content. Some of this content we generate ourselves contains links which we capture using the locationChange handler and feed into the application to make various bits of the application work.

override protected function htmlLoader_locationChangeHandler(event:Event):void

  {

  if(htmlLoader.location && LinkUtils.doWeHaveAValidURLLink(htmlLoader.location))

  {

  event.preventDefault();

  LinkUtils.actionValidURLLink(htmlLoader.location);

  // set the location back to the one used before so the same bug link can be

  // clicked twice in a row and this function still gets called.

  htmlLoader.loadString(htmlText);

  }

  else

  {

  super.htmlLoader_locationChangeHandler(event);

  }

  }

Key things we'd require for our application to continue to work are as follows:-

1) Access to a locationChange/locationChanged handler (We had to make the handler protected from private to enable our code to work as required)

2) Capacity to pass an HTML string containing the markup to display, rather than pointing the component to a URL.

3) Access to the internal htmlLoader  to call the loadString() method, or similar.

Desirable features for a new WebKit/HTML:-

1) SVG Graphics

2) HTML5 Audio/Video

3) Proper displaylist support.

4) Access to complete handler for page loading completion.

Getting support for HTML5, Video and better rendering of modern web pages is huge for my team and our application. I'd be willing to participate in any testing or beta programme that Adobe would offer here.

Thanks,

Marc

Participating Frequently
June 12, 2014

1. Support for osx retina display

Currently, I use HTMLLoader to implement hybrid Flash/HTML desktop application, and even configuring the descriptors files correctly, the HTML content will be rendered in compatibility mode (upscaled 2x) - it is very noticeable alongside with the Flash-based content renderered in native resolution.

2. Improve HTML5 compatibility

Many authoring applications (e.g. Articulate) are able to create HTML5 packages, but that content often cannot be rendered by the HTMLLoader, usually due to the lack of support for recent standards, such as WebFonts and SVG rendering. This is especially useful for Learning Management System solutions, or in general when external resources need to be rendered.

Thank you for asking,

Cosma

Inspiring
June 12, 2014

Updating the embedded Webkit engine would be extremely useful. Also, StageWebView is severely lacking in a lot of areas... you can get an idea by looking at this commercial ANE:

iOS UIWebView and VideoPlayer Native Extension for AIR mobile | Darkredz Studio

It would be a shame to make the author work unneeded, but I think StageWebView should be improved and be on par with its native counterparts.

周戈35_2
Inspiring
June 12, 2014

Hi Chris,

I'll straight up to the point:

1. StageWebView desperately needs two key features:

1.1. Add an autoSnapshot:Boolean property to the StageWebView Class, so that when setting autoSnapshot=true and the StageWebView is not currently interacted by user, StageWebView can automaticly draw its viewport to BitmapData, and automaticly add the Bitmap to DisplayList, in the meantime automaticly hide the true webpage view. This feature will make our jobs way more easier than before!

1.2 Add ExternalInterface support to StageWebView.

2. About the AIR's WebKit, well, I think it just needs to be updated to the latest version of WebKit, the current version is so out of date.

I'm very appreciated to all the great works of Adobe AIR Team, wishing it could go really far

DarkStone

2014-06-12

Santanu Karar
Known Participant
June 12, 2014

Hi Chris,

I have my problem/question about using WebKit for desktop AIR project. I don't know if there is any solution exists to my problem, but I'd like to share those thoughts with you regarding WebKit usage in AIR desktop.

As per How to publish your AIR application to Mac App Store (guide) - Pigsels Media , we're packaging desktop AIR application to submit to Apple App Store. The problem comes when we have WebKit usage (HTML) in the application. As per the article, one can not include WebKit classes while packaging for App Store, as Apple would reject the app.

1. Now, it’s time to make the magic: remove webkit.plugin from your bundle. This, of course, means, that you will not be able to use HTML rendering in your AIR application. The reason behind this is that Apple will refuse your app with WebKit plugin in it, because this plugin itself contains calls to undocumented Mac APIs, which is not tolerated by Apple.

Fortunately an AIR application will work just fine without WebKit if it has no use of HTML rendering.

In the kind of cases, WebKit seems not a solution at all. Our .pkg installed executable fail working with HTML component if we removes WebKit while packaging. I am also not sure what if we have StageWebView in place of WebKit component to AIR desktop, maybe we could cut down these complexities in packaging then

Thank you!

Inspiring
June 12, 2014

StageWebView not only needs some care on desktop. There are a lot of (critical) bugs (like #3572986) in the mobile version too, which should be fixed first before adding new features.

Despite that - absolutely must-haves for a new StageWebView / HTMLLoader:

- bullet-proof HTML5 Audio/Video support

- (easy) JS / AS Interface

- Touch/Gesture recognition (it's a shame that we are not even able to recognize touches on the Webview)

Thanks for listening Chris!

Participating Frequently
June 11, 2014

I would love to see the HTMLLoader updated but would be fine with a new HTML object - what is super important for me is the AS-JS integration. My app is tightly integrated with the HTMLLoader with code like the following :

// using jQuery to set element text

_htmlview.window.$("#mydiv").html("some text")

// getting an element's width

var nodeWidth:Number = parseFloat(_htmlview.window.document.getElementById("mydiv").style.width);

or registering its own handlers on an observer in the JS:

_htmlview.window.MyObserver.addListener("elementSelect", onElementSelect);

This allows me integrate with the DOM and draw UI above the HTMLLoader.

As for features I find myself missing:

  • SVG
  • CSS calc()
  • element.classList API
  • matchMedia
  • HTML5 Audio/Video
Participant
June 11, 2014

What would be good would be to update the HTML loader but also to introduce a standalone library that could load modern web code and be manipulated within the runtime. External interface was nice originally because of the type cohesion between JavaScript and actionscript. So passing objects worked seamlessly etc. My understanding is that it should even be possible to cross compile something like chromium using flascc and actually include it directly in a project as an ABC library. The interface that's written in swig would probably determine the available capabilities. In theory though it would be a game changer to be able to create a browser object that uses latest sources and manipulate it like any other object in actionscript. This would also allow you to use HTML tools like edge along side actionscript in a given application. That is obviously a business value not to mention a way to combine technologies which was the original intention of Adobe's contribution of avm2 for tamarin.