The Author Online Book Forums are Moving

The Author Online Book Forums will soon redirect to Manning's liveBook and liveVideo. All book forum content will migrate to liveBook's discussion forum and all video forum content will migrate to liveVideo. Log in to liveBook or liveVideo with your Manning credentials to join the discussion!

Thank you for your engagement in the AoF over the years! We look forward to offering you a more enhanced forum experience.

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.