Opened 11 years ago

Closed 10 years ago

Last modified 9 years ago

#7317 closed defect (wontfix)

dijit.form.DateTextBox sometimes doesn't render in FF2

Reported by: Marco Yuri Fujii Melo Owned by: Douglas Hays
Priority: high Milestone: future
Component: Dijit - Form Version: 1.1.1
Keywords: Dijit DateTextBox Firefox FF2 Cc:
Blocked By: Blocking:

Description

I'm facing a strange problem using dijit.form.DateTextBox? widget. It renders properly most of the time, but sometimes, I don't know why, it just doesn't seem to load the way it should, instead a simple horizontal line is displayed (see screenshot attached).

Here's how I'm dynamically creating the DateTextBox?:

function createDateTextBox(domNode, fieldName, styles){

var dateText = new dijit.form.DateTextBox?({

name: fieldName, style : styles, required: true, lang: "en-us", selector: "date", constraints:{datePattern:userDateFormat}

}, domNode);

return dateText;

}

Environment: Firefox v.2.0.0.14 (clean install - no add-ons or extensions) on Windows XP.

Thanks in advance.

Attachments (1)

screenshot.bmp (46.2 KB) - added by Marco Yuri Fujii Melo 11 years ago.
Screenshot

Download all attachments as: .zip

Change History (16)

Changed 11 years ago by Marco Yuri Fujii Melo

Attachment: screenshot.bmp added

Screenshot

comment:1 Changed 11 years ago by bill

Owner: set to Douglas Hays

Sounds like they just need to tweak that timeout we had to workaround the FF rendering bug?

comment:2 Changed 11 years ago by Marco Yuri Fujii Melo

Hi Bill, thanks for replying. How this can be done?

comment:3 Changed 11 years ago by Douglas Hays

I think an upgrade to FF 2.0.0.16 would be nice as well.

comment:4 Changed 11 years ago by Marco Yuri Fujii Melo

Hi Doug, in fact some testers are working with FF2 v.2.0.0.16 and they were able to reproduce the same defect. Sorry, I forgot to mention that.

comment:5 Changed 11 years ago by bill

I was hoping Doug would answer; I think I was talking about is the _layoutHack() method. You can try calling that after the fact. I thought that was already on a 75ms timeout though, but I can't find the timeout in the code now.

comment:6 Changed 11 years ago by Douglas Hays

I need a standalone html file appended that demonstrates the problem. I modified test_DateTextBox.html to use the provided function and added a META REFRESH tag to run the test over and over and the test never failed (FF 2.0.0.16 on WinXP). It will be helpful to see how the DOM node that is replaced is created, and to see when the createDateTextBox function is being called (like making sure its called after onLoad. Also, the style might be important and neither the original DOM node style nor the userDateFormat were provided here.

comment:7 Changed 11 years ago by Marco Yuri Fujii Melo

Hi Doug / Bill,

First of all I wanna thank you guys for helping me with this issue.

Bill, I took a look at _layoutHack() method in Dojo API (http://redesign.dojotoolkit.org/jsdoc/dijit/HEAD/dijit.form._FormWidget._layoutHack) and I have a guess it might be the solution for this problem. I noticed _layoutHack() is being called in Button.js and TextBox?.js. The only question I have is how and where to call it. Should I call it in DateTextBox?.js after a particular line or instruction?

Doug, one thing I forgot to mention and that might be a valuable information is that NO JavaScript? error was reported by FF2, therefore reloading the page several times is not a problem, the problem is all about displaying DateTextBox? widget correctly, the calendar works fine and is displayed correctly when it receives focus.

Doug and Bill, maybe I'm wrong, but the problem seems to be in the TextBox? widget, which is already calling _layoutHack() method in TextBox?.js. As far as I know DateTextBox? is used to render calendar functionality and TextBox? is used to display the date the user has just selected, right? So the problem might be on TextBox? widget since it's displaying a horizontal line instead of the text field itself.

Doug, as you requested, I'll try to explain what we are doing in the code so you can have an idea of what is happening. It would be easier (for you and me) to just copy and paste our code, but I can't do it due to copyright issues. I'll provide a standalone HTML file that demonstrates the problem soon. I tried to answer some of your questions bellow:

  • The DOM node that is replaced is a static HTML input type="text" with a given ID.
  • The createDateTextBox function is being called through dojo.addOnLoad() method.
  • style is a string variable, its value is "width: 100px; font: normal normal bold 1em verdana,arial,helvetica,sans-serif; background: rgb(255, 255, 0);".
  • userDateFormat is also a string variable, its value is "MM/dd/yyyy".

Please let me know if you have any question or need any other information.

Regards,

Marco

comment:8 Changed 11 years ago by Douglas Hays

Marco, this is a FF2 bug (fixed in FF3) which can be fixed by the end-user by doing ctrl+ followed by ctrl-
It seems to be timing related. The setTimeout in _layoutHack used to specify 50 (milliseconds) instead of 0 today. You can see if changing it back to 50 solves your issue. The problem is that 50 might not solve it on every system, just yours.

comment:9 Changed 11 years ago by Douglas Hays

Milestone: tbdfuture

Deferring until a standalone testcase can be provided - hopefully showing the problem on the latest svn trunk.

comment:10 Changed 11 years ago by Marco Yuri Fujii Melo

Hi Doug, setting timeout to 50ms didn't solve the issue. Next we tried to set it to 75ms, but with no success. As last try, we set to 1000ms, but it didn't solve the problem at all.

We're running out of ideas. Pressing CTRL plus plus followed by CTRL plus minus did solve the problem. I'm wondering if is there any way to do it automatically using JavaScript? to redraw/repaint the page without reloading it?

Any ideas?

Regards,

Marco

comment:11 Changed 11 years ago by Marco Yuri Fujii Melo

Hi Doug / Bill,

I did the method bellow as a workaround for the rendering issue:

function forceRepaint() {

if(dojo.isFF == 2) {

window.resizeBy(-10,-10); window.resizeBy(10,10);

}

}

Basically what it does is resize the browser window in order to repaint/redraw it without reloading it in the same way Ctrl plus + Ctrl plus - does. It still needs to be tested properly, but I think it solves this issue.

comment:12 Changed 11 years ago by Marco Yuri Fujii Melo

Another solution could be to just use the Dojo parser (parseOnLoad: true) and the tags provided by the toolkit instead of creating the DateTextBox? widget dynamically. This way we could avoid the timing issue, right?

comment:13 Changed 11 years ago by Eric Poulin

I experienced this same problem, but not only in DateTextBox?. I have this problem in DateTextBox?, ValidationTextBox? and ComboBox?. I managed to work around the Date and Validation textboxes by adding a setTimeout to the setValues on these when I use them. However, I cannot find a way to apply the same hack to the comboboxes. I'd love to find a fix for this, cause resizing the browser, although it works, is a terrible experience for users - especially when their browsers are maximized, as most users use FF.

comment:14 Changed 10 years ago by Douglas Hays

Resolution: wontfix
Status: newclosed

Support for FF 2.0 is being dropped in Dojo 1.4.

comment:15 Changed 9 years ago by bill

Component: DijitDijit - Form
Note: See TracTickets for help on using tickets.