Apple's AJAX example can give Firefox problems

classic Classic list List threaded Threaded
11 messages Options
Reply | Threaded
Open this post in threaded view
|

Apple's AJAX example can give Firefox problems

Foteos  Macrides
I'm not certain this is a layout issue, but I'll start out by asking here.

Apple has an AJAX example:

http://developer.apple.com/internet/webcontent/XMLHttpRequestExample/example.html

which works fine when I try it via that URL with Firefox v1.5.0.4
(rv1.8.0.4) on my PC with Windows XP, as well as when I try it with IE 6.0
SP2 and Opera 8.54.  When I downloaded the files (the example.html and four
.xml files) and set up the example on my server:

http://www.macridesweb.com/oltest/example.html

it continues to work fine with IE and Opera, but Firefox has a display
problem.  First choose a Category in the top select box, which causes the
Items select box to expand, then choose an Item, which causes an image and
text to be displayed beneath that select box.  There should be a "gutter"
between the image and the text, and there is initially and very briefly with
Firefox, but then the text jumps to the left and the gutter is obliterated
(yet persists nicely with IE and Opera).  I checked and both the Apple
server and my (Apache) server are indicating a Content-Type of text/html for
the example.html file (which, however, has an XHTML DOCTYPE), and text/xml
for the four .xml files (that get fetched via the XMLHttpRequest object).  I
also checked that the downloaded files are identical to those sent
dynamically by the Apple server.  The markup in the files is "less than
perfect" (e.g.., example.html has <html> rather than </html> at the bottom),
but when I tried fixing up such problems to the point where the W3C
validator was happy, the Firefox-specific "disappearing gutter" problem
persisted.

What might be causing that problem for Firefox?

Regards,
Fote
--


_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout
Reply | Threaded
Open this post in threaded view
|

Re: Apple's AJAX example can give Firefox problems

Martin Honnen-3
Foteos Macrides wrote:

> I'm not certain this is a layout issue, but I'll start out by asking here.
>
> Apple has an AJAX example:
>
> http://developer.apple.com/internet/webcontent/XMLHttpRequestExample/example.html
>
> which works fine when I try it via that URL with Firefox v1.5.0.4
> (rv1.8.0.4) on my PC with Windows XP, as well as when I try it with IE 6.0
> SP2 and Opera 8.54.  When I downloaded the files (the example.html and four
> .xml files) and set up the example on my server:
>
> http://www.macridesweb.com/oltest/example.html
>
> it continues to work fine with IE and Opera, but Firefox has a display
> problem.  First choose a Category in the top select box, which causes the
> Items select box to expand, then choose an Item, which causes an image and
> text to be displayed beneath that select box.  There should be a "gutter"
> between the image and the text, and there is initially and very briefly with
> Firefox, but then the text jumps to the left and the gutter is obliterated
> (yet persists nicely with IE and Opera).  

I have checked the layout with DOM inspector and there is a table row
with three cells, the space between the left cell (with the image link)
and the right cell (with the text) is supposed to be created by a spacer
image in the middle cell <http://www.macridesweb.com/images/spacer.gif>
but that image is not on your server, it gives a 404.
That explains the difference you see between the Apple example and your
attempt to copy it.


--

        Martin Honnen
        http://JavaScript.FAQTs.com/
_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout
Reply | Threaded
Open this post in threaded view
|

Re: Apple's AJAX example can give Firefox problems

Foteos  Macrides
"Martin Honnen" <[hidden email]> wrote in message
news:[hidden email]...

>> . . .  There should be a "gutter" between the image and the text, and
>> there is initially and very briefly with Firefox, but then the text jumps
>> to the left and the gutter is obliterated (yet persists nicely with IE
>> and Opera).
>
> I have checked the layout with DOM inspector and there is a table row with
> three cells, the space between the left cell (with the image link) and the
> right cell (with the text) is supposed to be created by a spacer image in
> the middle cell <http://www.macridesweb.com/images/spacer.gif> but that
> image is not on your server, it gives a 404.
> That explains the difference you see between the Apple example and your
> attempt to copy it.

Martin,

Thanks for the diagnosis!

The Apple developer's site has a link for downloading that file set as
xmlhttprequest.dmg and encourages developers to play with it on their own
servers.  All of the "displaying" images have complete URLs in their src
attribute values, pointing to the images at Apple's site.  I changed those
partial URLs for the transparent spacer gifs into complete URLs as well, so
that the file set is now really portable across servers as the one .html and
four .xml files.  Is there a simple way to determine in Firefox that 404's
(or other errors) are being returned for such objects, short of manually
sending out requests for the complete URLs?

So this really is a layout issue.  The XML files fetched via the responseXML
of the XMLHttpRequest object include "plain Jane" HTML tables (marked as
<![CDATA[  . . .  ]]> in the "Content-Type: text/xml" transmission), and
those use <td width="10"><img width="10"  . . .  spacer.gif></td> blocks
intended to create the 10px "gutter" between the "displaying" image on the
left and the text on the right.  Both IE and Opera respect the width
attribute in the td start tag if the td cell is empty, and thus don't care
if the transparent spacer gif gets loaded, but in contrast Firefox initially
creates the 10px "gutter" based on the td start tag's width attribute, then
jumps to the left and obliterates the gutter when it gets the 404 for the
transparent spacer image.

It's all coming back to me now. . .  This is a throwback to the original
Netscape days when we first started using table markup simply as a layout
mechanism, and would gob up our tables with lots of transparent gifs to make
the original Netscape respect our wishes.  What with all the wonderfulness
now in Firefox, can't this "antique inadequacy" relative to all the other
browsers finally be remedied?  (Respect the width attribute of the td start
tag as a minimum display width even if the cell is empty!!!  :<)  :<)

Fote
--
 


_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout
Reply | Threaded
Open this post in threaded view
|

Re: Apple's AJAX example can give Firefox problems

Boris Zbarsky
Foteos Macrides wrote:
>  (Respect the width attribute of the td start
> tag as a minimum display width even if the cell is empty!!!  :<)  :<)

Do you have a page showing this problem?

-Boris
_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout
Reply | Threaded
Open this post in threaded view
|

Re: Apple's AJAX example can give Firefox problems

Foteos  Macrides
"Boris Zbarsky" <[hidden email]> wrote in message
news:[hidden email]...
> Foteos Macrides wrote:
>>  (Respect the width attribute of the td start
>> tag as a minimum display width even if the cell is empty!!!  :<)  :<)
>
> Do you have a page showing this problem?
>
> -Boris

In

http://www.macridesweb.com/gutterTest.html

I have one of the tables from the Apple example file set reiterated three
times vertically.  The top table has a valid URL for the transparent spacer
gif, and so the gutter intended via the middle td cell is present for all
three browsers (Firefox, IE and Opera).  The middle table has an invalid URL
for the spacer gif.  The gutter persists for IE and Opera, but with Firefox
the gutter is present while the status bar indicates that it is fetching the
image, then the right cell jumps left to obliterate the gutter when the 404
is received.  I can see that clearly on DSL, so it probably is not too fast
to be seen on T1 as well.  The bottom table shows that I'm wrong about the
other browsers respecting the td cell's width attribute when the cell has
only collapsible white space (is "empty").

Regards,
Fote
--


_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout
Reply | Threaded
Open this post in threaded view
|

Re: Apple's AJAX example can give Firefox problems

Boris Zbarsky
Foteos Macrides wrote:
> http://www.macridesweb.com/gutterTest.html

Ah, thanks.

>  The bottom table shows that I'm wrong about the
> other browsers respecting the td cell's width attribute when the cell has
> only collapsible white space (is "empty").

Hmmm....  I wonder what's up there.  Table layout sucks.  :(

In any case, for Gecko in standards mode an <img> that returns 404 is exactly
equivalent to the alt text for layout purposes (as required by the HTML
specification).  In quirks mode, if the size is specified we will make the image
that size, precisely because of pages using spacer gifs.

But this page is in standards mode, so it gets the standards treatment.

-Boris
_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout
Reply | Threaded
Open this post in threaded view
|

Re: Apple's AJAX example can give Firefox problems

Foteos  Macrides
"Boris Zbarsky" <[hidden email]> wrote
> .  .  .  for Gecko in standards mode an <img> that returns 404 is exactly
> equivalent to the alt text for layout purposes (as required by the HTML
> specification).  In quirks mode, if the size is specified we will make the
> image that size, precisely because of pages using spacer gifs.
>
> But this page is in standards mode, so it gets the standards treatment.

Boris,

Thanks for clueing me in on that.  My gutterTest.html file now redirects to:

http://www.macridesweb.com/gutterTestStandards.html

which has a Transitional DOCTYPE with a URL for loose.dtd, and I've added:

http://www.macrideweb.com/gutterTestQuirks.html

which has a Transitional DOCTYPE without the URL.  It confirms that invoking
quirks mode does make Firefox behave like the other browsers for this kind
of markup.

This looks like it is going to be another fine point (a.k.a., "headache")
when using XMLHttpRequest to swap in markup fragments.  Here is what appears
to be the "bottom line" in that Apple example:

http://developer.apple.com/internet/webcontent/XMLHttpRequestExample/example.html

on its Developer Connection:

http://developer.apple.com/internet/webcontent/xmlhttpreq.html

It is using text/xml with the XMLHttpRequest object's responseXML, so you
might think that the browser's checks for well-formedness will avoid such
problems, but in fact it is "sneaking in" old-fashioned HTML that was
originally done in what is now termed quirks mode by using <![CDATA[  .  .
.  ]]> and Firefox is being "selectively penalized" for doing "the right
thing" with that.  Those Apple resources are becoming very popular, and
amount to inadvertent guidance on how to perform that "back door" trick with
"modern objects" intended to avoid such portability problems.  Sigh .  .  .

Apple is also using .innerHTML for browsers which implement it in that
context (on Windows PCs, that includes Firefox and Opera), so here's another
portability issue that might be of interest to you.  Your implementation of
innerHTML creates well-formed markup in that context, e.g., for
responseXML.documentElement.innerHTML  (with
xmlns="http://www.w3.org/1999/xhtml").  Opera does not, but doesn't seem to
care when you use the ill-formed markup it returned.  IE's innerHTML also
would be ill-formed, but can't be used in that context, e.g.,
responseXML.documentElement.innerHTML yields an error, perhaps because IE
does care that the markup it created is ill-formed.  However, IE offers an
xml object, which is the homolog of the innerHTML object for that context,
e.g., responseXML.documentElement.xml yields well-formed markup in IE, like
Firefox's responseXML.documentElement.innerHTML.   I don't know if you want
to use the "de facto standard" rationale for this issue, but since you've
already done it (and "properly") for innerHTML, it should now be a snap to
make the equivalent available as an xml object.

Regards,
Fote
--


_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout
Reply | Threaded
Open this post in threaded view
|

Re: Apple's AJAX example can give Firefox problems

Martijn-4
On 6/20/06, Foteos  Macrides <[hidden email]> wrote:

> Apple is also using .innerHTML for browsers which implement it in that
> context (on Windows PCs, that includes Firefox and Opera), so here's another
> portability issue that might be of interest to you.  Your implementation of
> innerHTML creates well-formed markup in that context, e.g., for
> responseXML.documentElement.innerHTML  (with
> xmlns="http://www.w3.org/1999/xhtml").  Opera does not, but doesn't seem to
> care when you use the ill-formed markup it returned.  IE's innerHTML also
> would be ill-formed, but can't be used in that context, e.g.,
> responseXML.documentElement.innerHTML yields an error, perhaps because IE
> does care that the markup it created is ill-formed.  However, IE offers an
> xml object, which is the homolog of the innerHTML object for that context,
> e.g., responseXML.documentElement.xml yields well-formed markup in IE, like
> Firefox's responseXML.documentElement.innerHTML.   I don't know if you want
> to use the "de facto standard" rationale for this issue, but since you've
> already done it (and "properly") for innerHTML, it should now be a snap to
> make the equivalent available as an xml object.

So you want a .xml property for Mozilla?
Note that you already can do:
 var s = new XMLSerializer();
 var d = responseXML.documentElement;
 var str = s.serializeToString(d);
 alert(str);

This was taken from:
http://developer.mozilla.org/en/docs/XMLSerializer

Regards,
Martijn

> Regards,
> Fote
> --
>
>
> _______________________________________________
> dev-tech-layout mailing list
> [hidden email]
> https://lists.mozilla.org/listinfo/dev-tech-layout
>
_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout
Reply | Threaded
Open this post in threaded view
|

Re: Apple's AJAX example can give Firefox problems

Foteos  Macrides
In reply to this post by Foteos Macrides
"Martijn" <[hidden email]> wrote:

> On 6/20/06, Foteos  Macrides <[hidden email]> wrote:
>> .  .  .   I don't know if you want
>> to use the "de facto standard" rationale for this issue, but since you've
>> already done it (and "properly") for innerHTML, it should now be a snap
>> to
>> make the equivalent available as an xml object.
>
> So you want a .xml property for Mozilla?
> Note that you already can do:
> var s = new XMLSerializer();
> var d = responseXML.documentElement;
> var str = s.serializeToString(d);
> alert(str);
>
> This was taken from:
> http://developer.mozilla.org/en/docs/XMLSerializer

Martijn,

Note this statement at the top of that document:

XMLSerializer is mainly useful for applications and extensions based on
Mozilla platform. While it's available to web pages, it's not part of any
standard and level of support in other browsers is unknown.

and XMLSerializer existed and was discussed at length back during the thread
in netscape.public.mozilla.dom:

http://groups.google.com/group/netscape.public.mozilla.dom/browse_frm/thread/6630d3d65310f589/48f8da7a71529c0b?tvc=1&q=Problem+with+DOMParser+for+img+elements#48f8da7a71529c0b

during which Boris became motivated to actually act on his bug 155723

https://bugzilla.mozilla.org/show_bug.cgi?id=155723

so that the Gecko innerHTML works "properly" in XHTML documents.

IMHO we are still many years away from the day when the great majority of
browsers actually in use will have the same serializer with both the
behavior AND object names of a W3C standard, and even then there will be the
issue of "heritage" documents on the web.  Whatever one's personal feeling
might be about one organization versus another, I don't see why one
organization's "proprietary" objects should be considered sufficient.

This is a "portability" issue, not a "capability" issue.

Regards,
Fote
--


_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout
Reply | Threaded
Open this post in threaded view
|

Re: Apple's AJAX example can give Firefox problems

Martijn-4
On 6/20/06, Foteos  Macrides <[hidden email]> wrote:
> IMHO we are still many years away from the day when the great majority of
> browsers actually in use will have the same serializer with both the
> behavior AND object names of a W3C standard, and even then there will be the
> issue of "heritage" documents on the web.  Whatever one's personal feeling
> might be about one organization versus another, I don't see why one
> organization's "proprietary" objects should be considered sufficient.
>
> This is a "portability" issue, not a "capability" issue.

Ok, so in that case, maybe you should raise this on the whatwg mailing list?
You want a .xml property similar to the .xml property of Internet Exlorer, then?

Regards,
Martijn

> Regards,
> Fote
> --
>
>
> _______________________________________________
> dev-tech-layout mailing list
> [hidden email]
> https://lists.mozilla.org/listinfo/dev-tech-layout
>
_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout
Reply | Threaded
Open this post in threaded view
|

Re: Apple's AJAX example can give Firefox problems

Foteos  Macrides
In reply to this post by Foteos Macrides
"Martijn" <[hidden email]> wrote:

> On 6/20/06, Foteos  Macrides <[hidden email]> wrote:
>> IMHO we are still many years away from the day when the great majority of
>> browsers actually in use will have the same serializer with both the
>> behavior AND object names of a W3C standard, and even then there will be
>> the
>> issue of "heritage" documents on the web.  Whatever one's personal
>> feeling
>> might be about one organization versus another, I don't see why one
>> organization's "proprietary" objects should be considered sufficient.
>>
>> This is a "portability" issue, not a "capability" issue.
>
> Ok, so in that case, maybe you should raise this on the whatwg mailing
> list?
> You want a .xml property similar to the .xml property of Internet Exlorer,
> then?

Martijn,

This type of portability is basically a form of error handling.  Generating
a "standard" for IE's xml beyond what the Microsoft folks already offer
would be kinda like closing the doors after the horse has left the barn.

The Firefox innerHTML since Boris "fixed" it last year is much better than
IE's or Opera's innerHTML when you look at the strings that are being
generated, and closer to what you might expect if a consensus standard had
been generated before it was implemented, particularly if you compare the
outputs for HTML versus XHTML (with the XHTML served as text/html, and
application/xhtml+xml indicated only in a meta tag so that IE doesn't force
a download offer).  But the really important thing is that since that bug
"fix" I have not encountered anything on the web which was originally
written for IE's (and Opera's) innerHTML which causes problems for Firefox.

I suspect a similarly happy situation would materialize if Firefox treated

var str = foo.xml

as an instruction to assign the string from XMLSerializer's
serializeToString(foo) to str, and I presume that would be trivial to
implement.

Regards,
Fote
--


_______________________________________________
dev-tech-layout mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-tech-layout