infos@wais-fr.com (29) [Avatar] Offline
#1
I am testing this piece of code unsuccessfully for more than one day.
The symptom is that the second div (div data-stork-product="2012"/>smilie is never rendered.
So this piece of code did not work (on my test machine) in IE9 and Google Chrome.
It took me a lot of time to find what is the problem with your code.

Let me explain the context of my test. I built the third-party server as an ASP.NET MVC 3 application. This server is responsible to deliver the widget.js.
I built the client as a simple HTML page created in Visual Studio 2010. The content of this page is :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="./Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
</head>
<body>

page starts rendering


script is loading asynchronously ... (in all browsers)


<script type="text/javascript">
(function () {
var script = document.createElement('script');
script.type = 'text/javascript';
script.async = true;
script.src = 'http://widget.dev/ThirdPartyjavascript/js/BlockingWidget'
var entry = document.getElementsByTagName('script')[0];
entry.parentNode.insertBefore(script, entry);
} ());
</script>

<h1>Welcome</h1>
div data-stork-product="1337" />


div data-stork-product="2012" />


page has finished rendering


</body>
</html>

Note that the Doctype is XHTML 1.0 transitional.

Your code works only if the <div> elements are NOT self-closed.
So I suggest that you modify your sample to be :

div data-stork-product="1337"></div>
div data-stork-product="2012"></div>
<script>
(function() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.async = true;
script.src = 'widget.js'
var entry = document.getElementsByTagName('script')[0];
entry.parentNode.insertBefore(script, entry);
}());
</script>

Best regards
Henri d'Orgeval

Message was edited by:
infos@wais-fr.com
benvinegar (68) [Avatar] Offline
#2
Re: Listing 3.3 The script include snippet with separately-defined...
Hi Henri - it's very difficult for me to pick up your code snippets in this forum software. Could you try pasting snippets on Gist (http://gist.github.com)?
infos@wais-fr.com (29) [Avatar] Offline
#3
Re: Listing 3.3 The script include snippet with separately-defined...
the html snippet :
https://gist.github.com/1528436

Note that the Doctype is XHTML 1.0 transitional. Your code works only if the div elements are NOT self-closed. So I suggest that you modify your sample so that the two div elements with data-stork-product attribute are not self closed.

Message was edited by:
infos@wais-fr.com
benvinegar (68) [Avatar] Offline
#4
Re: Listing 3.3 The script include snippet with separately-defined...
Late reply, but ...

Apparently self-closing <div>s work if you're correctly returning an xhtml mimetype in addition to the doctype. But I'm sure few people don't do that, and it's the job of a good third-party script to work everywhere. So I'll change these.