Search code examples
jsfiddle

POST to jsFiddle shows external resources in wrong order

With the form of this fiddle I successfully populate the HTML, JavaScript and External Resources of a new jsFiddle window, through a POST API call:

<form name='form' action='http://jsfiddle.net/api/post/library/pure/' target="_blank" method='POST'>
    <input type='text' name='title' value='some title' /><br />
    <input type='text' name='description' value='some description' /><br />
    <input type='text' name='html' value='<div id=&quot;chart_div&quot;></div>' /><br />
    <input type='text' name='js' value='$(function() { $.jqplot(&apos;chart_div&apos;, [[3,7,9,1,4]]); });' /><br />
    <input type='text' name='resources' value='https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/themes/smoothness/jquery-ui.css,https://cdn.jsdelivr.net/excanvas/r3/excanvas.js,https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js,https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js,http://cdn.jsdelivr.net/jqplot/1.0.8/jquery.jqplot.min.css,http://cdn.jsdelivr.net/jqplot/1.0.8/jquery.jqplot.min.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.barRenderer.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.categoryAxisRenderer.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.dateAxisRenderer.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.logAxisRenderer.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.enhancedLegendRenderer.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.canvasAxisTickRenderer.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.canvasAxisLabelRenderer.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.canvasTextRenderer.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.canvasOverlay.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.pointLabels.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.highlighter.js,http://cdn.jsdelivr.net/jqplot/1.0.8/plugins/jqplot.cursor.js' /><br />
    <input type='text' name='wrap' value='h' /><br />
    <input type='text' name='dtd' value='html 5' /><br />
    <input type="submit" value="Submit" /><br />
</form>

What I should get is this: a nice JavaScript chart.

However, External Resources are not always populated in the same order, and the chart may not show up.

Is this a known bug? Any workaround or fix?

Later Edit: Confirmed by jsFiddle's developer on GitHub: it is a bug. It won't be fixed, while they are working on a new version with important design changes.

Solution

  • Workaround: Pass all external resources as link/script HTML tags.

    One day later, after looking at their JS code: each resource is added through an asynchronous AJAX call, so some calls may return sooner than others.