Prototype DOM-traversal methods failing on HTML5 elements in IE < 9 using html5shiv

[Jonny Nott]

Using html5shiv 1.6.2 (latest) (http://code.google.com/p/html5shiv/)
and Prototype v1.7..

So, html5shiv makes <article>, <section> etc elements work nicely in
IE<9 .. they appear, you can style them etc. All good. The HTML5
elements all exist within the IE DOM tree in Developer Tools.

However, when you try to grab any such HTML5 elements using
Prototype's DOM-traversal methods (e.g. down(), up()), then they
always return undefined in IE8/IE7 (who cares about IE6?). For
example:

<article id="foo">
<div></div>
<section></section>
<ul id="abc123"></ul>
</article>

..then..

var bar = $('foo').down('div'); // works
var baz = $('foo').down('section'); // undefined

..and..

var theArticle = $('abc123').up('article'); // undefined

Is this a gaping hole/bug?

Code to reproduce: http://pastebin.com/TC1Dp5At

Jon

[Walter Lee Davis]

Try adding this line in a dom:loaded callback, inside an IE
conditional comment:

$w('article aside details figcaption figure footer header hgroup menu
nav section').each(function(elm){
new Element(elm);
});

As far as I know, IE won't let you script something unless you build
one such in memory first. Once you do that, you're golden. Not sure if
I'm just duplicating what HTML5shiv is supposed to do, but this is the
way I've done it before.

Walter

[Jonny Nott]

I *think* this is exactly what html5shiv is doing. Could try adding
your suggestion into the test HTML on pastebin, but I'm not at my
computer right now :(

[Walter Lee Davis]

One thought, is HTML5shiv loading before or after Prototype?

Walter

> --
> You received this message because you are subscribed to the Google
> Groups "Prototype & script.aculo.us" group.
> To post to this group, send email to prototype-s...@googlegroups.com
> .
> To unsubscribe from this group, send email to prototype-scripta...@googlegroups.com
> .
> For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en
> .
>

[T.J. Crowder]

On Jun 30, 5:44 pm, Jonny Nott <jonn...@gmail.com> wrote:
[snip]

> Is this a gaping hole/bug?

I'm sure the core folks have thick skins, but was "gaping" _really_
necessary?

Correct, that's exactly what html5shiv does: Creates elements using
the new tags so that IE understands that those tags are elements.

It looks like a bug in the old version of Sizzle that Prototype
incorporates. You can see it vs. the current version of Sizzle (in
jQuery) here:
http://jsbin.com/osufay

In contrast, if I go back to an earlier version of jQuery with an
older Sizzle, it fails in the same sort of way:
http://jsbin.com/osufay/2

And if I go back to Prototype 1.6.0 (which didn't use Sizzle, it had
its own selector engine), it works:
http://jsbin.com/osufay/3

So it was a bug in Sizzle that's been fixed. The fix would be to
upgrade the Sizzle bundled in Prototype to the latest version.
--
T.J. Crowder
Independent Software Engineer
tj / crowder software / com
www / crowder software / com

[Jonny Nott]

Thanks Mr Crowder! You the man, as always..

[Jonny Nott]

So, any news on Prototype 1.7.0.1, 1.7.1 or 1.8? Assuming it'll have
the latest sizzlejs included?

[T.J. Crowder]

Hi,

On Jul 1, 1:52 am, Jonny Nott <jonn...@gmail.com> wrote:
> Aha, Mr Crowder, you always have the answers! Thanks.
>
> So, any news on Prototype v 1.7.0.1, 1.7.1 or 1.8? Will the next
> version have the latest Sizzle in?

If the question is directed at me: I have no idea, I'm not involved
with Prototype's development. I'd _assume_ that any release of
Prototype would include the latest Sizzle unless there was a breaking
API change in Sizzle making grabbing the latest difficult, which could
cause a delay. The primary Sizzle API[1] consists of just three
functions, but who knows, maybe Prototype had to go under the covers
in order to provide some of Prototype's features. The Sizzle in jQuery
1.4.2, released 19 Feb 2010, doesn't have this `article` problem; the
Sizzle in Prototype 1.7, released nine months later (16 Nov 2010),
does (http://jsbin.com/osufay/4).

On the face of it, given Sizzle is meant to be self-contained and
Prototype supports pluggable selector engines, it should be trivial.
And in about 15 minutes I was able to copy my local prototype-1.7.js
file and swap in the Sizzle from the uncompressed jQuery 1.6.1[2]. The
result worked in our `up` test case. But I tend to assume it can't be
quite that easy and other things would be broken. I don't have the
time to go any further with it, but if anyone wants to follow the
recipe and run it through a test suite, here it is:

Copy prototype-1.7.js and replace lines 3,966-4,937 (inclusive) with
lines 3,700-5,106 (inclusive) from jQuery 1.6.1 uncompressed
release[2]. For visual reference:

prototype-1.7.js: Start and end lines starred:

3964 })();
3965 Prototype._original_property = window.Sizzle;
* 3966 /*!
3967 * Sizzle CSS Selector Engine - v1.0
3968 * Copyright 2009, The Dojo Foundation
...
4936 return Sizzle.filter( later, tmpSet );
* 4937 };
4938
4939
4940 window.Sizzle = Sizzle;

jquery-1.6.1.js: Start and end lines starred:

3696 });
3697
3698
3699
* 3700 /*!
3700 * Sizzle CSS Selector Engine
...
5105 return Sizzle.filter( later, tmpSet );
* 5106 };
5107
5108 // EXPOSE
5109 jQuery.find = Sizzle;

But again: I have no idea if that's all that's required, just that the
result worked in our `up` case finding `article`. It probably isn't
that easy.

Perhaps post a new thread asking about an update with just the latest
Sizzle.

Best,

--
T.J. Crowder
Independent Software Engineer
tj / crowder software / com
www / crowder software / com

[1] https://github.com/jquery/sizzle/wiki/Sizzle-Home
[2] http://code.jquery.com/jquery-1.6.1.js

[Jonny Nott]

Great, have switched out that sizzlejs chunk, and all is good. Was
gonna just switch back to 1.6.0 for the project concerned, but I'm
using Element.Storage, so boo :(

[Jonny Nott]

Hopefully core team can sort out a bugfix release for 1.7 that updates
to a newer sizzlejs, solving this problem.. Have posted in Prototype
Core, but awaiting moderation..

[Andrew Dupont]

Yeah, I can confirm we'll update to the latest version of Sizzle
before we 1.7.0.1 (which is a soon-ish release).

Cheers,
Andrew