Opera Developer News

Opera 11 snapshot with better HTML5 forms, faster SVG, and improved extensions debugging

By Andreas Bovensandreasbovens. Monday, December 6, 2010 11:59:53 AM

Opera, debugging, extensions, snapshot, SVG, html5 forms

A Saint Nicholas present from the desktop team: a snapshot build with better SVG performance, improved HTML5 Forms support, and Opera extension debugging from Opera Dragonfly.

HTML5 forms

Wobbly error popups We've cleaned up our old web forms implementation from 2005 — first introduced in Opera 9.0tp —, so as to align it with the current HTML5 spec and prettify things a bit.

One of the most visual improvements is the "wobbly bubbles" theme replacing the previous square error dropdowns, which Bruce shared a sneak peek of back in October. The wording of the error messages has also been tweaked so as to sound more natural.

In addition, we have now added support for the placeholder attribute, and the Search, Telephone and Color states, with the latter popping up a nice color picker. We've also added support for the new HTML5 progress and meter elements, ~~and support upload of multiple files~~. You can try out these new additions on this simple demo page.

SVG improvements

We've been tweaking parts of our SVG engine, which should give things a bit of a performance boost. We've also added support for the timelineBegin attribute, which controls the initialization of the timeline for the document. If you look at this 11.1MB SMIL example, you'll notice Opera 11 will start playing the animation while the rest of the file is still being downloaded.

Extension debugging with Opera Dragonfly

In the last couple of desktop builds, we've been improving the developer experience step by step, so as to smoothen the rough edges in the extensions development workflow. One missing piece in the puzzle is getting Opera Dragonfly to work properly with extensions. This build is a first step to achieve that: you'll find that the debug context dropdown now has a new "Opera Extensions and Opera Unite" section listing all background processes, and the script dropdown now distinguishes between document scripts, BrowserJS, UserJS and the extension runtimes. However, there are still a number of issues that need to be resolved, so tread with caution. If you have feedback, use the the Bug Wizard and forums.

It's worth mentioning that David has posted more details about these and other Opera Dragonfly features on the project's blog. Note that for now, you have to set the cutting-edge path in opera:config#DeveloperTools|DeveloperToolsURL in order for the above features to become available.

First browser to 11 (unless Chrome gets there first)Add-on-Con 2010

Comments

BS-Harou # Monday, December 6, 2010 7:40:06 PM

I think you should improvite a bit the style of color picke (something similar to the validation messages), otherwsie good work!

MyOpera team, please fix this!fearphage # Monday, December 6, 2010 8:46:59 PM

Double posted from DTT blog:

Bug #DSK-321133 - The current implementation of the color input element accepts ANY value unlike date, datetime-local, number, week, month and others:

Test case: http://modernizr.github.com/Modernizr/output.html

Simple tests:

// PASS - alerts empty string
javascript:void(input=document.createElement('input'));input.setAttribute('type', 'number'); input.value=':)';alert(input.value);

// PASS - alerts empty string
javascript:void(input=document.createElement('input'));input.setAttribute('type', 'week'); input.value=':)';alert(input.value);

// PASS - alerts empty string
javascript:void(input=document.createElement('input'));input.setAttribute('type', 'month'); input.value=':)';alert(input.value);

// PASS - alerts empty string
javascript:void(input=document.createElement('input'));input.setAttribute('type', 'date'); input.value=':)';alert(input.value);

// FAIL - alerts  ":)"
javascript:void(input=document.createElement('input'));input.setAttribute('type', 'color'); input.value=':)';alert(input.value);

larskl # Monday, December 6, 2010 9:02:42 PM

uploading multiple files is de-facto broken as Opera uses multipart/mixed instead of multipart/form-data (CORE-33415)

Unregistered user # Tuesday, December 7, 2010 1:34:16 AM

alexander farkas writes: I have filled some Webforms bugs some time ago. None of those are fixed in this release. One of the most annoying bugs in Opera's form validation implementation is the fact, that in case of the interactive validation the submit-event is always fired, before testing the validity of the form. The specification says: First get all invalid elements and only if the list of all invalid elements is 0 fire a submit event. You can find a simple testcase @http://afarkas.github.com/webshim/tests/submit-test.html#noCapableBugfixes

SteveKong # Tuesday, December 7, 2010 6:28:18 AM

[Mac] Strange, the SVG animation doesn't start at all for me in 11 while 10.6 plays nicely. Is this only me and worth a bug report?

Unregistered user # Tuesday, December 7, 2010 7:27:20 AM

Josh writes: Error dropdowns are fine but if you have two screens and main Opera window is on second screen, error dropdowns shows on the first screen.

dahulevogyre # Tuesday, December 7, 2010 10:19:40 AM

"Wobbly bubbles" are prettier. But they still are obtrusive.
Use case :

<form><input type="text" name="name" required="required" /><br/>Enter your name above<br/><br/><input name="age" type="text" required><br/>and your age<br/><br/><button type="submit">Submit</button></form>

Why not a popup bar + highlight on the field itself ?

Andreas Bovensandreasbovens # Tuesday, December 7, 2010 10:52:10 AM

fearphage: have pinged the developer
Lars: thanks for the report.
Alexander: do you happen to have the bug numbers (or the email address from which you filed them) so I can find them
SteveKong: not sure... 11 should start showing it while it's still loading. Works fine for me here, but feel free to file a bug if you think there's something wrong.
Josh: which platform do you see this on? I can't reproduce it on Mac...

Unregistered user # Tuesday, December 7, 2010 1:58:24 PM

Arve Systad writes: Even though this looks great(-er than before), is there anything going on in regards to CSS3-selectors or whatever that can be used to style these boxes by yourself? If no such thing arrives in HTML5 or CSS3, my guess is nobody's going to use the built in HTML5 validation simply because they can't control the looks. Doesn't matter if they look the same across all web pages when no web designers want them to look like that.

Unregistered user # Tuesday, December 7, 2010 9:48:02 PM

alexander farkas writes: @Andreas I found my bug-list: DSK-315259 - submit event DSK-315263 - stepMismatch inaccurate DSK-315264 - valueAsDate doesn't work as setter DSK-315260 - fieldset checkValidity (minor, no other browser does support this) I have written some tests. You find them @ http://afarkas.github.com/webshim/tests/#noCapableBugfixes (but DSK-315259 is most really annoying). If you find any error/misreporting in the test please let me know.