Showing posts with label opera. Show all posts
Showing posts with label opera. Show all posts

Monday, 17 December 2007

Form submit weirdness in Opera 9.20

Here's one for you:

I have a few input form elements on a page, one of them is of type 'submit'. Because I don't use a form to submit this information, I set an event listener for one of the inputs like so: onkeypress="if(event.keyCode==13)myAction()" so that if enter is pressed, an action is performed. Similarly for the 'submit' input onclick="myAction()", so if the button is clicked the same action will be performed.

Here's what happens: if the enter key is pressed in the text control, myAction is executed twice. It's executed only once if I click on the button...

I investigated the problem and here are a few observations:

  • If the type of the submit element is changed to 'button' the action is performed only once when enter is pressed, as expected

  • If I remove the event listener from the text input element and leave the type of the 'submit' element unchanged, myAction is executed only once, as expected

  • What happens in myAction does not affect the form elements in any way, myAction can be replaced with alert

  • This behaviour doesn't happen in Firefox

  • In Firefox, only if the elements are in a form (and they are not in my case) then the form is submitted when enter is pressed in one of the text input elements



My conclusion: Opera detects a 'submit' element and launches a click event on it when enter is pressed in one of the text input elements, assuming that they're all part of a form. I think this is not something a web developer would expect, would you?

I need the event listeners for Firefox, so I'm going to change the submit element to 'button' which is more appropriate anyway.

Friday, 17 August 2007

Firefox 2.0.0.6 vs Opera 9.20

This post is not just to let you know what browsers I'm using at the moment.
It's rather about this speed problem a colleague of mine and I are having for a web application.

Just to make it simple, there are two divs, each contain a huge table, each with around 100 rows of 20 columns each, in each cell there is either some text, a checkbox or a select tag with around 5 options. Just to sum things up, there are like 800 checkboxes and 800 selects. They are loaded by pulling data from the server through a HttpRequest object.

We were expecting loading to take a long time and it really does :-)
What is really surprising is what happens when they're both loaded and their classNames are changed, one gets a class name that has among others "display: none" to hide it and the other gets "currentDiv" class name which sets a few properties.

I'm really surprised about how ling time it takes Firefox 2 to do this operation. I checked with FireBug exactly what part of the code takes the most to run and this is it:

  myDiv.className = "currentDiv";

This is where it spends around 10 seconds.

I thought instead of changing the class name, to try and change the style.display property, but there was no visible difference. Here's a nice test on this subject.

Just for tha hell of it, I also took down any other CSS properties from the "currentDiv" class and especially these kind of lines:

  div.currentDiv table td.commentTd{ ... }

I thought maybe the rendering engine has to go through all cells of the table in this specific div and change the visual attributes. Well, again, no improvement.

I was curious what had Opera to say about this matter and I tested the same code on Opera 9.20. Result: under 2 seconds including loading the div. Absolutely surprising.

I'm not giving up on Firefox, yet, I still love it :-) But I'm looking forward to Firefox 3 with its new and improved JavaScript engine ;-)