A quick look at what's in Opera 12 beta for developers

April 26, 2012 · by Andreas Bovens

This morning, we've released Opera 12 beta and as always, a new release comes with improved standards support and other developer features — a quick overview of the shiny:

Hardware acceleration and WebGL support

As announced last week, we're aiming to make Opera entirely hardware accelerated, from the UI to all page rendering and painting (with support for OpenGL as well as DirectX backends), but for now, both HWA and WebGL are turned off by default. You can enable them by setting opera:config#UserPrefs|EnableWebGL and opera:config#UserPrefs|EnableHardwareAcceleration to 1, saving and restarting the browser.

If you're interested in trying out a WebGL demo, check out Emberwind; if you want to start coding WebGL, have a look at our WebGL articles.

CSS3 Animations and more animatable properties

Opera 12 beta supports CSS3 animations, and we have prepared a fitting Dev.Opera article to celebrate that.

We've also expanded our support for animatable properties (so you can animate them using CSS3 transitions as well as CSS3 animations) to include background-position, border-bottom-color, border-color, border-left-color, border-right-color, border-top-color, and text-shadow. Furthermore, step-start, step-end and steps timing functions for transition-timing-function are supported as well.

Generated Content for Paged Media

The CSS Generated Content for Paged Media Module is a spec spearheaded by our CTO Håkon Wium Lie, and it allows you to create a page-like browsing experience on web pages by adding a few lines of CSS to your content. Opera 12 beta includes a partial implementation of the spec, which you can try out using Håkon's examples. Tip: use your mouse's horizontal scrolling mechanism to move to the next page, or try PageUp/Down.

Camera support with `getUserMedia`

A lot has happened since we announced our first build with camera support in March 2011, and last week getUserMedia has finally landed in our Next channel (and in this beta of course), with a fresh privacy UI to boot. If you want to get started building stuff, check out our getUserMedia article. For demo fun, there are our Photo Booth, Polaroid, Color Picker and Explode examples.

CORS

Opera 12 beta comes with support for cross-origin resource sharing, also known as CORS. If you want to learn how to use this in your site, check out our Dev.Opera article about it: DOM access control using cross-origin resource sharing.

Drag and Drop

HTML5 includes the Drag and Drop API, which gives us the ability to natively drag, drop, and transfer data to HTML elements, and now this is supported in Opera 12 beta as well. We have published a fresh article detailing how to use Drag and Drop earlier today, so be sure to have a look.

Updated Windows & Tabs extension API

Opera 12 beta comes with an update to the Windows & Tabs API, for which we have published updated documentation. Be sure to read through it if your existing Opera extension relies on it, and feel free to ask questions in the comment section on the API pages.

Discontinuation of Unite and Widgets

Earlier this week, we announced that we're discontinuing Unite and Widgets in Opera 12, but at the same time are going full steam ahead with our extensions platform. For those who want to convert their existing widgets to extensions, we've produced an article to help you with the conversion process.

Themes

If you want to spice up your browsing experience, with, let's say, a cookie monster-themed browser UI, be sure to check out our new themes catalog. Making themes is super easy, and the nitty-gritty details of Opera 12's new theming infrastructure are explained in our Opera's lightweight themes article.

And last but not least, our product specs overview page has been updated as well, giving you an overview of what is supported where in all recent Opera products.

Readers' comments 11

Left under the original article, as archived.

ThiemoThursday, April 26, 2012 7:17:08 PM
Is there a way to enable OpenGL but not DirectX? I can't use DirectX because it has a major bug: http://my.opera.com/community/forums/topic.dml?id=1369942
MaximThursday, April 26, 2012 10:33:40 PM
https://addons.opera.com/en/themes/ now has only lightweight themes. Did you discontinue supporting of normal skins also?
иsᴀɴᴇFriday, April 27, 2012 4:45:47 AM
The minimize, restore and close buttons position is wrong when using Themes on fullscreen.
Andreas BovensFriday, April 27, 2012 9:10:45 AM
@Thiemo, not yet at present. We might add such an option to opera:config in the future though.

@Maxim, normal skins are still supported, but authors have to reupload them to the new themes repository. Give it a few weeks...

@иsᴀɴᴇ, please file a bug :-)
Constantine VesnaMonday, April 30, 2012 11:01:32 AM
getUserMedia and CSS GCPM are cool, CORS is great (now ie7 will start dying off even faster), animations are aligning opera with other browsers.

Widgets were useless, Unite had only like 3 good things - server, file access and UJS manager Hopefully those features can get ported to extension api.

but:
@andreas, my main concern with opera12 is tremendous amount of bugs caused by OOPP, even in 32 bit version. A single flash banner is causing browser to freeze for a few seconds, while video streams reliably crash browser together with plugin wrapper.
If opera will not be stable, nobody will care about new cool things.

also, any reason why WebSockets are still off by default ?
QuHnoMonday, April 30, 2012 9:06:00 PM
Originally posted by andreasbovens:

(...) but authors have to reupload them to the new themes repository.
I wonder why the skin authors have to re-upload the already existing ones to the new catalog. Wouldn't moving from server to server be faster than re-uploading (sometimes with extra costs if the author has a capped data plan) and make the new catalog more attractive in a blink?
kapsiTuesday, May 8, 2012 8:07:32 AM
Originally posted by QuHno:

Originally posted by andreasbovens:
(...) but authors have to reupload them to the new themes repository.
I wonder why the skin authors have to re-upload the already existing ones to the new catalog. Wouldn't moving from server to server be faster than re-uploading (sometimes with extra costs if the author has a capped data plan) and make the new catalog more attractive in a blink?
I guess old skins may be incompatible with new, and if developers have to resubmit them, there's a chance they will check.
QuHnoWednesday, May 9, 2012 2:39:21 PM
Originally posted by kapsi:

I guess old skins may be incompatible with new, and if developers have to resubmit them, there's a chance they will check.

Not only that but especially #2 here.
ChristophSunday, May 13, 2012 12:06:01 PM
I'm not 100% sure, if this is the right place to post, but I wasn't able to spot one that seemed to be more appropriate:

I think there is either a mistake in the documentation or a bug concerning the UserJSEvent. I'm talking about the following part on http://www.opera.com/docs/userjs/specs/#evlistener :
BeforeCSS
Fired before a CSS style sheet is parsed.
The element attribute of the UserJSEvent refers either to the style or the link elements that include the styles in the document

I experimented a bit with it the last two days, but the UserJSEvent did never fire for a style-tag of a document. It did though for linked external CSS-files...

Furthermore, I encountered a problem, which I'm not quite sure if I just don't have a full understanding of the matter or if it is a bug as well:

If you add a UserJS containing
window.addEventListener('DOMContentLoaded', function(){
var the_body = document.body.outerHTML;
document.body.outerHTML = the_body;
}

it breaks parts of some pages content, e.g. go to http://en.wikipedia.org/wiki/Google
You will e.g. encounter that the "improve this page"-button is missing, the terms-of-use-info at the top isn't visible and at the bottom of the page the "[show]"-toggle will not expand the area...

Guess it has something to do with JS-manipulation of the code when loading the page...

Can anybody explain me this behaviour or at least mention a workaround for this problem?

EDIT: setting a timeout of 5 seconds and then executing the code fixes the first two mentioned issues, but still breaks the "[show]"-toggle although the page completely finished loading...

P.S.: and a totally different thing: all the version numbers are incorrect at http://www.opera.com/docs/specs/presto2.11/#m210-323
It's supposed to say Presto/2.11.XXX rather than Presto/2.10.XXX
ChristophFriday, May 18, 2012 9:27:09 AM
concerning the second issue:
http://my.opera.com/community/forums/topic.dml?id=1396032&t=1337333156&page=1#comment12303332
Lollo AndersenTuesday, May 29, 2012 7:15:18 PM
cool!